前端性能优化-静态资源优化4-JS

本文地址：https://www.cnblogs.com/veinyin/p/14274258.html

 

JS 优化原则：需要时才优化，要考虑可维护性

1 提升 JS 文件加载性能

将 CSS 文件放在 head 里，将 JS 文件放在 body 里

2 JS 变量和函数优化

1. 尽量使用 ID 选择器

2. 尽量避免使用 eval

3. JS 函数尽可能保持简洁

4. 使用事件节流函数

5. 使用事件委托

3 JS 动画优化

1. 避免添加大量 JS 动画

2. 尽量使用 CSS3 动画

3. 尽量使用 canvas 动画

4. 合适使用 RequestAnimationFrame 代替定时器，RAF 可以在正确时间渲染，定时器无法保证回调执行时机

5. 动画和绑定的事件分开，避免耦合

4 合理使用缓存

1. 合理缓存 DOM 对象

2. 缓存列表长度

3. 使用可缓存的 Ajax