前端性能优化方案

主要划分为几个部分，一种是网站的体积优化、第二种是网站的访问速度优化、最后是网站的加载/渲染优化。

网站体积优化

• 使用压缩工具压缩 CSS、JS 以及图片文件，减小文件体积。

• 在项目打包时使用 Tree Shaking 摇树，自动移除未使用的代码或文件。

网站访问速度优化

• 通过合并多个 CSS 文件或 JS 文件，减少网络请求。对于多张同类图片，可以将其合并为雪碧图。

• 使用 CDN 加速网站，减少 HTTP 通信的延迟。

• 设置协商缓存，将静态资源缓存下来。如果缓存文件没有更新，用户将始终访问本地缓存文件。

• 启用 Gzip，压缩网络传输的内容大小。

对于网站的渲染速度优化

• 适当的使用 SSG 或者 SSR、例如官网都是静态内容的话可以采用 SSG 静态站点生成。渲染速度非常快。

• 采用懒加载技术，只加载当前显示的部分内容。

• 频繁的 DOM 操作会影响性能。可以通过使用虚拟 DOM、批量更新 DOM 节点来提升性能。

• 优化时间复杂度高的代码。