第1章：加載和執行 1
1.1 腳本位置
- 由于腳本會阻塞頁面其他資源的下載下傳，是以，盡可能将所有的script放在body最底部
1.2 組織腳本
- 減少script數量 當script的type為text/html時，仍然會影響速度嗎？
- 合并多個檔案 當script長度受限制時，怎麼做？
- comobo
1.3 無阻塞的腳本
- 在window的load事件觸發後再下載下傳腳本
- 使用defer延遲
<script src="xxx.js" defer></script>
- 動态建立
<script>
<head>
<body>
- 動态加載
KISSY.getScript(url , { success : success , charset : charset });
- XMLHttpRequest腳本注入，使用get方法，局限相同的域
- 推薦做法：先添加動态加載所需的代碼，然後加載初始化頁面所需的剩下的代碼：LazyLoad
1.4 小結
第2章：資料通路 15
- 直接量 > 局部變量 > 數組元素、對象成員
- 通路數組len複制給局部變量
var len = arr.length;
- 局部變量位于作用域鍊的起始位置
-
with
try{} catch(){}
- 閉包需要更多記憶體開銷
- 内部屬性[[scope]]包含了一個函數被建立的作用域中對象的集合，這個集合即函數的作用域鍊。
- 含有閉包的函數執行時建立的活動對象為運作期上下文作用域鍊中的第一個對象，其含有的閉包被建立時[[scope]]屬性被初始化為這些對象；閉包中建立的辨別符如
var id = "xdi9592"
- hasOwnProperty
- instanceOf
- 嵌套成員，對象成員嵌套越深，通路速度越慢
- 多次通路同一個對象成員，則需要做緩存，即将對象成員指派給局部變量
第3章：DOM程式設計 35
- 适當緩存通路到的DOM
- 盡量減少操作DOM的次數
- innerHTML優于原生建立DOM
- 節點克隆優于原生建立DOM
- 通路HTML集合拷貝到數組中，并設定局部變量
- 緩存集合length屬性
- nextSibling優于childNodes
- children優于childNodes
- querySelectorAll優于getElementsByTagName()
- 重排：浏覽器将受影響的部分失效，重新構造渲染樹；如增、删DOM、位置、尺寸、視窗
- 重繪：完成重排後，重新繪制受影響的部分
- 最小化重繪與重排
- 緩存布局資訊
- 讓元素脫離文檔流
- 事件委托：由于浏覽器跟蹤每個事件處理器占用很多記憶體，是以将事件代理到父元素
第4章：算法和流程控制
- for;while;do{}while;for(var prop in object){}
- for in 性能較差
- 減少循環疊代次數,可以使用switch
- 優化嵌套if-else
- 調用棧溢出，适當改為疊代算法
第5章：字元串和正規表達式
- 将
str += "one" + "two"
str = str + "one" + "two"
- strs.join(“”);在IE7中性能較好
- str = str.concat(s1);較慢
- 将正規表達式指派給一個變量，提高性能
- 對于事先知道字元串的哪一部分将被測試時，适用字元串方法，如slide(),substr(),substring(),indexOf(),lastIndexOf()
- 回溯是正則性能的根源；利用互斥、反向引用
- trim方法，用兩次正則比用一次正則好，如
-
str.replace(/^\s+/,"").replace(/\s+$/,"")
- str.replace(“/^\s|\s+$/g”,””);
-
- 貪婪()比懶惰?好
第6章：快速響應的使用者界面 107
- 浏覽器UI線程：單線程
- 浏覽器限制：
- 調用棧大小限制
- 長時間運作腳本限制
- IE小于500萬條語句
- FF: 10s
- Safari: 5s
- Chrome: 無限制
- 定時器的使用
- 《可用性工程》
- Web Worker
6.1 浏覽器UI線程 107
6.1.1 浏覽器限制 109
6.1.2 多久才算“太久”？ 110
6.2 使用定時器讓出時間片段 111
6.2.1 定時器基礎 112
6.2.2 定時器的精度 114
6.2.3 使用定時器處理數組 114
6.2.4 分割任務 116
6.2.5 記錄代碼運作時間 118
6.2.6 定時器與性能 119
6.3 Web Workers 120
6.3.1 Worker運作環境 120
6.3.2 與Worker通信 121
6.3.3 加載外部檔案 122
6.3.4 實際應用 122
6.4 小結 124
第7章：Ajax 125
- XHR
- GET參數限制小于2018
- 跨域限制
- Dynamic
- 可跨域
- 隻能GET
- 不能設定請求頭
- 不能是純CML、JSON，而必須封裝在回調中，如
-
jsonback({"status":1})
-
- MXHR
- PHP方法：base64-encode
- 合并圖檔請求
-
src='data:img/jpeg;base64,........'
-
7.1 資料傳輸 125
7.1.1 請求資料 125
7.1.2 發送資料 131
7.2 資料格式 134
7.2.1 XML 134
7.2.2 JSON 137
7.2.3 HTML 141
7.2.4 自定義格式 142
7.2.5 資料格式總結 144
7.3 Ajax性能指南 145
7.3.1 緩存資料 145
7.3.2 了解Ajax類庫的限制 148
7.4 總結 149
第8章：程式設計實踐 151
8.1 避免雙重求值（Double Evaluation） 151
8.2 使用Object/Array直接量 153
8.3 不要重複工作 154
8.3.1 延遲加載 154
8.3.2 條件預加載 156
8.4 使用速度快的部分 156
8.4.1 位操作 156
8.4.2 原生方法 159
8.5 小結 161
第9章：建構并部署高性能JavaScript應用
9.1 Apache Ant 163
9.2 合并多個JavaScript檔案 165
9.3 預處理JavaScript檔案 166
9.4 JavaScript壓縮 168
9.5 建構時處理對比運作時處理 170
9.6 JavaScript的HTTP壓縮 170
9.7 緩存JavaScript檔案 171
9.8 處理緩存問題 172
9.9 使用内容分發網絡（CDN） 173
9.10 部署JavaScript資源 173
9.11 靈活JavaScript建構過程 174
9.12 小結 175
第10章：工具 177
10.1 JavaScript性能分析 178
10.2 YUI Profiler 179
10.3 匿名函數 182
10.4 Firebug 183
10.41 控制台面闆分析工具 183
10.4.2 Console API 184
10.4.3 網絡面闆 185
10.5 IE開發人員工具 186
10.6 Safari Web檢視器 188
10.6.1 描述檔案面闆 189
10.6.2 資源面闆 191
10.7 Chrome開發人員工具 192
10.8 腳本阻塞 193
10.9 Page Speed 194
10.10 Fiddler 196
10.11 YSlow 198
10.12 dyna Trace Ajax Edition 199
10.13 總結 202
![主流浏覽器四大綜合性能測試[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)