css - 不同图像扩展名（jpg、png）的浏览器加载速度是否存在差异？

Question

我有一张要转换为 png / jpg 的图像。每种类型的文件大小差异非常小（photoshop save-for-web-and-devices 优化）： image.png 155 字节 image.jpg 357 字节

我也不太关心文件类型，因为没有不透明度。

图像类型之间的浏览器加载速度有什么不同吗？例如，firefox 更喜欢 .png 文件，因为它们未压缩，因此加载速度更快（只是一个想法）。

谢谢

Answer 1

图片的加载速度取决于文件的大小和用户的连接速度。加载站点时，浏览器会下载页面的临时副本，包括图像。您可能无法区分，但 JPG 加载 355 字节需要两倍的时间。这些文件非常小，除非您在单个页面上说 100 个独特的图像，否则它真的不应该对加载速度产生影响。

Answer 2

您需要测试一个非常大的样本来找出呈现两种不同文件类型之间的差异。即使大小差异如此之小，较小的文件大小可能会给您带来比文件类型更大的差异。

唯一确定的方法是尝试并测量它 - 然后重复加载多次以获得良好的数据样本。

如果您真的希望进行超优化，那么减少请求数量会比文件大小（基于您提供的数字）或文件类型给您带来更多好处 - 因此您可以选择图像精灵来减少n图像1 张图片。