標(biāo)簽：前端 讀書筆記
簡介
《javascript高級(jí)程序設(shè)計(jì)》的作者寫的書佑惠，主要內(nèi)容就是從各方面入手提升JS程序的性能憋飞。
第一章 加載與執(zhí)行
- 無阻塞地加載JS代碼：腳本放到最后敏弃，defer屬性笛辟，動(dòng)態(tài)<script>標(biāo)簽。
第二章 數(shù)據(jù)存取
- 盡量使用字面量宫患；
- 注意作用域鏈的深度刊懈，少進(jìn)行跨域訪問；
- 經(jīng)常訪問的變量存為局部變量娃闲。
第三章 DOM編程
- 避免重繪與重排：要注意訪問某些屬性也會(huì)觸發(fā)重排：offsetXXX, scrollXXX, clientXXX;
- 最小化重繪與重排：將受影響的元素抽出來（display:none..）操作后再插入
- 動(dòng)畫使用絕對(duì)定位虚汛；
- 使用事件委托（多個(gè)元素共用一個(gè)事件回調(diào)）來減少回調(diào)的數(shù)量；
- 注意getElementByXXX獲取到的HTML集合皇帮，會(huì)消耗大量資源卷哩。
第四章 算法與流程控制
- 改善循環(huán)：減少每次循環(huán)的工作量（使用負(fù)循環(huán)）;減少循環(huán)次數(shù)（例如達(dá)夫設(shè)備）
- 用迭代代替遞歸，因?yàn)闉g覽器可能有調(diào)用棧限制属拾；
- 使用函數(shù)緩存（Memoization）将谊，就是將曾經(jīng)輸入過的參數(shù)的結(jié)果緩存起來冷溶；
第五章 字符串與正則
沒看
第六章 快速響應(yīng)的用戶界面
- 將程序每次執(zhí)行的時(shí)間壓縮到100ms內(nèi)，以留出資源給瀏覽器UI線程
- 模擬多線程：可以通過setTimeout來將大任務(wù)分隔成各個(gè)小任務(wù)瓢娜，以留出時(shí)間給UI線程
- Web Workers： W3C標(biāo)準(zhǔn)的多線程API
第七章 使用AJAX來提高JS程序性能
- 常規(guī)的XMLHttpRequest
- 動(dòng)態(tài)腳本注入: 動(dòng)態(tài)創(chuàng)建script標(biāo)簽挂洛，并引用外部資源.
script.src = url; //該腳本下載完成后自動(dòng)運(yùn)行函數(shù)cb(data)
function cb(data){
...
}
- MXHR:將所有資源轉(zhuǎn)化合并成字符串礼预，并用js根據(jù)mine-type來提取字符串中的資源
- beacons: 使用(new Image()).src = url + '?params=xxx'來向系統(tǒng)發(fā)送信息
第八章 編程實(shí)踐
- 避免使用 new Function(), eval()
- 避免重復(fù)工作：要先檢查兼容性的方法眠砾，可以在第一次檢查后就將檢查結(jié)果作為常量覆蓋掉檢查的部分，這樣就不用每次都檢查兼容性托酸。
- 學(xué)習(xí)并適當(dāng)使用位操作
- 使用原生方法褒颈，例如Math
結(jié)語
以上只是摘錄了本書的一小部分，書中還有很多數(shù)據(jù)對(duì)比與作者的tips锡溯，建議閱讀卦尊。
