一 性能优化分类：
1 资源加载优化：
- 控制图片大小/图片懒加载/资源压缩
- 减少http请求（节流）
- 代码高内聚低耦合
- 使用CDN加速资源加载
-
使用事件委托（使用事件委托可以节省内存）
2 代码执行层面优化：主要是动画性能优化；在前端实现动画有三种主流的方式:Canvas；CSS3；Dom
-
- Reflow（回流）：浏览器要花时间去渲染，当它发现了某个部分发生了变化影响了布局，那就需要倒回去重新渲染。
- Repaint（重绘）：如果只是改变了某个元素的背景颜色，文字颜色等，不影响元素周围或内部布局的属性，将只会引起浏览器的repaint，重画某一部分。
-
- 动画优化：requestAnimationFrame：作用就是让浏览器流畅的执行动画效果；专门用来实现动画效果的api。（https://juejin.im/post/5a82f0626fb9a06358657c9c）：
- 硬件加速：GPU在硬件层面，对于图像处理，通常用硬件会更快，因为GPU使用图像对高度并行浮点运算做了优化。CSS 中的以下几个属性能触发硬件（GPU）加速：transform；opacity；filter；will-change。
- 利用Web Worker对大量计算数据进行优化。