如何減少 TTFB 以改善 WordPress 頁面加載時間

已發表: 2017-01-26

當談到您的 WordPress 網站的整體速度時,很多時候我們專注於前端性能和優化以提高頁面加載速度。 但是,有時最好從您的網站最初開始加載的服務器端查看它。 今天我們將深入探討TTFB(第一個字節的時間)如何影響您,並討論一些如何減少它的簡單方法。 TTFB 通常是一個被忽視的性能因素,但在測試站點速度時應該考慮到它。

  • 什麼是 TTFB?
  • TTFB重要嗎?
  • 如何測量您的 TTFB
  • 減少 WordPress 網站上 TTFB 的 4 種方法

什麼是 TTFB?

TTFB 代表第一個字節的時間。 簡而言之,這是瀏覽器在從服務器接收到第一個字節數據之前必須等待多長時間的度量。 獲取該數據所需的時間越長,顯示您的頁面所需的時間就越長。 一個常見的誤解是,這是在 DNS 查找時間之後計算的,然而,網絡中 TTFB 的原始計算總是包括網絡延遲。 這涉及一個 3 步過程,延遲和延遲可能發生在兩者之間的任何地方,加起來就是您的總 TTFB。

等待ttfb
等待TTFB

1. 向服務器請求

當有人訪問您的網站時,首先會發生 HTTP 請求從客戶端(瀏覽器)發送到服務器。 在此步驟中,有多種因素會導致延遲。 緩慢的DNS 查找時間可能會增加請求的時間。 如果服務器位於地理上很遠的地方,這可能會在數據必須傳輸的距離上引入延遲。 此外,如果您有復雜的防火牆規則,這可能會增加路由時間。 並且不要忘記客戶的互聯網速度。

2. 服務器處理

發送請求後,服務器現在必須處理它並生成響應。 這可能會引入許多不同的延遲,例如數據庫調用緩慢、第三方腳本過多、未緩存您的第一個響應、代碼或 WordPress 主題優化不佳以及磁盤 I/O 或內存等服務器資源效率低下

3. 對客戶的回應

服務器處理完請求後,必須將其發送回客戶端(或者更確切地說,發送回第一個字節)。 這在很大程度上受到服務器和客戶端的網絡速度的影響。 如果客戶端的 Wi-Fi 熱點網絡速度較慢,它將反映在 TTFB 中。

TTFB重要嗎?

重要的是要了解 TTFB(第一個字節的時間)與網站速度不同。 這實際上是對響應能力的衡量。 網絡上有很多關於 TTFB 是否重要的​​討論。 有人說它毫無意義(Cloudflare、LittleBizzy),也有人說它很重要(Ilya Grigorik,Google 的 Web 性能工程師)。 雙方都提出了一些關於為什麼或為什麼它不重要的有效觀點,以及關於它是如何實際計算的一些問題。

Moz 甚至對搜索排名和第一個字節的時間之間的相關性進行了深入研究。 但是,很難知道這是否是原因,或者 TTFB 較低的網站總體上是否也只是速度更快,而這反過來又可能受到 Google 的頁面速度排名因素的影響。

TTFB重要嗎? 它有助於您的整體速度,那麼您怎麼看? 點擊推文

但是,與其花時間反复討論它是否重要,我們寧願專注於您可以做的優化來改進這個指標。 您所做的一切都可以提高 WordPress 網站的整體速度,而這反過來又會影響您的 TTFB。 在我們的測試中,具有更大 TTFB 的站點只是加載並感覺更慢。

一般來說,任何低於 100 毫秒的東西都很好 TTFB 。 Google PageSpeed Insights 建議服務器響應時間低於 200 毫秒。 如果您在 300-500 毫秒範圍內,這是非常標準的。 如果您的時間超過 600 毫秒,您的服務器上可能配置錯誤,或者是時候升級到更好的 Web 堆棧了。 或者按照我們下面關於如何減少 TTFB 的建議進行操作。 請記住,SSL/TLS 協商也可能是一個因素。

如何測量您的 TTFB

您可以通過多種不同的方式測試您的 TTFB。 我們將在下面探討幾個。 但請記住,每種工具都會給出略有不同的結果,因此簡單地使用一個工具並堅持使用它作為基線很重要。

使用 Google Chrome DevTools 測量 TTFB

您可以通過啟動 DevTools 在 Google Chrome 中測量 TTFB。 但請記住,如果您在計算機上測試 TTFB 會受到網絡延遲和 Internet 連接的影響。 因此,使用從數據中心進行測試的第 3 方工具(如下所示)可能更有效。

  • 從 Chrome 菜單中選擇更多工具 > 開發者工具。
  • 右鍵單擊頁面元素並選擇檢查
  • 使用鍵盤快捷鍵Ctrl + Shift + I (Windows) 或Cmd + Opt + I (Mac)

