使用 HTTP/2 时,缩小和连接 JS/CSS 文件以及对图像使用 sprite 是否仍然提供性能优势?

Does minifying and concatenating JS/CSS files, and using sprites for images still provide performance benefits when using HTTP/2?

使用新的 HTTP/2 协议,对同一服务器的重复 HTTP 请求所产生的开销已大大减少。

考虑到这一点,缩小和连接 JavaScript/CSS 文件以及将图像组合成精灵是否还有任何显着的性能优势?或者这些做法在使用 HTTP/2 时不再有用?

是的,还是有用的

加上 gzip 压缩,您的页面会更轻。

假设您使用的是非常慢的 GPRS(56Kbps,500ms ping)网络。

您有 50 张小图片、30 个 javascript 和 20 个 css 文件。

这意味着,对于 2 个并行连接,您必须等待超过 100 * 500 毫秒的时间才能完成请求。

现在,每张图片大约有 3-4kb。这可能需要几毫秒(5-8?)。

现在,CSS 文件和 Javascript 的范围从 20Kb 到 600Kb。

这会导致您的网站运行时间过长。

减少传输文件的时间将增加 'speed' 网站的加载速度。

所以,,还是有用的!

它们仍然有用。 HTTP/2 减少了其中一些做法的影响,但并没有消除它们的影响

缩小仍然像以前一样有用。尽管 HTTP/2 为消息 headers 引入了新的压缩,但这与缩小(关于消息正文)无关。消息正文的压缩算法相同,因此缩小后节省的带宽与以前一样多。

连接和 sprite 的影响会比以前小,但它们仍然会有一些影响。使用 HTTP/1 下载多个文件而不是单个文件的最大问题实际上并不是 HTTP-side 问题, 本身 单独请求每个文件的一些 bandwidth-based 开销,但是当你完成一个文件时,它与拆除 TCP/IP session 的 time-based 开销相比相形见绌文件,然后为下一个文件启动一个新文件,并对您要下载的每个文件重复此操作。

HTTP/2 的最大重点是消除 time-based 开销:HTTP/1.1 试图通过流水线来做到这一点,但它并没有在浏览器中流行起来(Presto是唯一完全正确的引擎,Presto 已死)。 HTTP/2是另一种尝试,在HTTP/1.1的方法上进行了改进,同时也做出了non-optional这种东西,应该会比较成功。 它还通过压缩 headers 消除了 一些 的 bandwidth-based 开销,但它不能完全消除该开销,并且当下载多个文件,这些请求仍然需要(作为单个TCP/IPsession的一部分,因此开销较少,但不是零)。因此,虽然连接和 spriting 的影响 按比例 较小,但仍有一些影响,尤其是当您使用许多文件时。

在连接和精灵方面,要考虑的另一件事是压缩。 相似类型的串联文件往往比单个文件压缩得更好,因为压缩算法可以利用串联数据之间的相似性。 类似的原理也适用于 sprites:将相似的图像放在同一文件的不同区域通常会产生较小的文件,因为图像的压缩可以利用不同区域的相似性。

缩小JS仍然可以减少很多符号的大小; inflatedJargonSymbolizerTokenManager 将变为 _a。我发现的一个例子表明 JQuery GZipped 的大小仍然是 JQuery.min GZipped 的两倍。

我还想指出,虽然你没有暗示,但 dystroy 的评论是正确的,实际上与写得不好的维基百科解释相矛盾; "Concatenating" JavaScript 个文件现在可能用处不大。缩小它们仍然有其好处。只是想提一下,以防万一您碰巧在那里获得了一些信息。事实上,如果我不担心陷入编辑大战,我会自己编辑页面。

CSS 可能减少符号的机会较少。理论上,它只会得到空格和注释删除。

这可能有点晚了,但我想指出一些也应该涵盖的备选要点。

首先是缩小通常对 JavaScript 使用某种形式的丑化,这在带宽之外有好处 - 它可以防止人们轻易地分析代码,从而防止普通用户使用冗长的方法和想法进行恶意操作- 即使是构建良好的网站也可能会遇到这个问题。当然,这不能替代安全性,高级用户总能破译丑化代码。

另一个是并非所有浏览器或连接都将使用 HTTP/2,至少不会立即使用 - 因此,如果某些 HTTP/2 功能的性能在 [=18= 上几乎察觉不到] 客户,为什么不让那些仍在 HTTP/1.1 上连接的客户受益?

最后,归根结底,确定对服务器速度有何影响的最佳方法是对其进行基准测试。

到目前为止,所有答案都默认您要为每个页面下载所有 .CSS 和 .JS 文件。使用 http/2 并保持 .CSS 和 .JS 文件分开的一个好处是你只能下载你需要的文件,而不下载东西总是比有效下载它更快。