CSS精灵减少多少页面加载时间?

时间:2013-05-02 01:27:07

标签: css image sprite css-sprites performance-testing

我知道你可以通过使用CSS精灵减少页面加载时间。因为这会减少往返等等。

他们的任何数值或性能测试是通过使用CSS精灵可以节省多少平均页面加载时间。我知道这取决于网站。我有兴趣了解像Amazon.com这样的电子商务网站的一般数据

此外,如果你像JAIL一样使用异步图像加载你可以节省多少时间。我知道你无法异步加载所有内容。

2 个答案:

答案 0 :(得分:1)

有一个大的精灵,而不是一个小的图像,大的精灵在文件大小上并没有比小图像大得多,假设你在精灵中水平排列你的图像。

大多数浏览器一次只能同时下载6个。所以一般的经验法则是,如果你有超过6个图标或主题图形,它应该是sprited。如果您有照片或插图,则不应该使用它们。

答案 1 :(得分:1)

sprite的使用不当会导致服务器过载。精灵用于减少服务器请求的数量,但jpg格式的大量精简可能是坏的。

这就像平衡所有较小尺寸的较小图像或较小尺寸的精灵来覆盖更多图像

http://coding.smashingmagazine.com/2010/03/26/css-sprites-useful-technique-or-potential-nuisance/

  

页面加载可以在使用时减少高达10倍的因素   最佳!!

希望这有帮助