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