前端如何优化网站性能?
1、减少HTTP的请求数量
在浏览器与服务器进行通信的时候,主要是通过HTTP进行通信,浏览器与服务器需要经过三次握手,每次握手需要花费大量的时间,而且不同浏览器对资源文件并发请求的数量有限(不同浏览器允许的并发数),一旦HTTP请求数量达到一定的数量,资源请求就存在等待状态,这是很致命的,因此减少HTTP的请求数量可以很大程度上对网站进行优化。
(一)、CSS Sprites
CSS Sprites俗称精灵图,这是将多张图片合并成一张图片达到减少HTTP请求的一种解决方案,可以通过CSS的background属性来访问图片的内容,这种方案还可以减少图片的总字节数。
(二)、合并 CSS 和 JS 文件
现在前端有很多的打包工具,如grunt 、 gulp、webpack,、rollup等等。为了减少HTTP的请求数量,可以通过这些工具在发布前将多个CSS或者多个JS合并成一个文件。
(三)、采用lazyLoad