前端性能优化

1、减少资源的请求次数和大小

压缩合并 js 和 css 文件，减少 http 请求次数和请求资源的大小；在项目中使用 webpack glup 等打包编译工具

2、尽量使用字体图标或者 svg 图标代替传统的 png（jpg）图

渲染更快，减少代码体积，且放大不会出现变形等

3、使用图片懒加载

目的是减少页面第一次加载的 http 请求次数，实现思路： 首次加载页面不去发送 http 请求，放置占位图；页面加载完成后，当页面滑到可视区域时，再去请求加载图片资源

4、可以用 css 实现的效果，不要用 js 代码实现； 可以用原生 js 实现的逻辑，尽量不要引入第三方框架

5、雪碧图的使用

将众多小的图片资源绘制到一张大图上，通过设置图片的 position，将小图展现到页面上（background-position）

6、减少对 cookie 的使用，控制存储大小，客户端和服务器通信时，cookie 也会相互传输

7、代码优化：

1） 减少 js 中闭包的使用，闭包所在的上下文不会被清理

2）减少 DOM 的操作，浏览器里 DOM 操作很昂贵，注意减少 DOM的重绘和回流（重排）

3）js 中避免嵌套循环和死循环

4）避免循环给dom元素绑定事件，使用事件委托，不要直接绑定