本文转自知乎 Leo Zhang 的回答
原回答链接： https://www.zhihu.com/question/34074946/answer/75364178
转载已获授权，他人转载请自行询问原作者
正文
HTTP 2.0 的出现，相比于 HTTP 1.x ，大幅度的提升了 web 性能。在与 HTTP/1.1 完全语义兼容的基础上，进一步减少了网络延迟。而对于前端开发人员来说，无疑减少了在前端方面的优化工作。本文将对 HTTP 2.0 协议 个基本技术点进行总结，联系相关知识，探索 HTTP 2.0 是如何提高性能的。
初露锋芒
HTTP/2: the Future of the Internet 这是 Akamai 公司建立的一个官方的演示，用以说明 HTTP/2 相比于之前的 HTTP/1.1 在性能上的大幅度提升。 同时请求 379 张图片，从Load time 的对比可以看出 HTTP/2 在速度上的优势。
HTTP/1.1 vs HTTP/2
此时如果我们打开 Chrome Developer Tools 查看 Network 一栏可以发现，HTTP/2 在网络请求方面与 HTTP /1.1的明显区别。
HTTP/1:
HTTP/1
HTTP/2:
HTTP/2
多路复用 (Multiplexing)
多路复用允许同时通过单一的 HTTP/2 连接发起多重的请求-响应消息。
众所周知 ，在 HTTP/1.1 协议中 「浏览器客户端在同一时间，针对同一域名下的请求有一定数量限制。超过限制数目的请求会被阻塞」。
Clients that use persistent connections SHOULD limit the number of simultaneous connections that they maintain to a given server. A single-user client SHOULD NOT maintain more than 2 connections with any server or proxy. A proxy SHOULD use up to 2*N connections to another server or proxy, where N is the number of simultaneously active users. These guidelines are intended to improve HTTP response times and avoid congestion.
来源：RFC-2616-8.1.4 Practical Considerations
HTTP/1.1: Connections
该图总结了不同浏览器对该限制的数目。
浏览器对请求数的限制
来源:
Roundup on Parallel Connections
这也是为何一些站点会有多个静态资源 CDN 域名的原因之一，拿 Twitter 为例，http://twimg.com，目的就是变相的解决浏览器针对同一域名的请求限制阻塞问题。
而 HTTP/2 的多路复用(Multiplexing) 则允许同时通过单一的 HTTP/2 连接发起多重的请求-响应消息。
HTTP/2 多路复用
因此 HTTP/2 可以很容易的去实现多流并行而不用依赖建立多个 TCP 连接，HTTP/2 把 HTTP 协议通信的基本单位缩小为一个一个的帧，这些帧对应着逻辑流中的消息。并行地在同一个 TCP 连接上双向交换消息。
二进制分帧
在不改动 HTTP/1.x 的语义、方法、状态码、URI 以及首部字段….. 的情况下, HTTP/2 是如何做到「突破 HTTP1.1 的性能限制，改进传输性能，实现低延迟和高吞吐量」的 ?
关键之一就是在 应用层(HTTP/2)和传输层(TCP or UDP)之间增加一个二进制分帧层。
二进制分帧
在二进制分帧层中， HTTP/2 会将所有传输的信息分割为更小的消息和帧（frame）,并对它们采用二进制格式的编码 ，其中 HTTP1.x 的首部信息会被封装到 HEADER frame，而相应的 Request Body 则封装到 DATA frame 里面。
HTTP/2 通信都在一个连接上完成，这个连接可以承载任意数量的双向数据流。
在过去， HTTP 性能优化的关键并不在于高带宽，而是低延迟。TCP 连接会随着时间进行自我「调谐」，起初会限制连接的最大速度，如果数据成功传输，会随着时间的推移提高传输的速度。这种调谐则被称为 TCP 慢启动。由于这种原因，让原本就具有突发性和短时性的 HTTP 连接变的十分低效。
HTTP/2 通过让所有数据流共用同一个连接，可以更有效地使用 TCP 连接，让高带宽也能真正的服务于 HTTP 的性能提升。
总结：
- 单连接多资源的方式，减少服务端的链接压力,内存占用更少,连接吞吐量更大
- 由于 TCP 连接的减少而使网络拥塞状况得以改善，同时慢启动时间的减少,使拥塞和丢包恢复速度更快
首部压缩（Header Compression）
HTTP/1.1并不支持 HTTP 首部压缩，为此 SPDY 和 HTTP/2 应运而生， SPDY 使用的是通用的DEFLATE算法，而 HTTP/2 则使用了专门为首部压缩而设计的 HPACK 算法。
首部数据量对比
服务端推送（Server Push）
服务端推送是一种在客户端请求之前发送数据的机制。在 HTTP/2 中，服务器可以对客户端的一个请求发送多个响应。Server Push 让 HTTP1.x 时代使用内嵌资源的优化手段变得没有意义；如果一个请求是由你的主页发起的，服务器很可能会响应主页内容、logo 以及样式表，因为它知道客户端会用到这些东西。这相当于在一个 HTML 文档内集合了所有的资源，不过与之相比，服务器推送还有一个很大的优势：可以缓存！也让在遵循同源的情况下，不同页面之间可以共享缓存资源成为可能。
服务端推送
关于 HTTP/2 的 Server Push 以及 HTTP/2 的缓存策略
典型问题:
「如果客户端早已在缓存中有了一份 copy 怎么办？」还要 Push 吗?
详情参考另一个答案:
HTTP/2 对现在的网页访问，有什么大的优化呢？体现在什么地方
PS:
强烈推荐阅读 Mark Nottingham 在 Velocity Beijing 2015 的 speech
HTTP/2 for Front-End Developers ,关于 HTTP/2 下的前端性能优化相关。
Slide 地址：HTTP/2 for Front-End Developers
参考资料:
- Gitbook 《HTTP2 讲解》 by Calvin Zhang and Simon Xia：http2讲解 - GitBook
- HTTPS、SPDY 以及 HTTP/2 性能简单对比：A Simple Performance Comparison of HTTPS, SPDY and HTTP/2
- HTTP/2 的压缩算法--HPACK（RFC7541）：HPACK: Header Compression for HTTP/2
- NGINX HTTP/2 白皮书：NGINX_HTTP2_White_Paper_v4.pdf
- NGINX Blog--提升 HTTP/2 性能的 7个小建议：
- HTTP/2 for a Faster Web
- O'Reilly HTTP2-high-perf-browser-networking：HTTP2-high-perf-browser-networking.pdf
- HTTP/2 新特性浅析：HTTP/2 新特性浅析
- Kevin blog 关于 HTTP/2 的系列归档：HTTP/2 | 凯文叔叔的网志
- Can i use 上关于支持HTTP/2 的浏览器：Can I use... Support tables for HTML5, CSS3, etc
网友评论