歡迎訂閱我們的最新JavaScript通訊，點(diǎn)擊此處訂閱

如今幾乎所有JavaScript應(yīng)用程序都使用構(gòu)建流程。即使您沒(méi)有從ES2015或TypeScript進(jìn)行轉(zhuǎn)譯，對(duì)代碼進(jìn)行某種形式的連接和壓縮處理也已成為標(biāo)準(zhǔn)實(shí)踐。原因是發(fā)出HTTP請(qǐng)求涉及相當(dāng)大的開(kāi)銷(xiāo)。服務(wù)較少、較大的文件比服務(wù)許多較小的文件效率更高。隨著網(wǎng)絡(luò)底層協(xié)議HTTP/2的下一版本的采用，或許是時(shí)候重新考慮最佳實(shí)踐了。

HTTP/2基于谷歌的SPDY協(xié)議，該協(xié)議旨在改進(jìn)頁(yè)面加載延遲并在現(xiàn)有HTTP 1.1標(biāo)準(zhǔn)的基礎(chǔ)上提高安全性。這項(xiàng)新協(xié)議的工作始于2012年，第一個(gè)開(kāi)發(fā)版本是SPDY的直接副本。最終標(biāo)準(zhǔn)于2015年5月發(fā)布，今年5月，谷歌宣布他們將不再在Chrome中支持SPDY。

HTTP/2與其前身有何不同？一個(gè)主要區(qū)別在于HTTP/2是二進(jìn)制協(xié)議，而不是基于文本的協(xié)議。這使其更緊湊、解析效率更高且不易出錯(cuò)。該協(xié)議的一個(gè)關(guān)鍵優(yōu)勢(shì)在于它是多路復(fù)用的，這意味著可以在單個(gè)連接上傳輸多個(gè)文件。另一個(gè)廣為宣傳的功能是服務(wù)器推送，它允許服務(wù)器在客戶(hù)端請(qǐng)求之前將資源傳輸?shù)娇蛻?hù)端，預(yù)先填充緩存。

對(duì)新協(xié)議的支持非常好，包括所有主流瀏覽器。在服務(wù)器端，Apache2、Nginx和Microsoft IIS都支持它，Node.js 5.0及以上版本也支持它。大多數(shù)瀏覽器廠商都表示他們只會(huì)在TLS連接上支持HTTP/2，不過(guò)隨著Let’s Encrypt提供免費(fèi)SSL證書(shū)的出現(xiàn)，這是一個(gè)很容易滿(mǎn)足的要求。根據(jù)W3Techs今年6月收集的數(shù)據(jù)，大約8.4%的排名前1000萬(wàn)的網(wǎng)站現(xiàn)在支持這項(xiàng)新協(xié)議。如果您是Chrome用戶(hù)，您可以使用HTTP/2和SPDY指示器擴(kuò)展程序，以便一目了然地了解您訪問(wèn)的哪些網(wǎng)站通過(guò)HTTP/2提供服務(wù)。

HTTP/2的采用對(duì)JavaScript開(kāi)發(fā)人員意味著什么？我們目前將多個(gè)文件連接成捆綁包的做法使得瀏覽器難以有效地緩存我們的代碼：更改一個(gè)模塊中的一行代碼需要重新下載整個(gè)捆綁包文件。由于HTTP/2的多路復(fù)用使請(qǐng)求相對(duì)便宜，我們可以選擇將代碼拆分成更小的捆綁包，并更好地利用緩存，以確保我們的應(yīng)用程序有效地利用用戶(hù)的帶寬。

但是，如果請(qǐng)求很便宜，我們是否應(yīng)該完全放棄捆綁？乍一看這似乎很有道理，但HTTP請(qǐng)求的成本并非唯一需要考慮的因素。Web服務(wù)器也限制了它們可以多高效地服務(wù)大量文件。隨著JavaScript社區(qū)轉(zhuǎn)向更小、更集中的模塊的激增，在沒(méi)有某種捆綁的情況下將這些文件提供給客戶(hù)端將不是理想的選擇。最重要的是，將文件組合在一起可以實(shí)現(xiàn)更好的壓縮，從而節(jié)省帶寬。

那么，您應(yīng)該何時(shí)考慮切換到HTTP/2？答案是，這取決于情況。盡管瀏覽器支持非常好，但如果您的目標(biāo)受眾仍然停留在舊版本的IE上，那么您就運(yùn)氣不佳了，因此請(qǐng)檢查您的訪問(wèn)者統(tǒng)計(jì)數(shù)據(jù)，看看這是否可能使大多數(shù)用戶(hù)受益。我從這一切中得到的啟示是，新協(xié)議的支持和采用令人驚訝地進(jìn)展順利，作為開(kāi)發(fā)人員，這是我們不能忽視的趨勢(shì)。

您采用什么樣的捆綁策略？您是否正在考慮切換到HTTP/2，或者您可能已經(jīng)切換了？請(qǐng)?jiān)谠u(píng)論中告訴我！

關(guān)于文件捆綁和HTTP/2的常見(jiàn)問(wèn)題解答 (FAQs)

HTTP/2相對(duì)于HTTP/1的主要優(yōu)勢(shì)是什么？

