HTTP/2：更快的頁面加載時間

時間 2019-12-28

標籤 http 更快頁面加載時間欄目 HTTP/TCP 简体版

原文原文鏈接

做者：Alex Ronin
翻譯：瘋狂的技術宅css

原文：https://frontnet.eu/http-2-fa...html

未經容許嚴禁轉載前端

也許人們已經據說過 HTTP2，有不少數大公司都使用HTTP2，如Google、Youtube、Facebook ......nginx

那麼什麼是HTTP2？咱們如今就知道了。程序員

HTTP 的歷史

HTTP 又稱超文本傳輸協議，就是你的瀏覽器與你正在訪問的網站的 Web 服務器通訊的方式。golang

兩臺（或多臺）計算機經過 Internet 相互通訊的方式有不少種，HTTP 只是用於 Web 瀏覽的一種方式。面試

第一個官方 HTTP 版本（HTTP 1.0）於1996年做爲RFC 1945發佈。 segmentfault

隨着 Web 的快速發展，有了更多的 css，js 組件，這意味着咱們須要更多資源，在某些狀況下還須要同時下載多個資源。在使用時會發生什麼瀏覽器

1 connection / 1 resources

HTTP 1.0 的機制沒法實現帶寬優化。服務器

在 1999 年發佈的版本 HTTP/1.1 解決了流水線概念這個問題。而後 HTTP/1.1 版本繼續更新並使用到如今爲止。

雖然有所改進，可是流水線並無徹底解決 HTTP/1.0 的問題。雖然人們以爲「還不錯！」，Google 的人們以爲「不行！」，因此他們發佈了一個名爲 SPDY 的新協議來改善頁面加載時間。。 SPDY 經過壓縮，多路複用和優先級排序技術實現了減小頁面加載時間的目標。 2012年7月，SPDY 開發團隊公開宣佈它正朝着標準化方向發展。 Chromium、Mozilla Firefox、Opera、Amazon Silk、Internet Explorer 和 Safari 瀏覽器也實現了 SPDY。

部署 SPDY 後，與 HTTP/1.x 相比，它顯示出顯著的改進，並引發了 Firefox 和 nginx 等開發人員的興趣。不久以後開發人員開始討論 HTTP/2。在調用過程和提案選擇完成以後，SPDY/2 做爲 HTTP/2 的基礎。從那時起，根據工做組的討論和實施者的反饋，發生了一些變化。截至2015年5月，HTTP/2 規範發佈（RFC 7540）。

HTTP/2 是什麼?

HTTP/2 是 HTTP 協議的下一個正式版本，用於在瀏覽 Web 時提升頁面加載速度和性能。

爲何不更新到 HTTP/2？

事實上，你是否更要新到 HTTP/2 並不重要，「一切都還行」。當前的瀏覽器仍然使用 HTTP / 1.1，若是服務器支持HTTP/2，那就用 HTTP/2。

那麼爲何要關心？

通常來講，若是你使用Web，就應該關心。

在用戶方面，HTTP/2 有助於充分利用帶寬並提供更好的瀏覽體驗。若是你去一個不支持 HTTP/2 的網站，他們就是在浪費你的時間，浪費並很差！

在開發方面，HTTP/2 提供了更好的可用性體驗，更快的頁面加載時間有助於提升搜索引擎的排名。

HTTP/2 特性

雖然咱們知道這些事，也能夠像往常同樣使用 HTTP/2，但知道一點點比閉上眼睛更好。

如上所述，HTTP/2 的目標是提升頁面加載速度，咱們將學習一些有助於 HTTP/2 實現此目標的特性。

多路複用

首先咱們須要提到多路複用，它解決了 HTTP/1中存在的隊首阻塞問題。爲了更容易理解這個問題，想象一下咱們就像去餐館同樣訪問網站。進入餐廳時，例如咱們要訂購 10 件商品，看看每一個版本的餐廳是如何爲咱們服務的：

HTTP/1：每服務員只收到 1 個訂單並提供正確的商品，而後就再也不處理任何商品。因此若是有 10 個商品，咱們將不得不給 10 名服務人打電話。餐廳只須要僱傭勞動力，但須要花時間打電話給疲憊的人訂購足夠的食物。
HTTP/1.1：服務員通過改進可以收到更多的訂單，但 1 次只收到 1 個訂單。爲了更快地訂購，你能夠根據你的須要打給 2-3 名服務人員。總的來講這是至關不錯的，但還不是最優的。這些人被稱爲持久鏈接。

HTTP/2：若是餐廳改進了新的技術，員工仍然會記下全部訂單，而後開始提貨。可是這些人會更靈活，提出來的那些貨物會交替發送每一個部分。所以，減小了大量的等待時間，只須要 1 我的就能夠服務 1 桌，下降了人員的成本。

優先反饋（優先排序）

在HTTP/1.1中，服務器必須以相同的查詢順序發送響應。 HTTP/2 可以異步解析，所以能夠更快地處理更小或更快的查詢。此外容許瀏覽器優先下載哪些資源對於網站的顯示很重要。

例如，頁面 <head> 中的 <script> 標籤將以高優先級（低於CSS - 最高）加載到 Chrome中，但若是它具備異步屬性，則該優先級將更改成「低」(它能夠異步加載和運行）。

此外，咱們還能夠用關鍵字更改資源的優先級：

rel=preload/prefetch/preconnect
as=fonts/style/script...

服務器推送

HTTP/2 容許服務器在請求以前發送數據包。例如你能夠「引用」頁面底部的腳本。在 HTTP/1.1 中，瀏覽器將加載並解析 HTML，而後在腳本標記時運行 JavaScript。使用HTTP/2，服務器能夠在瀏覽器請求此資源以前發送 JavaScript 文件。這減小了瀏覽器分析 HTML 併發送請求時的等待時間。