HTTP/2主要通过以下方法减少延迟，改进页面的加载速度：
- HTTP Header的压缩，采用HPack算法。
- HTTP/2的Server Push。
- 请求的pipeline。
- 修复在HTTP 1.x的队头阻塞问题。
- 在单个TCP连接里多工复用请求。
HTTP/2 头部压缩（HPack）
使用HPack算法压缩HTTP/2的头部，下面简单介绍Hpack的工作原理：
简单说，HTTP头压缩需要在HTTP/2客户端和服务端之间：
- 维护一份相同的静态表（Static Table），包含常见的头部名称，和其键值对；
- 维护一份相同的动态表（Dynamic Table），可以动态地添加内容；
- 基于静态哈夫曼码表的哈夫曼编码（Huffman Coding）；
比如，在HTTP头里，有些key:value是固定的：
:method: GET
:scheme: http
在编码时，它们直接用一个index编号代替，例如:method:GET是2，这些在一个静态表定义。静态表的定义如下，总共61个Header Name，点击URL https://tools.ietf.org/html/rfc7541#appendix-A查看所有静态表的定义。
列出定义的部分键值对：
| Index | Header Name | Header Value |
|---|---|---|
| 1 | :authority | |
| 2 | :method | GET |
| 3 | :method | POST |
| 4 | :path | / |
| 5 | :path | /index.html |
| 6 | :scheme | http |
| 7 | :scheme | https |
| 8 | :status | 200 |
| ... | ... | ... |
| 32 | cookie | |
| ... | ... | ... |
| 60 | via | |
| 61 | www-authenticate |
使用静态表、动态表、以及Huffman编码可以极大地提升压缩效果。对于静态表里的字段，原来需要N个字符表示的，现在只需要一个索引即可。对于静态、动态表中不存在的内容，还可以使用哈夫曼编码来减小体积。
HTTP/2的多路复用
HTTP/2定义了流（Stream）和帧（Frame）。基本协议单元变小了，从消息（Message）变成了帧；流作为一种虚拟的通道，用来传输帧。与创建TCP连接相比，创建流的成本几乎为零。基本协议单元的变小也大大提高了连接的利用效率。
HTTP 1.1 默认启用长TCP连接，但所有的请求-响应都是按序进行的(这里的长连接可理解成半双工协议。即便是HTTP 1.1引入了管道机制，也是如此)。复用同一个TCP连接期间，即便是通过管道同时发送了多个请求，服务端也是按请求的顺序依次给出响应的；而客户端在未收到之前所发出所有请求的响应之前，将会阻塞后面的请求(排队等待)，这称为"队头堵塞"（Head-of-line blocking）。
HTTP/2复用TCP连接则不同，虽然依然遵循请求-响应模式，但客户端发送多个请求和服务端给出多个响应的顺序不受限制，这样既避免了"队头堵塞"，又能更快获取响应。在复用同一个TCP连接时，服务器同时(或先后)收到了A、B两个请求，先回应A请求，但由于处理过程非常耗时，于是就发送A请求已经处理好的部分， 接着回应B请求，完成后，再发送A请求剩下的部分。HTTP/2长连接可以理解成全双工的协议。
一幅图了解上面的描述：
HTTP/2的Server Push
HTTP/2与HTTP/1最大的不同之处在于，前者在后者的基础上定义了流和帧，实现了多路复用。这是Server Push的基础。
在HTTP 1.1里，在同一个 TCP 连接里面，上一个回应（response）发送完了，服务器才能发送下一个，但在HTTP/2里，可以将多个回应一起发送。
无PUSH模式
下图是PUSH模式，当请求一个HTML时，如果HTML里有CSS文件，server会一并推给client，而不像在HTTP 1.1下，还需要再发一个CSS的请求。
PUSH模式
根据上图，从理论上PUSH模式下性能会好很多。
举个例子解释一下。下面是一个简单的HTML页面，假说是index.html 。
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p>This is a sample to illustrate how HTTP/2 works</p>
<img src="example.png">
</body>
</html>
这里有三个文件需要处理：该HTML页面、CSS文件style.css以及图片example.png。在HTTP 1.1里为了处理这三个文件，Client需要发三个请求给Server。
首先，发送一个请求index.html。
GET /index.html HTTP/1.1
Client解析该HTML文件，继而知道有2个style.css和example.png资源文件下载。
Client继续发送2个请求下载他们。
GET /style.css HTTP/1.1
GET /example.png HTTP/1.1
如果使用HTTP/2的Server Push特征，根据上面的PUSH模式图，我们可以看出，Server还没有收到Client的请求，就把各种资源推送给Client。
拿上面例子继续举例，当Client只请求index.html，但是Server把index.html、style.css、example.png全部发送给浏览器。这样只需要一轮 HTTP 通信，Client就得到了全部资源。
网友评论