前端性能优化

  1. 减少http请求。

  2. 使用 HTTP2。

  3. 使用服务端渲染

  4. 静态资源使用 CDN

  5. 将 CSS 放在文件头部,JavaScript 文件放在底部

  6. 使用字体图标 iconfont 代替图片图标

  7. 善用缓存,不重复加载相同的资源

  8. 压缩文件

  9. 图片优化

(1). 图片延迟加载

(2). 响应式图片

(3). 调整图片大小

(4). 降低图片质量

(5). 尽可能利用 CSS3 效果代替图片

  1. 通过 webpack 按需加载代码,提取第三库代码,减少 ES6 转为 ES5 的冗余代码

  2. 减少重绘重排

  3. 使用事件委托

原文地址:https://www.cnblogs.com/loveliang/p/13956993.html