简介
现今，随着网站或应用程序成为越来越多人重要的部分，使用 HTTP 协议的性能优化变得越来越重要。之前 HTTP/1.1 已经成为网页标准的一部分，但现在 HTTP/2 在于其性能方面的升级也被广泛使用。本文将探讨一些关于 HTTP/2 的性能优化技巧以及指导意义。
对比 HTTP/1.1
在开始介绍 HTTP/2 之前，让我们回顾一下 HTTP/1.1 所存在的问题。其中一个让日渐变得明显的问题是浏览器请求瓶颈。HTTP 是一个无状态协议，每次请求都需要经过一些包头信息的传输及解析。当用户在浏览器中了加载一个 URL 时，浏览器能够并发请求到一个主机只有 Number of Concurrency（或叫开启连续请求，这个根据浏览器的类型有时候不相同） 的次数（一般是6到8）。这就是网络请求瓶颈所在。
HTTP/2 并没有增加开启分配或连接的数量，仍旧是 6 个，但该协议有用二进制协议来进行传输，而不是严格的文本转码，这样就不再需要多个请求，而只需要一个来处理连接，并在此连接上进行多个请求。
HTTP/2 还提供了一些其他的性能优化方法，如流行的 Server Push 功能以及头部压缩。
HTTP/2 的优化技巧与指南
1. 多来源请求
当我们使用 HTTP/2 时，单个连接可以同时传输多份源请求数据。这样可以提高下载时间，减轻服务器的负担。同时也可以让浏览器访问更多服务器来并行加载内容。这种技术被称为域分片，并且是通过并行加载来提高性能的。
例如，如果您的网站有一些静态资源（如图片和脚本），它们可以分布在多个不同的域名下。使用 HTTP/2，浏览器可以在这些主机之间同时并发请求，从而提高网站的加载速度。
2. 使用 Server Push
Server Push 是 HTTP/2 的一个新属性。它允许服务器通过 HTTP/2 的单个连接异步地推送可缓存资源。如果服务器有一个 CSS 文件，那么就可以把它推到浏览器上，而不需要等到浏览器请求它。
例如，在网页的 HTML Header 部分，我们可以看到一个以下的代码段：
<link rel="stylesheet" href="style.css">
这告诉浏览器下载并应用style.css文件。当服务器推送功能开启时，服务器可以自动将这个文件和该请求一起发布，使得浏览器可以在自己甚至开始请求之前加载它。
3. 把 JavaScript 放在底部
JavaScript 是一个非常重要的脚本语言，也是浏览器中最慢的操作之一。因此，我们需要优先加载一些必要的文件，然后再加载 JavaScript。
对于这样的单页应用程序，可以将JavaScript放到框架或组件库的顶部或底部，以优化性能。这样, 我们可以在后面获取从 API 获取数据，并在这个过程中懒加载任何 JavaScript 模块。 这在某些情况下会带来重要的加载时间改善。
4. 优化图片
图像是网站加载速度调整的一个主要因素。大多数情况下，使用适当优化的图像可以实现更快速和更低延迟的下载。HTTP/2并没有改变图片技术，所以我们可以在这方面使用相同的技巧。
一种常用的方法是使用矢量图像，这些图像比传统的图像格式（如JPEG、PNG、GIF）小得多，并且可以缩放而不失真。此外，在使用图像时要确保正确的大小，这很容易做到，并且可以通过 HTML 属性设置。
5. 头部压缩
HTTP/2 在其战争头部大小的问题上具有很强的性能优化能力。它使用 HPACK 作为其头部压缩算法，可以大大减少传输的间距，以选择性的删除一些值和键。这些算法可以节省许多字节，并减少传输的和下载的时间。
示例代码
以下是一个使用 Server Push 的 Node.js 代码示例：
-- -------------------- ---- ------- --- ----- - ----------------- --- -- - -------------- --- ------ - -------------------------- ---- ------------------------------ ----- ----------------------------- --- ------------------- ---------------- --------------- - --- -------- - ------------------------ -- ---- --- ---------- - ------------------------------ ------------------------ --- ------------------- ---------- - ------------------- ------ --------- -- ---- -------- ---
结论
HTTP/2 是 HTTP 协议中值得重要的改变之一，并且已经被广泛地采用。在使用 HTTP/2 时，正确的优化技巧可以帮助您在新的开发环境中获得最佳的性能和体验，同时也可以更快地向用户提供您的服务。 几种技巧：使用多来源请求、 Server Push、把 JavaScript 放在底部、优化图片和头部压缩，这些都是最好的选择。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/673168f50bc820c58238b472