Performance 浏览器中的内存使用如何处理图像-我可以做一个大型精灵吗？

我目前在我的网站的许多网页底部显示115个（！）不同的赞助商图标。他们是懒洋洋的，但即便如此，这还是相当多的

目前，这些图标单独加载，大小为75x50（或x2或x3，取决于设备屏幕）

我想把它们都做成一个精灵，而不是115个单独的文件。这意味着，我会用一个大的PNG或WEBP文件来代替大量的小文件。我考虑这样做的方式将意味着最小的文件将是8625像素宽；x3版本的图像宽25875像素，看起来真的非常大（尽管只有225像素高）

• 这种像素大小的图像会导致浏览器阻塞吗

• sprite是实现更快加载页面的正确方法，还是我应该考虑其他事情

---

115个75像素宽的图标肯定会计算到非常宽的8625像素图像，仅50像素高

但您不必使用低高度（50像素）非常宽（8625像素）的图像

你可以用图标网格制作一个合适的矩形智能尺寸图像。。。比如说，12行，每行10个图标

115 x 10=1150+50像素（10个图标之间有5个像素间距），总宽约1200像素。 50 x 12=600+120像素（12个图标之间有5个像素间距）总高度约为720像素