HTTP/2 十分鐘速知

更新到 HTTP/2 後，那些針對HTTP/1.x 的優化手段需要如何變化？

答：總結來說，除了多域名增加并行 TCP 連接配接數不再适用以外，啟用 HTTP/2 幾乎不用考慮太多。

首先，由于 HTTP/2 是複用了一個 TCP 連接配接進行多次傳輸，是以适用于 HTTP/1.x 的多域名增加并發 TCP 連接配接數的政策已經不再适用了。不僅如此，如果你的 CDN 和主站不是指向同一 IP 且共用同一個 https 證書的話，HTTP/2 就不會在同一個 TCP 連接配接中也完成來自 CDN 的資源的傳遞，而是會為 CDN 徒增一個額外的 TCP 連接配接。

第二，雖然 HTTP/2 讓同一 TCP 連接配接下的多檔案的傳輸速度變快了，但是其實，适度的合并資源檔案中行為在 HTTP/2 也是可以接受的（參考文獻），不需要為了更新 HTTP/2 就背上沉重的負擔，對合并資源趕盡殺絕。

最後，其實 Server Push 隻是一個更新版的内聯資源。 Server Push 是個很好的特性。由于 HTTP/2 的 Server Push 特性允許伺服器充分利用帶寬，并按一定的優先次序向用戶端推送資源，用戶端甚至都還沒擷取完 HTML 文檔就可以接收。是以，使用 Server Push 特性，不僅資源加載時機提前了，對帶寬的利用更加充分了，而且也更加靈活了。但是， Nginx 最新版本目前還不支援 Server Push 特性。

HTTP/1.x更新到HTTP/2所需的前端優化調整總結

HTTP/2 的浏覽器支援情況如何？

答：全球過半份額的浏覽器已經支援 HTTP/2 了。當然，中國 IE8/9/10 和非 Windows10 下的IE11 的份額可能比國外大不少。 然而這并不用太擔心，伺服器會向用戶端發送一份支援協定的清單，不支援 HTTP/2 的用戶端可以選擇自己支援的協定，一般是 HTTP/1.x 協定。

2015年底HTTP/2的浏覽器支援情況（點選檢視最新）

HTTP/2 的性能優化方面要注意什麼嗎？

答：當一個 TCP 連接配接需要同時需要加載很多檔案的時候，HTTP/2 的多路複用和 Server Push 的優先級機制可以帶來性能的很大提升。然而，HTTP/2 帶來的性能提升卻往往不能彌補 TLS（https） 帶來的負面影響。甚至于，對于某些非常大的檔案和視訊直播流，有可能有時候會需要禁用 https 得到可接受的性能。

不過，好消息是，你可以參照此文（Is TLS Fast Yet?）檢查一下，關于 https 性能有什麼可以做的（參考文獻）。因為網絡環境的不同、延遲也不同，每個應用的特點也不盡相同，是以更新前後還需要自行做性能測試，判斷什麼最适合自己。

更新 HTTP/2 的前提條件是什麼？

答：由于現在所有支援 HTTP/2 的浏覽器都強制隻使用 TLS(https) 連接配接，是以：獲驗證書，并且讓伺服器支援 https 是必須的先決條件。

用 nginx 如何啟用 HTTP/2 支援？

答：很簡單，隻需編譯安裝最新版 Nginx，并在配置中啟用：

server {
    listen 443 ssl http2 default_server;

    ssl_certificate    server.crt;
    ssl_certificate_key server.key;
    ...
}
           

詳見中文指南（Nginx HTTP2 的編譯和配置）。也可以看官方文章（NGINX Open Source 1.9.5 Released with HTTP/2 Support）。

HTTP/2 的 Server Push 的特性是怎樣的？有什麼用？

答：浏覽器為了不浪費帶寬，會先分析完文檔再下載下傳資源。而由于各個資源的互相掣肘依賴，其中還會有某個資源阻塞的情況。當然，現代浏覽器也不是傻瓜，它們會通過預加載來提速。通常浏覽器預加載提速有兩種方法：

1. 分析文檔，提前加載；