HTTP/2相對(duì)于HTTP/1具有多個(gè)優(yōu)勢(shì)。最顯著的一個(gè)優(yōu)勢(shì)是它能夠通過(guò)單個(gè)TCP連接多路復(fù)用多個(gè)請(qǐng)求。此功能減少了發(fā)出多個(gè)請(qǐng)求時(shí)可能發(fā)生的延遲，從而提高了Web應(yīng)用程序的整體性能。 HTTP/2還支持標(biāo)頭壓縮，從而減少了開(kāi)銷(xiāo)，并且支持服務(wù)器推送，允許服務(wù)器在客戶(hù)端請(qǐng)求之前將資源發(fā)送到客戶(hù)端。

HTTP/2中的文件捆綁是如何工作的？

在HTTP/2中，文件捆綁不再像在HTTP/1中那樣必要。這是因?yàn)镠TTP/2可以一次處理單個(gè)連接上的多個(gè)請(qǐng)求，從而無(wú)需將文件捆綁在一起以減少請(qǐng)求數(shù)量。相反，可以單獨(dú)加載文件，這可以提高緩存利用率并簡(jiǎn)化文件管理和更新。

HTTP/2中的多路復(fù)用是什么？

多路復(fù)用是HTTP/2的一個(gè)關(guān)鍵功能，它允許同時(shí)通過(guò)單個(gè)TCP連接發(fā)送多個(gè)請(qǐng)求和響應(yīng)。這是對(duì)HTTP/1的重大改進(jìn)，HTTP/1每次連接只能處理一個(gè)請(qǐng)求。多路復(fù)用減少了與多個(gè)請(qǐng)求相關(guān)的延遲，從而提高了Web應(yīng)用程序的性能。

HTTP/2中的服務(wù)器推送是如何工作的？

服務(wù)器推送是HTTP/2中的一項(xiàng)功能，它允許服務(wù)器在客戶(hù)端請(qǐng)求之前將資源發(fā)送到客戶(hù)端。這可以通過(guò)減少客戶(hù)端接收和呈現(xiàn)資源所需的時(shí)間來(lái)提高Web應(yīng)用程序的性能。服務(wù)器可以根據(jù)初始請(qǐng)求推送它預(yù)計(jì)客戶(hù)端需要的資源。

為什么在HTTP/2中文件捆綁被認(rèn)為是不好的做法？

在HTTP/2中，文件捆綁被認(rèn)為是不好的做法，因?yàn)樗鼤?huì)消除該協(xié)議的一些關(guān)鍵優(yōu)勢(shì)。 HTTP/2旨在同時(shí)處理單個(gè)連接上的多個(gè)請(qǐng)求，因此將文件捆綁在一起實(shí)際上可能會(huì)降低性能，因?yàn)樗鼤?huì)創(chuàng)建更大、更復(fù)雜的文件，這些文件需要更長(zhǎng)的時(shí)間來(lái)處理和更新。

HTTP/2對(duì)SEO有什么影響？

HTTP/2可能會(huì)對(duì)SEO產(chǎn)生積極影響，因?yàn)樗梢蕴岣呔W(wǎng)站的速度和性能。速度更快的網(wǎng)站往往在搜索引擎結(jié)果中排名更高，因?yàn)轫?yè)面加載速度是排名因素。此外，HTTP/2的多路復(fù)用和服務(wù)器推送等功能可以改善用戶(hù)體驗(yàn)，這也有助于提高SEO。

HTTP/2如何提高安全性？

HTTP/2通過(guò)支持使用HTTPS來(lái)提高安全性，HTTPS會(huì)加密客戶(hù)端和服務(wù)器之間發(fā)送的數(shù)據(jù)。這可以防止敏感信息在傳輸過(guò)程中被攔截或篡改。此外，HTTP/2的二進(jìn)制幀機(jī)制可以幫助防止針對(duì)HTTP/1協(xié)議的攻擊。

HTTP/2如何影響移動(dòng)瀏覽？

HTTP/2可以通過(guò)減少延遲和提高Web應(yīng)用程序的速度來(lái)顯著改善移動(dòng)瀏覽。這對(duì)于經(jīng)常使用較慢互聯(lián)網(wǎng)連接的移動(dòng)用戶(hù)尤其有利。 HTTP/2的多路復(fù)用和服務(wù)器推送功能還可以提高移動(dòng)應(yīng)用程序的性能。

我可以在舊版瀏覽器中使用HTTP/2嗎？

大多數(shù)現(xiàn)代瀏覽器都支持HTTP/2，但舊版瀏覽器可能不支持。如果客戶(hù)端不支持HTTP/2，服務(wù)器通常會(huì)回退到使用HTTP/1。需要注意的是，雖然HTTP/2有很多好處，但它并不是良好編碼實(shí)踐的替代品，而應(yīng)該作為更廣泛的性能策略的一部分來(lái)使用。

如何檢查我的網(wǎng)站是否正在使用HTTP/2？

有一些在線工具可以檢查網(wǎng)站是否正在使用HTTP/2，例如HTTP/2測(cè)試。您也可以通過(guò)檢查瀏覽器開(kāi)發(fā)者工具中的網(wǎng)絡(luò)協(xié)議來(lái)手動(dòng)檢查。如果您的網(wǎng)站沒(méi)有使用HTTP/2，您可能需要更新您的服務(wù)器軟件或配置。

以上是文件捆綁和http/2：重新思考最佳實(shí)踐的詳細(xì)內(nèi)容。更多信息請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！