curTain

1. 原则

  1. 多使用内存、缓存或其他方法来存储
  2. 减少 cpu 计算,减少 http 网络请求

2. 从哪里入手

  1. 加载页面和静态资源
  2. 页面渲染

2.1 加载资源优化

  1. 静态资源的压缩和合并
  2. 静态资源缓存
  3. 使用 CDN 让资源加载更快
  4. 使用 SSR 后端渲染,数据直接输出到 HTML 中

2.2 渲染优化

  1. CSS 放前面,JS 放后面
  2. 懒加载(图片懒加载、下拉加载更多)
  3. 减少 DOM 查询,对 DOM 查询做缓存
  4. 减少 DOM 操作,多个操作尽量合并在一起执行(例如:插入列表)
  5. 使用事件节流与防抖
  6. 尽早执行操作( 如:DOMContentLoaded )

3. 总结

简略的概述了一下前端性能的优化。

4. 资源推荐

框架打包优化

🚀 记一次前端性能优化

前端性能优化最佳实践


 评论