使用 Node.js 進行 HTTP/2 Server Push

Node.js 8.4.0 開始實驗性的支持HTTP/2，可以使用參數來啟用。

在這篇博客中，我們將要介紹HTTP/2的服務端推送並且創建一個小的Node.js 應用來進行嘗試。

關於 HTTP/2

HTTP/2的主要目標是通過啟用完整的請求和響應復用來減少延遲，通過HTTP頭域的高效壓縮來最大限度地減少協議開銷，並增加對請求優先順序和伺服器推送的支持。

了解更多關於 HTTP/2，請閱讀 HTTP/2 介紹。

Server Push

HTTP/2 Server Push 可以讓伺服器在用戶允許的情況下，主動向瀏覽器發送資源。

在我們使用 HTTP/2 之前，讓我們了解一下 HTTP/1 如何實現：

在HTTP/1中，客戶端向伺服器發送一個請求，通常是一個 HTML 文件，裡面包含著很多資源的鏈接（.js、.css 等文件），伺服器根據這些鏈接返回資源。當瀏覽器處理這個初始 HTML 文件時，它開始解析這些鏈接，並分別請求它們。

下面的圖片演示了這個過程。請注意時間表上的獨立請求以及這些請求的啟動時間：

HTTP/1 資源載入

這是HTTP/1的工作原理，我們使用這種方式開發應用已經很多年了。為什麼要改變呢？

當前方法的問題是，用戶必須等待瀏覽器解析相應，獲取鏈接並且載入資源。這樣延緩渲染並且增加載入時間。有一些解決方案，如內聯一些資源，但這樣讓初始的相應變得更大、更慢。

這是使用 HTTP/2 Server Push 的圖片，伺服器可以在資源甚至要求之前將資源發送給瀏覽器。

下面這張圖展示的是相同的網頁，在 HTTP/2 下訪問的情況。檢查一下時間軸和初始化內容。您可以看到 HTTP/2 通過復用減少了請求數量，並且資源與初始請求一起立即發送。

HTTP/2 Server Push

讓我們看一下如何通過 Node.js 使用 HTTP/2 Server Push 來提升客戶端載入時間。

Node.js HTTP/2 Server Push 例子

通過要求內置的 http2 模塊，我們可以創建我們的伺服器，就像我們使用 https 模塊一樣。

有趣的部分是在請求 index.html 時推送其他資源：

通過這種方法，和將會在沒有被請求的時候bei推送到瀏覽器。

點擊展開全文

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！