html - 在什么情况下，使用 HTTP/2 单独加载图像比使用 HTTP/1.1 一次性加载所有图像要慢？

Question

HTTP/2 使多路连接成为可能，从而消除了与服务器建立多个连接的需要。通过单个连接，可以将许多单独的图像向下发送到客户端。这消除了将许多图像组合成一个并使用 CSS 将其分开的旧图像精灵模式。

我很好奇精灵在 HTTP/2 世界中是否真的会更快。如果有，在什么情况下？

score 10 · Accepted Answer

如您所知，Sprites 用于防止多个请求排队，因此使用一个有效负载您可以获得站点的所有 sprites。

但是对于精灵，您往往会获得许多在整个网站中使用的附加图标，而这些图标并不是任何单个页面都需要的。

因此，使用 http/2 多路复用，排队资源不再是问题。当您只下载每个页面所需的文件时，您将获得速度优势。

但是，您可以通过将一些图像组合成一个文件来获得更好的压缩效果，从而使文件传输的整体大小更小。

Benoît Béraud 和 Alexandre Masselot 运行的速度测试给出了一个精灵表加载速度快于单个精灵的示例。他们得出结论，在使用 http/2 http://blog.octo.com/en/http2-arrives-but-sprite-sets-aint-no-dead/时，仍然可以使用精灵集来优化站点性能

可以在此处找到 Rachel Andrew 关于 http/2 的扩展文章： https ://www.smashingmagazine.com/2016/02/getting-ready-for-http2/

score 0 · Accepted Answer

使用 HTTP/2 多路复用，服务器将读取大量小文件，而不是读取单个大文件。如果服务器是资源有限的（例如，一些物联网设备），那么您可能会发现最好让它进行单一的、大读取而不是大量小读取，因为每次读取都会导致服务器操作系统潜在地执行大量与文件访问相关的操作。

在客户端，浏览器将管理大量小文件，而不是大文件。我可以想象用于当前精灵工作流程的代码路径得到了很好的按摩和优化，因为它非常常用。因此，拥有大量小文件的新情况可能会变慢，至少在一段时间内会变慢。

2 回答 2