如何通过7大手段全面提升WEB前端性能优化效果？

本文共计3082个文字，预计阅读时间需要13分钟。

减少请求数量+合并+如果不行进行文件合并，存在如下3个隐患：

1.网络延迟

2.文件与文件之间有插入的行请求

3.增加了N-1个网络延迟

4.失去包问题影响更严重

5.经过代理服务器时可能被断开

减少请求数量

合并

如果不进行文件合并，有如下3个隐患

1、文件与文件之间有插入的上行请求，增加了N-1个网络延迟

2、受丢包问题影响更严重

3、经过代理服务器时可能会被断开

但是，文件合并本身也有自己的问题

1、首屏渲染问题

2、缓存失效问题

所以，对于文件合并，有如下改进建议

1、公共库合并

2、不同页面单独合并

图片处理

1、雪碧图

CSS雪碧图是以前非常流行的技术，把网站上的一些图片整合到一张单独的图片中，可以减少网站的HTTP请求数量，但是当整合图片比较大时，一次加载比较慢。随着字体图片、SVG图片的流行，该技术渐渐退出了历史舞台

2、Base64

将图片的内容以Base64格式内嵌到HTML中，可以减少HTTP请求数量。