您可以啟動網絡窗口並查看站點的性能。

谷歌瀏覽器開發工具 ttfb
谷歌瀏覽器開發工具 TTFB

使用 Geekflare 的工具測量 TTFB

Geekflare 擁有一系列很棒的免費工具,可用於測試和排除網站上的問題。 Geekflare 的 TTFB 工具簡單、快速,可讓您從全球三個位置查看第一個字節的時間有多快(低)。

Geekflare TTFB 測試工具
Geekflare TTFB 測試工具

使用 WebPageTest 測量 TTFB

您還可以使用 WebPageTest 測量您的 TTFB。 根據他們的詞彙表,目標時間是 DNS、socket 和 SSL 協商所需的時間 + 100ms。 超出目標每 100ms 將扣除一個字母等級。 正如您在下面的測試中看到的那樣,該站點的測量時間為 0.256 秒或 256 毫秒 TTFB。

網頁測試ttfb
網頁測試首字節時間

用 Pingdom 測量 TTFB

Chrome 和 WebPageTest 將其稱為 TTFB。 但是,如果您使用的是 Pingdom,它實際上被稱為“等待”時間。 請務必查看我們關於如何使用 Pingdom 的深入指南。

等待時間
Pingdom 工具中的等待時間

用 GTmetrix 測量 TTFB

在 GTmetrix 中,就像 Pingdom 一樣,TTFB 被稱為等待時間。 請務必查看我們關於如何使用 GTmetrix 的深入指南。

在 GTmetrix 中測量 TTFB
在 GTmetrix 中測量 TTFB

使用 KeyCDN 中的工具測量 TTFB

KeyCDN 有一個很棒的 Web 性能測試工具,您可以在其中同時從 14 個不同的位置測量您的 TTFB。 正如您在下面的測試中看到的那樣,TTFB 在美國較低,而在海外則高得多。 這是因為我們的服務器實際上位於美國。 這在這裡證明了延遲和距離對 TTFB 有影響。

keycdn ttfb 測試
KeyCDN TTFB 測試

還有一些其他各種測量 TTFB 的工具,例如 Sucuri Performance Tool 和 ByteCheck。 你知道嗎? 甚至 Google Analytics 也有一個部分可以查看您的平均響應時間。 只需單擊“行為 > 站點速度 > 概述”即可。

谷歌分析 ttfb
TTFB 的 Google Analytics(分析)報告

減少 WordPress 網站上 TTFB 的 4 種方法

現在讓我們深入探討如何減少 WordPress 網站上的 TTFB。

1. 使用快速的 WordPress 主機

減少 TTFB 的第一種方法是確保您使用的是快速的 WordPress 主機。 我們比較了第 3 方共享主機的 TTFB(位於亞利桑那州鳳凰城)和 Kinsta 的 TTFB(位於愛荷華州康瑟爾布拉夫斯)。 我們使用完全相同的設置並運行默認的 27 主題。 請記住,Kinsta 現在擁有所有 29 個 Google Cloud Platform 位置,因此戰略性地將您的 WordPress 站點放置在更靠近訪問者的位置非常重要。

切換到更快的主機可以將您網站的 TTFB 降低多達 200%。 免費試用 Kinsta。

Kinsta 還在所有託管計劃中包含 Google Cloud Platform 的高級網絡。 許多其他託管服務提供商使用 Google Cloud 的標準層網絡,這會導致速度較慢。

共享主機 TTFB

在所有地區,平均 TTFB 為 520 ms 。 在美國和加拿大,平均 TTFB 為 240 毫秒

共享主機 ttfb
共享主機 TTFB

金斯塔 TTFB

在所有地區,平均 TTFB 為 412 毫秒。 在美國和加拿大,平均 TTFB 為 164 ms 。 如果您使用 Kinsta 託管,您還可以選擇在歐洲或亞洲託管您的 WordPress 網站。 請參閱 Google Cloud 數據中心位置列表。

託管 wordpress 主機 ttfb
託管 WordPress 託管 TTFB

因此,僅通過使用更快的主機,我們就看到全球TTFB 下降了 20% 。 美國和加拿大的 TTFB 下降了 32% 。 擁有一個經過深思熟慮的架構的優秀 WordPress 主機對於降低 TTFB 至關重要。 這也為仔細選擇位於客戶所在地區的地點提供了一個很好的案例。 如果您的大多數客戶都在美國,請不要在歐洲託管您的服務器(儘管 CDN 可以幫助消除其中的一些問題)。

2. 實施 CDN