2. 根據使用者行為預加載，如滑鼠在連結上的 hover 懸停動作等。

除此之外，前端開發工程師也可以通過 dns-prefetch 等屬性指定浏覽器的預加載行為，更流行的方法是放棄緩存帶來的便利性，将幾個特别重要的資源内聯在 HTML 文檔中。

沒有 Server Push，HTTP/1.1 的資源加載流

HTTP/2 的 Server Push 特性把這些包袱從浏覽器或者前端工程師手裡拿過來，直接丢給了應用層。使用 HTTP/2 的 Server Push 就相當于使用更新版的内聯資源。首先，浏覽器在完全不清楚 HTML 文檔是什麼情況的前提下，就可以得到伺服器推送的資源檔案。而且，與内聯資源不同的是，用戶端也可以選擇暫停、或者拒絕這份推送。

有 Server Push 的 HTTP/2 資源加載流

還有，将内聯資源換成 Server Push 的好處還有很多，可以被緩存、被多個頁面共用、和其它資源一起多路複用，還可以享受伺服器端指定的優先級權重和次序（如圖）。

Server Push 中，每個資源（每個資源都是一個 steam ）都可以有權重和優先次序

作為一個前端工程師，我認為 HTTP/2 的 Server Push 特性解決了 HTTP/1.x 的無腦順序加載資源，導緻前端不得不為了預加載、首屏時間、省流量延遲加載等問題，用有限的标簽和内聯 JavaScript 腳本的方式去彌補的這個問題。由于 Server Push 觸發的時機遠早于内聯 JavaScript Loader ，而且從 HTTP 協定等語義上定義了資源優先權重和 先後次序，允許用戶端啟動或暫停 Server Push，有望從根本上讓加載時機和次序的控制變得既高效又容易。雖然 Server Push 不會暴露接口給 JavaScript ，但是可以和 Sever Sent Event 協同合作（參考文獻）。

HTTP/2 Server Push 的實測效果

HTTP/2 的 Server Push 和 Server Sent Event 的關系？

HTTP/2 的 Server Push 不向浏覽器端暴露 API，也并不是 SSE（Server Sent Event）的替代。相反，它可以和 SSE 很好的協作。具體參見此文末尾。

HTTP/2 改變了什麼？帶來了哪些提升？

HTTP/1.x 公認最大的性能瓶頸就是 TCP 連接配接數過多。建立一個 TCP 連接配接需要三次握手，也就是三次往返于伺服器和用戶端之間。三次握手所需的時間無法用提升帶寬來彌補。而現在的網頁一般都内容豐富，在 HTTP/1.x 下載下傳完整個網頁一般需要很多很多個 TCP 連接配接。如果用開發者工具檢視網絡加載流，可以看到阻塞時間（也叫做 Time To First Byte，參考文獻），尤其是小資源的阻塞時間占比非常大。此外，每次 TCP 連接配接都需要傳遞 HTTP Header 資訊，也是一筆帶寬開銷。這還不夠，HTTP/1.x 由于基本是無腦按順序加載資源，需要浏覽器和前端工程師對預加載、加載優先級等做很多額外的工作。

HTTP/1.x 協定下綠色的阻塞時間延遲可觀

而 HTTP/2 解決了這個問題。相比之下，HTTP/2 一方面複用同一IP且同一證書下的一個 TCP 連接配接，另一方面壓縮了 HTTP Header，最後還提供了 Server Push 特性，解決了這些問題。

更多可翻閱 HTTPS、SPDY和HTTP/2的性能比較 某個TCP連接配接數非常多的網頁性能實測比較。

國内外有哪些網站已經啟用了 HTTP/2 支援？

答：HTTP/2的試驗版本是SPDY。SPDY 在國内外已經有很多生産環境采用了。此外，國外的 Google 、Twitter 和 Facebook 這三個著名的網站已經啟用了 HTTP/2 支援。

原文位址：https://www.bokeyy.com/post/get-to-know-http-2-in-10-minutes.html

尊重原創，尊重分享，麻煩您轉載時，也注明原創位址