这篇文章是一个由两部分组成的系列文章的第1部分detailing HTTP/2 best practices. Part two—Implementing HTTP/2 in Production Environments—covers what’s required to implement and debug HTTP/2-capable Web applications in production environments.
超文本传输协议（HTTP）为万维网和网络空间支撑。如果听起来很日期，请考虑最常用的协议版本HTTP 1.1已近20年。什么时候ratifiedbackin 1997, floppy drives and modems were must-have digital accessories and Java was a new, up-and-coming programming language. Ratified in May 2015, HTTP/2 was created to address some significant performance problems with HTTP 1.1 in the modern Web era. Adoption of HTTP/2 has increased in the past year as browsers, Web servers, commercial proxies, and major content delivery networks have committed to or released support.
Unfortunately for people who write code for the Web, transitioning to HTTP/2 isn't always straightforward and a speed boost isn’t automatically guaranteed. The new protocol challenges some common wisdom when building performant Web applications and many existing tools—such as debugging proxies—don’t support it yet. This post is an introduction to HTTP/2 and how it changes Web performance best practices.
Binary frames: The ‘fundamental unit’ of HTTP/2
http 1.1的好处之一（至少超过非安全连接）是，它支持使用telnet session在端口80上的telnet会话中的文本交互：键入GET / HTTP/1.1returns an HTML document on most Web servers. Because it’s a text protocol, debugging is relatively straightforward.
Instead of text, requests and responses in HTTP/2 are represented by a stream of binary frames, described as a “basic protocol unit” in theHTTP/2 RFC。Each frame has a type that serves a different purpose. The authors of HTTP/2 realized that HTTP 1.1 will exist indefinitely (theGopher protocol毕竟仍然在那里）。HTTP/2请求映射的二进制帧映射到HTTP 1.1请求，以确保向后兼容。
There are some new features in HTTP/2 that don’t map to HTTP 1.1, however. Server push (also known as “cache push”) and stream reset are features that correspond to types of binary frames. Frames can also have a priority that allows clients to give servers hints about the priority of some assets over others.
Other than usingWireshark 2.0, one of the easiest ways to actually see the individual binary frames is by using the net-internals tab of Google Chrome (typechrome://net-internals/#http2进入地址栏）。对于大型网页，数据可能很难理解。Rebecca Murpheyhelpfully wrote a视觉显示的有用工具in the command line.
Additionally, the protocol used to fetch assets can be displayed in the Chrome Web developer tools—right click on the column header and select “Protocol”:
All of the HTTP/2 requests in this listing use a secure connection over Transport Layer Security (TLS). All major browsers require HTTP/2 connections to be secure. This is done for a practical reason: an extension of TLS called Application-Layer Protocol Negotiation (ALPN) lets servers know the browser supports HTTP/2 (among other protocols) and avoids an additional round-trip. This also helps services that don’t understand HTTP/2, such as proxies—they see only encrypted data over the wire.
Reducing latency with multiplexing
A key performance problem with HTTP 1.1 is latency, or the time it takes to make a request and receive a response. This issue has become more pronounced as the number of images and amount of JavaScript and CSS on a typical Web page continue to增加。Every time an asset is fetched, a new TCP connection is generally needed. This requirement is important for two reasons: the number of simultaneous open TCP connections per host is limited by browsers and there’s a performance penalty incurred when establishing new connections. If a physical Web server is far away from users (for example, a user in Singapore requesting a page hosted at a data center on the U.S. East Coast), latency also increases. This scenario is not uncommon—one recent report表示，超过70％的全球互联网流量通过了北弗吉尼亚州未标记的数据中心。
HTTP 1.1为延迟问题提供了不同的解决方法，包括管道和靠近标头。但是，管道上的实施从未被广泛实施，并且保持距离的标头遭受线路阻挡：当前请求必须在发送下一个请求之前完成。
In HTTP/2, multiple asset requests can reuse a single TCP connection. Unlike HTTP 1.1 requests that use the Keep-Alive header, the requests and response binary frames in HTTP/2 are interleaved and head-of-line blocking does not happen. The cost of establishing a connection (the well-known “three-way handshake”) has to happen only once per host. Multiplexing is especially beneficial for secure connections because of the performance cost involved with multiple TLS negotiations.
Implications for Web performance: goodbye inlining, concatenation, and image sprites?
HTTP/2多路复用对前端Web开发人员具有广泛的影响。它消除了几个长期存在的解决方法，旨在通过捆绑相关资产来减少连接的数量，包括：
- Concatenating JavaScript and CSS files:Combining smaller files into a larger file to reduce the total number of requests.
- Image spriting:Combining multiple small images into one larger image.
- 域碎片：Spreading requests for static assets across several domains to increase the total number of open TCP connections allowed by the browser.
- 内部资产：与HTML文档源捆绑资产，包括基本-64编码图像或直接编写JavaScript代码