⼀个⻚⾯上有⼤量的图⽚（⼤型电商⽹站），加载很慢，怎么做优化

⼀个页面上有大量的图片（大型电商网站），加载很慢，怎么做优化

首先 一切优化得前后端开发协同配合区做 离开哪一方都举步维艰（很重要）

1. 先渲染缩略图, 主要看后端开发的技术能力, 这种方案几乎没前端啥事  就写个判断渲染而已  推荐

2. 图⽚懒加载，在⻚⾯上的未可视区域可以添加⼀个滚动事件，判断图⽚位置与浏览器顶端的距离与⻚⾯的距离，如果前者⼩于后者，优先加载。

3. 如果为幻灯⽚、相册等，可以使⽤图⽚预加载技术，将当前展示图⽚的前⼀张和后⼀张优
先下载。

4. 如果图⽚为css图⽚，可以使⽤ CSSsprite ， SVGsprite ， Iconfont 、 Base64 等技术。

5. 如果图⽚过⼤，可以使⽤特殊编码的图⽚，加载时会先加载⼀张压缩的特别厉害的缩略
图，以提⾼⽤户体验。

6. 如果图⽚展示区域⼩于图⽚的真实⼤⼩，则因在服务器端根据业务需要先⾏进⾏图⽚压
缩，图⽚压缩后⼤⼩与展示⼀致。

题外话

图片暴力压缩之后就不会太大了

这个时候用 方案 1 和 2 用户体验就已经很好了

当然可以先加载默认图 也是一种不错的方案