像專業人士一樣減少HTTP請求并提高網站速度

　　您是否曾經瀏覽過效果不佳的網站?太恐怖了 到處都是代碼。樣式表幾乎無法連接。一個回形針以某種方式將頁眉固定在一起。帶寬不足。誰知道最后一次審核重定向。還有HTTP請求!因此，HTTP請求如此之多。甚至不讓我們開始使用HTTP請求。

　　實際上，經過深思熟慮后，我們便可以開始。HTTP請求在Web優化領域非常重要，尤其是在速度對于可見性變得如此重要的今天。確保您的請求運行順利不再是一種選擇。這是必須的。

　　因此，讓我們仔細看一下，并通過調整請求將您的網站變成熱點。因為如果您曾經瀏覽過一個維護良好，性能卓越的網站，那將是一件美事。更不用說，它像SEO冠軍一樣運行。

　　什么是HTTP請求?

　　HTTP請求是使用超文本文本傳輸協議(HTTP)從客戶端發送到服務器以請求信息的消息。Web瀏覽器(客戶端)通過這種方法接收顯示網頁所需的文件。這些文件包括圖像，文本，CSS，JavaScript等。

　　每次您訪問網頁時，都會出現以下情況：

　　您的瀏覽器向頁面的托管服務器打個招呼，并詢問它是否將通過包含與頁面相關的內容的文件(例如視頻)進行發送

　　A. 服務器要么說“迷路”，要么慷慨地授予請求

　　B. 如果被授予，瀏覽器會說“謝謝”并開始呈現頁面

　　C. 如果瀏覽器需要更多內容來呈現頁面，它將發送另一個請求

　　為什么減少HTTP請求很重要?

　　從上面的示例中可以看到，HTTP請求是顯示您的站點的關鍵組成部分，但是所有來回交談都需要時間。實際上，雅虎聲稱網頁的加載時間中有80%用于下載HTTP請求。

　　網頁需要下載諸如圖像，樣式表和腳本之類的信息才能正確顯示。該信息是通過瀏覽器發送到站點服務器的HTTP請求來檢索的。HTTP請求越多，頁面加載所需的時間就越長。頁面加載時間越長，用戶離開您的網站的可能性就越大，頁面在SERP中顯示的可能性就越小。這對周圍的企業都是不利的。

　　實際上，研究表明，頁面加載時間僅從2秒增加到5秒會導致跳出率從9%飆升到38%。

　　因此，減少HTTP請求對SEO和用戶體驗都有利。

　　網頁應該有多少個HTTP請求?

　　您應該努力將HTTP請求的數量保持在50以下。如果您收到的請求數低于25，則說明您做得很棒。

　　從本質上講，HTTP請求還不錯。您的網站需要它們正常運行并看起來不錯。但是您可能不需要的HTTP請求數量就很多?？傮w而言，您的目標應該是在不犧牲用戶體驗或頁面功能的情況下盡可能少地添加。

　　當前，每頁的平均請求數約為70。但是我們知道您可以做得更好。

　　關于最小化往返時間的注意事項

　　從此處開始減少HTTP請求的數量。從字面上看。

　　往返時間(RTT)是服務器響應某人訪問您的站點時發送的單個文件請求所花費的時間。為了正確加載，需要單獨請求文件。這樣做會花費很多時間。減少他們的人數可以縮短時間。

　　一些速度改進指南認為將RTT減到最小是必不可少的任務。還有一些解決方案(例如CDN)可以降低RTT，而無需執行其他任何操作。但是，盡管這可能會在短期內提高速度，但并不是降低HTTP請求。

　　因此，如果您有興趣提高網站的整體效率和性能(無創可貼)，請繼續閱讀!下面我們將深入探討通過CSS Sprite，串聯和修剪重定向等任務來減少請求(從而最小化RTT)的細節。

　　所以，讓我們動手吧。(不是字面上的意思。)

　　1.合并HTML，CSS，JavaScript文件

　　合并文件(如果您是一個書呆子，又稱“串聯”)聽起來像是有效的。如果您的站點運行多個CSS和JavaScript文件，則此解決方案將它們合并為一個。因為請求一個文件比請求十個文件快得多。

　　一個站點可以具有多個CSS文件和多個JS文件。為您的網站運行CSS測試和JS測試，以查看您的網站數量。如果您有多個外部CSS或JS文件，則可以嘗試將它們組合為一個CSS或JS文件。

　　2.優先放置文件

　　文件放置在請求速度中起著重要作用。最佳做法是，與設計和界面有關的CSS應該出現在頁面的部分頂部。這些樣式表是正確顯示頁面所不可或缺的，因此需要盡快加載。

　　另一方面，JavaScript應該位于頁面底部標記的正上方。這是因為加載腳本嚴重延遲了頁面的呈現。

