“简单”的问题.
使用大型spritesheets作为网站元素比使用多个图像更好吗?
我的意思是,进行额外的CSS图像处理(背景定位大图像并裁剪它)可以补偿更少的HTTP图像请求吗?
假设延迟为100毫秒,发布的精灵中的大约60个图像将至少花费一秒钟下载(可能更多,因为需要
生成和解析HTTP请求和答案).
由于精灵图像的大小与各个精灵的大小相同,并且图像处理非常快(我估计所有60个图像一起远低于<100 ms),使用精灵可以节省大约900毫秒的加载时间,明显的影响 - 这在理论上是没有考虑到必须服务60倍的巨大开销,否则他们将要求的数量. 总之,通过HTTP / 1使用精灵用于徽标和小图像. HTTP / 2的设计使得不再需要解决方法.最重要的是,可以在同一TCP连接上同时提供多个请求.此外,标头压缩旨在压缩冗余标头,例如User-Agent或Accept.