《高性能Javascript》 Summary（一）

 

第一章、加载和执行 Loading & Execution

缘由：Javascript 的执行致使页面渲染停止等待。

解决：

1. 将script放在页面底部，紧靠body 闭合标签以前，保证页面在script执行以前渲染完成。
2. 将script成组打包，减小script的请求数量。
3. 用非阻塞的方式加载script。（设置defer属性；动态建立script标签；使用xhr下载脚本注入到页面）

第二章、数据访问 Date Access

缘由： 在Javascript中，数据存储位置能够对代码总体兴能产生重大影响。有四种数据访问类型：直接量，变量，数组项，对象成员。直接量和变量访问快，数组项和对象访问慢。

解决：

1. 避免使用with语句改变上下文执行环境，应该适当当心的使用try catch的catch子句，他有一样的效果。
2. 嵌套对象成员会形成重要性能影响，尽可能少用。
3. 一个属性或方法在原型链位置越深，访问速度越慢。
4. 访问局部变量快。将常常使用的对象成员，数组项和域外变量存入局部变量中。

 

第三章、DOM编程 DOM Scripting

缘由：DOM和 Javascript(ECMAScript)实现保持相互独立。二者就像两座岛屿，ECMAScript每次访问DOM时，都会交上一次‘过桥费’,访问越多，交得越多。

解决：

1. 最小化DOM的访问，在Javascript端尽可能作更多的事情。
2. 将反复使用的地方使用局部变量存放DOM引用。
3. 当心处理HTML集合（访问慢，老是对底层文档进行查询），将Length缓存到变量中，在迭代中使用这个变量。若是常常操做html集合，能够将集合拷贝到数组中使用。
4. 若是能够的话使用更快的API，如querySelectorAll and firstElementChild。
5. 注意重绘和重排：批量修改style, 离线操做dom树，缓存并减小对布局信息的访问。
6. 动画中使用绝对定位(脱离文档流，不影响文档流的dom重绘重排)，使用拖放代理。
7. 使用事件委托技术最小化事件句柄数量。

 

《高性能Javascript》  Summary（二）