　　但是在您隨意整理文件之前，請不要忘記……。

　　3.延遲JavaScript解析

　　并非所有JavaScript都是一樣的。加載網頁需要一些JS，僅將其移動到頁面底部是不夠的。這就是延遲JavaScript的用武之地。

　　如果您延遲JS的解析(加載)，它將確保任何渲染阻止，非關鍵JS僅在頁面加載后才運行，而關鍵JS仍能正常執行。有很多插件可以自動為您執行此操作，例如W3 Total Cache?；蛘?，您可以手動推遲JavaScript。

　　4.修復斷開的鏈接

　　修復斷開的鏈接(404錯誤)不僅可以縮短頁面加載時間，而且還可以解決問題。到處都是聰明的SEO。對于存在的每個外部鏈接，都會發送一個HTTP請求。如果鏈接的頁面存在，它將比不存在的頁面響應更快。因此，擁有將訪客定向到不存在的頁面的鏈接會使您的網站等待更長的時間，浪費帶寬并浪費資源。

　　5.減少重定向

　　具有301(永久)或302(臨時)重定向絕對比404錯誤(鏈接斷開)更可取，但是它們仍然不是理想的選擇。在一個完美，快速的世界中，不會有重定向。但這并不實際。

　　另外，請務必檢查.htaccess或其他服務器配置文件，以確保您沒有任何舊的舊版重定向。如果未選中這些選項，則確實會增加您的網站并減慢其速度。.

　　6.使用CSS Sprites

　　CSS Sprite是一個大圖像，代表您網站上的所有圖像。有點像站點地圖，但用于圖片。它的作用就像一張地圖，其中包含頁面上使用的每個圖像的坐標。它包括圖標，徽標，照片，圖形等。然后，使用CSS將這些圖像放置在頁面上所需的位置。

　　對于瀏覽器來說，加載一張大圖像要比加載許多小圖像更快。為什么?你猜到了!因為這樣做需要的請求更少。

　　7.不要使用@Import

　　避免使用CSS @import連接到樣式表。而是使用標記直接鏈接到它們。

　　CSS @import在客戶端進行操作，因此每個@import請求都會向主文件請求中添加另一個請求。這個句子的要求太多了，更不用說您的網站了。標記允許瀏覽器并行下載樣式表，這更加簡單，快捷。此外，某些較舊的瀏覽器甚至不再支持@import，因此最好避免使用它們。

　　8.減少外部腳本

　　外部腳本是從其他第三方位置提取的代碼，而不是托管在您的服務器上。它們包括注釋模塊，分析工具，外部字體(如Google Fonts)，社交媒體框等內容。例如，當您允許百度蜘蛛或Google蜘蛛跟蹤您的網站時，這會向其添加外部腳本，并帶有一個額外的HTTP請求。

　　9.啟用保持活動

　　當某人訪問您的頁面時，其瀏覽器會將消息發送到您的服務器，要求獲得下載頁面文件的權限。HTTP Keep-Alive在兩者之間打開單個連接，該連接允許下載多個文件而無需反復征求許可。這樣可以節省大量帶寬。

　　要啟用HTTP Keep-Alive復制并將以下代碼粘貼到您的.htaccess文件中(請先進行備份)

　　10.添加過期標題

　　如果您曾經在Gtmetrix上進行過性能測試，那么很有可能會利用瀏覽器緩存獲得一個“ F”。那是因為您沒有設置文件的到期時間。(不用擔心，我們已經做到了。)

　　Web服務器使用Expires標頭來告訴瀏覽器，當某人訪問您的某個頁面時，其內容將其緩存版本存儲在瀏覽器中。(除非他們已禁用緩存或正在使用私有窗口。)如果他們返回該頁面而不是再次從服務器請求所有文件，則瀏覽器將從緩存中加載該文件。這快很多。添加Expire標頭規定了此過程，從而減少了HTTP請求的數量。

　　11.減少插件

　　上面，我們嘗試提供插件和手動解決方案來實現任務。這是因為盡管插件使生活更輕松，但它們并不總是使頁面加載更快。

　　插件不僅會增加您網站的整體規模，而且還會生成HTTP請求。在某些情況下，單個插件會發送多個請求。例如，在網站的每個頁面上都會調用Disqus，而無論頁面上是否正在使用它，這都會產生許多不必要的請求。

　　您可以使用Gtmetrix和Pingdom之類的工具進行測試，以查看頁面的HTTP請求總數(并確定減少工作的基準)。如果您成功實現了上述任務(甚至只有少數任務)，您會發現立即有所不同。最重要的是，如果操作正確，用戶體驗將不會受到影響，并且您的訪問者對于您在幕后所做的所有修補工作都不明智。他們將只欣賞您網站的加載速度。