HTTP/2 從零到一

HTTP/2 從零到一
Even Chang
7 min read·
Aug 14, 2019
--
什麼是 HTTP/2？在談到 HTTP/2 之前，讓我們先回顧一下整個 HTTP 發展的歷史。
1989 年，Berners Lee 提出了 World Wide Web (WWW) 這個 project，成為了世界上第一版的網路，而剛誕生的網路只存在一種 HTTP Method，即是 GET，當時所有的 server response 全都是靜態的 HTML。
Press enter or click to view image in full size
一直到了 1996 年，HTTP/1.0 進入人們的世界中。隔年，我們至今仍四處可見的 HTTP/1.1 便誕生了，我們至今熟悉的 HTTP Method、Status Code、Header 等等也都在這些時候出現。
而 HTTP/2 本身可以說是起源於 SPDY Protocol，由一群來自 Google 的 engineers 所研發。雖然最後 SPDY 並沒有成為 HTTP/2，但是有很大一部分的設計理念都來自於此。
在 2015 年 5 月，HTTP/2 被正式介紹給世界，而這將近 20 年的歷史中，我們終於有能更貼近現代傳輸需求的 protcol，可以更大幅度提升使用者體驗。
為什麼我們需要 HTTP/2？HTTP 基本上是一個 request <-> response 的 protocol，當時的設計主要是用於 browser 跟 server 之間進行 plain text 一次性的傳輸。
而後來的 HTTP/1.0 引入了其他多媒體類型，例如圖片。而 HTTP/1.1 除非明確指定，不然將預設 persist connection，所以多個 requests 可以重複使用相同的 connection 而減少使用者的等待時間。
這些都是很不錯的進步，讓使用者能有更好的體驗。然而，在 2000 年以後，網頁技術開始有飛躍性地進步，從 AJAX、jQuery、CSS3、HTML 5 到後來的 Angular、React、Vue 等等，都讓工程師能用更簡單的方法完成更複雜的前端應用程式，這也同時意味著 client 跟 server 端會容易有更多的互動。

左: 2010 ~ 2019 網頁渲染所需下載 kb / 右: 2010 ~ 2019 網頁渲染所需 requests 數 / Source: https://httparchive.org/reports/state-of-the-web

從上圖中可以看出，網頁所需要的數據大小或是請求數都是不斷上升地。
HTTP/1.x 仍有一些基礎上的限制，像是純文字傳輸、缺少 server 主動推送資料的能力 等等，讓我們沒辦法進一步提高效能。而這一些 HTTP/2 才具備的優勢，會在下面詳細介紹。
HTTP/2 比 HTTP/1.x 好在哪？先用一個清單列出使用 HTTP/2 的好處，針對某些優點，我們下面會有更詳細的解釋。
優點與 HTTP/1.x 的許多標準相容（method, status code, etc.）
Header Compression（頭部壓縮）
Binary Protocol（二進位協定）
HTTP/2 Server Push（伺服器推送）
TCP Multiplexing（多路複用）
No HOL blocking
Request Multiplexing 多路複用HTTP/1.x 一直以來都有 Head-of-Line blocking 的問題，意即當一個 request 下載的內容過大時，會阻塞其他 request。雖然 HTTP/1.1 出現了 pipelining 試圖解決這個問題，但因實作細節上的難度，沒有被大多數 browser 支援，且因為要求 request 的 response 要有序，所以若任何一個 request 太大或太慢時，依然會有 blocking 的問題。
而 HTTP/2允許 client 透過同一個 TCP connection 同步發送多個 requests 給 server，而 server 也能用同一個 TCP connection 同步回傳，進而減少額外的 RTT (round trip time)
Header Compression 頭部壓縮HTTP/2 利用 HPACK 進行壓縮，其中包含 1. 靜態字典 2. 動態字典 3. 霍夫曼編碼三種方式，將大量重複的 Header key:value 壓縮成 1 ~ 2 bytes。
在許多 modern web，初始頁面渲染常常要 80 甚至 100 個 requests，Header Compression 在節省流量上有顯著的效益。
Binary Protocol 二進位協定HTTP/2 在傳輸時是以 Binary 為主，這大大減輕了實作上的負擔，而且 Binary 的 Parsing 遠遠比 Text 還要來得有效率。
在 HTTP/1.1，為了正確處理純文字的 parsing（換行、空行、空白等等都是需要特別處理），定義了四種方法，而在 HTTP/2 中只需要一種處理方式。
HTTP/2 Server Push 伺服器推送以一般的 web 為例，傳統 HTTP/1.x 要等到 browser 收到 HTML 之後，再根據上面指定的網址去索取對應的 CSS 跟 JavaScript。
而透過 Server Push，server 可以在 client 提出後續請求之前，主動將這些已知會被接著請求的檔案推送給 client。
HTTP 2 在各大 browser 的支援度