标签：文件合并 处理器 pack 总结 遇到 模糊 了解 维护 文件
这本书让lz对js性能优化有了更深刻的理解，现在因为我们通常用第三方构建工具webpack、gulp等诸如此类，之前总是听说什么dom操作影响性能呢，对这个概念总是有点模糊，但看完这本书之后后，相对而言比较清晰了。
书中有句话说的比较形象，js与dom之间有座桥梁，当我们去访问dom时，无疑是要交过路费的，所以性能优化的最好方式，所以一些操作尽量放在js层面这边来做。时下比较流行的vue、react之类就是如此
虽然现在我们用vue、react这些库比较多，但是像lz上家就要维护以往的项目(jq)，当时就遇到js操作dom太多，浏览器卡死的情况。我当时用的是用定时器分批次操作dom，尽量不要一下子操作，因为浏览器是单线程的，js脚本执行的时候，页面就不会响应。
以下是lz看书总结一些性能优化的方面，不尽全，想更深入了解的，可以去看这本书
1. 脚本文件放在最html文件底部
多数浏览器使用单一线程处理界面刷新和脚本执行，也就是说浏览器同一时间只可以做一件事，如果脚本放在顶部会导致明显的延迟
2. 减少页面中外链脚本文件的数量
也就是说当一个应用依赖多个js文件时，多个文件合并成一个script标签，就可减少性能消耗
3. 无阻塞加载脚本
使用script标签的defer属性
使用动态创建的script元素来下载并执行代码
使用XHR对象下载js代码并注入到页面中
4. 尽量使用局部变量
因为其位于作用域链的起始位置，查找速度更快
5. 使用querySelectAll()的api
6. 合并dom操作，使用文档片段对象，尽量减少重排与重绘
7. 事件委托减少事件处理器的数量
8. 少用if else与switch，通过数组，对象的方式
标签：文件合并 处理器 pack 总结 遇到 模糊 了解 维护 文件
原文地址：https://www.cnblogs.com/raind/p/10159275.html
