网站轮播图背景图片加载慢，怎么解决？

Question

网站首页放了轮播图，里面的背景图片加载很慢，怎么样让它加载完成再显示啊？（图片已压缩）

Answer 1

1. 图片放cdn服务

2. 把图片压缩一下（web格式的）

3. 懒加载

Answer 2

懒加载，先给一张默认占位的背景图。真实的背景图加载成功后在替换占位图。

Answer 3

懒加载或者预加载

Answer 4

如果可行，请参考http2 server push

cdn，压缩，懒加载都可行

Answer 5

1. 首先用一张图片占位轮播

2. window.onload 之后初始化你的轮播就好了

另外 楼主也应该考虑下把你的图片压缩一下，一个网页动辄加载>1 mb的图片是件体验很不好的事情

Answer 6

懒加载,
提供一个具体思路,
比如默认的图片为defaultpath的一张加载中的示意图,
轮播图的真实图片地址为 imgpath,

<div id="scroll" style="background-image:url(defaultpath)"><div>

在js中

var img = new Image()
img.src = imgpath
img.onload = function(){
    document.getElementById('scroll').style.backgroundImage = 'url(' + imgpath + ')'
}