标签:前端 读书笔记
简介
《javascript高级程序设计》的作者写的书,主要内容就是从各方面入手提升JS程序的性能。
第一章 加载与执行
- 无阻塞地加载JS代码:脚本放到最后,defer属性,动态<script>标签。
第二章 数据存取
- 尽量使用字面量;
- 注意作用域链的深度,少进行跨域访问;
- 经常访问的变量存为局部变量。
第三章 DOM编程
- 避免重绘与重排:要注意访问某些属性也会触发重排:offsetXXX, scrollXXX, clientXXX;
- 最小化重绘与重排:将受影响的元素抽出来(display:none..)操作后再插入
- 动画使用绝对定位;
- 使用事件委托(多个元素共用一个事件回调)来减少回调的数量;
- 注意getElementByXXX获取到的HTML集合,会消耗大量资源。
第四章 算法与流程控制
- 改善循环:减少每次循环的工作量(使用负循环);减少循环次数(例如达夫设备)
- 用迭代代替递归,因为浏览器可能有调用栈限制;
- 使用函数缓存(Memoization),就是将曾经输入过的参数的结果缓存起来;
第五章 字符串与正则
没看
第六章 快速响应的用户界面
- 将程序每次执行的时间压缩到100ms内,以留出资源给浏览器UI线程
- 模拟多线程:可以通过setTimeout来将大任务分隔成各个小任务,以留出时间给UI线程
- Web Workers: W3C标准的多线程API
第七章 使用AJAX来提高JS程序性能
- 常规的XMLHttpRequest
- 动态脚本注入: 动态创建script标签,并引用外部资源.
script.src = url; //该脚本下载完成后自动运行函数cb(data)
function cb(data){
...
}
- MXHR:将所有资源转化合并成字符串,并用js根据mine-type来提取字符串中的资源
- beacons: 使用(new Image()).src = url + '?params=xxx'来向系统发送信息
第八章 编程实践
- 避免使用 new Function(), eval()
- 避免重复工作:要先检查兼容性的方法,可以在第一次检查后就将检查结果作为常量覆盖掉检查的部分,这样就不用每次都检查兼容性。
- 学习并适当使用位操作
- 使用原生方法,例如Math
结语
以上只是摘录了本书的一小部分,书中还有很多数据对比与作者的tips,建议阅读。