另一種減少 TTFB 的簡單方法是利用內容交付網絡 (CDN)。 如果您的網站為該國不同地區或全球的訪問者提供服務,這可能會大大降低您的 TTFB。 正如我們在上面看到的,位置非常重要。 我們運行了一個小測試來展示 KeyCDN 作為我們的 CDN 提供商的區別。 每個測試運行 5 次並取平均值。

TTFB 無 CDN

我們首先在禁用 CDN 的情況下運行測試,您可以看到我們的總加載時間為 1.45 秒,資產的平均 TTFB 約為 136 毫秒。

ttfb 在 cdn 之前
添加 CDN 之前的 TTFB

TTFB 與 CDN

然後我們啟用我們的 CDN 並再次運行測試。 如您所見,我們的總加載時間下降到 788 毫秒,我們的平均 TTFB 現在是 37 毫秒! CDN 可以帶來多大的改變。 另一個需要注意的重要事項是,我們選擇了斯德哥爾摩地點來執行此測試。 為什麼? 因為我們想向您展示通過減少物理距離可以實現的真正改進。 斯德哥爾摩有一個 CDN POP,所以我們的內容是從斯德哥爾摩提供的。

cdn後的ttfb
添加 CDN 後的 TTFB

注意:如果您使用 Cloudflare,您的 TTFB 可能會稍高一些。 這很可能是由於運行完全代理服務的額外開銷和復雜性。 請記住,Cloudflare 具有一些 CDN 提供商沒有的附加防火牆和其他功能。 因此,您需要下定決心,這可能會使您受益更多。 如果您的整個網站沒有得到適當的優化,那麼在略高的 TTFB 上受到打擊可能是值得的。

但是,您可能還想查看 WP Bullet 關於使用 Cloudflare 頁面緩存降低 TTFB 的指南。 這可能需要一些額外的設置和測試。 確保運行您自己的測試,因為每個環境都不同。

建議閱讀:如何為 WordPress 設置 Cloudflare APO。

3. WordPress 緩存

第三種方法,可能是減少 TTFB 的最簡單方法之一是在 WordPress 網站上使用緩存。 許多人只認為緩存可以幫助減少加載時間,但實際上,它也有助於減少 TTFB,因為它有助於減少服務器處理時間。 我們在運行和不運行緩存的情況下再次運行了一些測試。 每個測試運行 5 次並取平均值。

沒有緩存運行

我們通過 Pingdom 運行該站點,並且在沒有緩存運行的情況下,我們的站點獲得了 1.17 秒的加載時間和 560 毫秒的 TTFB。

非緩存 ttfb
非緩存 TTFB

啟用緩存

然後我們啟用緩存並再次通過 Pingdom 運行該站點。 這次我們的網站獲得了 643 毫秒的加載時間和 57 毫秒的 TTFB。

wordpress 緩存 ttfb
啟用了 WordPress 緩存的 TTFB

因此,通過啟用緩存,我們能夠將TTFB 減少高達 90%! 您可以閱讀有關 Kinsta 緩存的更多信息。 我們在服務器級別執行此操作,這意味著不需要緩存插件。 如果您不使用託管 WordPress 主機,我們建議您使用免費的緩存插件,例如緩存啟動器。

4. 使用高級 DNS 提供商

最後但同樣重要的是,DNS 也在 TTFB 中發揮作用。 很難準確計算它受到的影響有多大,但您仍然可以看到整體 DNS 查找時間,並看到那裡有更快和更慢的提供商。 我們使用 SolveDNS 速度測試工具進行了幾次測試。 這是使用 NameCheap 的免費 DNS 和響應時間的域示例。

免費名稱Cheap DNS

免費的DNS速度
免費的DNS速度

下面是使用 Amazon Route 53 的高級 DNS 的示例。 如您所見,亞馬遜的 DNS 查找時間要快得多。 通常,高級 DNS 提供商的速度會更快。 Cloudflare 是一款免費的,也具有出色的性能。

Amazon Route 53 DNS

亞馬遜高級 dns
亞馬遜高級 DNS 速度

請務必查看我們關於為什麼應該使用高級 DNS 提供商的帖子。 我們在 Kinsta 與 Amazon Route 53 合作,所有客戶均可免費使用。

概括

您可以優化或修復許多其他事情以減少 TTFB,例如數據庫緩存、磁盤 IO、交換使用、RAM、PHP 設置、MySQL 設置、網絡設置、TLS 開銷等。但上面提到的那些是相當的易於實施,並將為您提供最快的性能提升。 因此,下次有人問您如何減少 TTFB 時,請記住快速的 WordPress 主機、CDN、緩存和 DNS 都發揮著重要作用。 修復或改進這些瓶頸就可以解決問題。

您對 TTFB 的體驗如何? 我們很想在下面聽到它。