一、載入和運行 Javascript代碼執行會阻塞其他瀏覽器處理過程、充分利用webpack或gulp工具對文件打包壓縮，減少js文件的數量，從而減少http請求的次數，以提高網頁應用的實際性能。 二、數據訪問 經典電腦科學的一個問題是確定數據應當存放在什麼地方、以實現最佳的讀寫效率。數據存儲在哪 ...
一、載入和運行
Javascript代碼執行會阻塞其他瀏覽器處理過程、充分利用webpack或gulp工具對文件打包壓縮，減少js文件的數量，從而減少http請求的次數，以提高網頁應用的實際性能。
二、數據訪問
經典電腦科學的一個問題是確定數據應當存放在什麼地方、以實現最佳的讀寫效率。數據存儲在哪裡會關係到代碼運行期間數據被檢索到的速度。
JS中的四種基本的數據存儲位置：直接量（字元串、數字、布爾值、對象、數組、函數、正則、null、undefind）、變數、數組項、對象成員。
每一種數據存儲位置都具有特定的讀寫操作負擔。直接量和局部變數的訪問速度要快於數組項和對象成員的訪問速度。因此儘量使用直接量和局部變數，限制數組項和對象成員的使用。
對所有的瀏覽器來說，一個標識符所處的位置越深，讀寫它的速度就越慢。在函數體內中，如果對於使用多於一次的變數值，就儘量用局部變數存儲本地範圍之外的變數值。
局部變數比域外變數快，是因為他位於作用域鏈的第一個對象中。變數在作用域鏈的位置越深，訪問的實際就越長。全局變數總是最慢的，因為它們總是位於作用域鏈的最後一環。
嵌套對象成員會造成重大性能影響，應儘量少用。
三、DOM編程
文檔對象模型（DOM）是一個獨立於語言的，使用XML和HTML文檔操作的應用程式介面。DOM和JS（ECMAScript）相互獨立並以功能介面連接，因此每次通過js訪問或修改DOM就會帶來性能損耗。
一般而言，對於任何類型的DOM訪問，假如同一個DOM屬性或方法被訪問一次以上，最好使用一個局部變數緩存此DOM成員。
重繪和重排：當DOM改變影響到元素的幾何屬性（寬高）或其內部內容時，瀏覽器需要重新計算元素的幾何屬性，而且其他元素的幾何屬性和位置也會因此改變受到影響。瀏覽器使渲染樹上受到的部分失效，然後重構渲染樹。這個過程被稱作重排。重排版完成時，瀏覽器會在一個重繪進程中重新繪製屏幕上受影響的部分。
引發重排的幾個原因：
1、添加或刪除可見的DOM元素
2、元素位置改變
3、元素尺寸改變（盒子模型）
4、內容改變
5、最初的頁面渲染
6、瀏覽器視窗尺寸的改變
針對重排和重繪引發的性能問題可以通過批量修改、離線操作DOM樹、緩存並減少對佈局信息的訪問來降低其帶來的影響。
事件托管技術可以最小化事件句柄數量。
四、演算法和流程式控制制
JS中的for-in迴圈可枚舉任何對象的命名屬性（包括對象的實例屬性和繼承而來的屬性），一般不推薦使用。
JavaScript引擎所支持的遞歸數量與JavaScript調用棧的大小直接相關。
五、響應介面
大多數瀏覽器有一個單獨的處理進程，它由兩個任務所共用：JavaScript任何和用戶界面更新任務（UI線程）。
一個單一的JavaScript操作應當使用的總時間（最大）是100毫秒。
當多個重覆的定時器被同事創建會產生性能問題。因為只有一個UI線程，所有定時器競爭運行時間。
六、Ajax 非同步JavaScript和XML
ajax是一種與伺服器通訊而不重載當前頁面的方法。
Beacons（燈標）：JS用於創建一個新的Image對象，將src設置為伺服器上一個腳本文件的url，該url包含希望通過get格式傳回的鍵值對數據。
作為數據格式，純文本和HTML是高度限制的，但其可以節省客戶端的CPU周期。XML應用廣泛但非常冗長且解析緩慢。json是輕量級、解析迅速，交互性和XML相當。自定義格式非常輕量。總而言之，越輕量級的格式越好，最好是json和字元分割的自定義格式。
七、編程實踐
eval()、Function()構造器、定時器（setTimeout()和setInterval()）四種函數可以允許在程式中獲取一個包含代碼的字元串然後運行它。但此時會付出二次評估的代價，與直接包含相應代碼相比將占用更長的時間。
定時器建議第一個參數傳入一個函數而不是一個字元串，否則會造成記憶體泄漏。
JS的原生部分一般是用低級語言寫的，如C++，所以無論怎樣優化JS代碼，永遠不會比JS引擎提供的原生方法更快，比如內置的Math對象提供的諸多方法。
