网站加载图片速度慢如何优化

问题描述：

如图所示，中间那张图是我们官网的加载时间线(已经去掉了每次的缓存)，上下两张是其它网站做为对比的。我发现我们网站加载类似大小的图片所花费的时间较长，甚至有十倍之多网站优化，请问这是前端的问题还是服务器带宽的问题网站优化，如何优化加载速度呢？

另外，我们公司官网加载速度确实很慢，老板让我做优化，请问各位有没有前端速度优化的方法提供一下，我自己研究使用，非常感谢。

各位大神可以帮小弟分析一下我们官网的问题吗，关于加载速度，图片压缩大小方面的，网址上面有了，非常感谢。

第 1 个答案：

图片优化，无非压缩、合并、CDN、缓存、延时加载、独立域名

第 2 个答案：

看看的这个

优化网站的所有相关资料看这个：

第 3 个答案：

1.走动态资源和静态资源分离,

图片走，/image/logo.png

css走,/css/index.css

js走, /js/index.js

2.图片全部采用CDN解析，缓存住

第 4 个答案：

从你的截图可以看出网站的所用图片太大，需要压缩，另外小的一些图片可以做成雪碧图或者直接生成编码嵌入网页中，还有现在在网站上可以使用webp，不过这个貌似在移动端用的多，你可以看看

第 5 个答案：

可以试试七牛图片处理链接

第 6 个答案：

大的图片最好压缩一下，小图片可以放在一个雪碧图上边用，一般都是200k以内比较好

第 7 个答案：

图片大了，可以试着把图片放到阿里OSS或者七牛上

第 8 个答案：

快慢永远是相对的，建议检查以下：

1、压缩图片、js、css，色彩较少的建议用git格式

2、开启服务器的gzip、open-cache

3、有条件时，可以把不需要程序渲染的文件加入CDN

4、根据具体的业务需求，可以考虑异步加载图片，避免影响用户操作

5、如果做了多级nginx代理，建议在对外的nginx服务中开启静态资源缓存，避免每次去子服务器获取

6、根据具体业务需求，考虑页面是否确实需要加载这么多图片

优化网站性能，需要前后端同时考虑，甚至包括设计。

第 9 个答案：

可以采用动态添加的方式，先让图片容器加载一个动效，css就可以实现一个，然后设置几秒之后动态添加一个图片地址，new IMage的方式添加地址，据说效果不错，你可以试试，关键是图片你得处理一下，你那图片有点大

第 10 个答案：

我的网站也是，这和带宽和服务器空间都有影响；然后可以设缓存和图片压缩；

第 11 个答案：

压缩和缓存

第 12 个答案：

图片应该怎么压缩？网站打开速度太慢

下一节：点击下载压缩文件

效果如一下网站效果：