談到 WordPress 速度優化,會想到主機性能、加入快取外掛、資料表的優化,反而 TTFB 很少人談論,TTFB (time to first byte),第一個字節的反應時間,我覺得在討論 WordPress 速度優化時,不能少了 TTFB 這部分。
TTFB 的概念是甚麼?
TTFB 代表第一個字節反應的時間;簡單的說,就是當讀者在瀏覽器這一端,點下你的網站時,到你的主機開始接收第一個數據字節之前所等待的時間。
有的人會把 TTBF 與網站 Load Time 或 Requests 混在一起,其實這是時間點有不同的計算方式,優化方法也有所不同。
如何測量 TTFB 的反應時間?
知道 TTFB 代表的是甚麼後,該如何測量我的網站的 TTFB,最簡單的方法就是使用 Google Chrome DevTools,Chrome F12 來測量 TTFB 的時間。
Google Chrome DevTool


如圖:綠色的長條圖就是 TTFB 所需時間,時間當然是越短越好。我優化過最短的 TTFB 的網站,是使用 GCP 的台灣主機,TTFB 只有 10MS 左右,有人說網站會有秒開的感覺,這跟 TTFB 的時間長短是有關係的,後面的內容會說明是甚麼原因。
在 Pingdom 線上工具測試的結果,Wait 黃色長條是 TTFB 的時間:

WebPageTest 測試 TTFB 的結果,First Byte 指的是 TTFB 的時間:

從以上的線上測量工具,可以看出我的網站的 TTFB 的時間,接下來說明:
影響 TTFB 的三個因素
- 讀者 (客戶端) 的請求通過網絡到 Web 伺服器所需的時間。
- Web 伺服器處理請求並生成回應所需的時間。
- Web 伺服器所產生的回應通過網絡回傳到瀏覽器 (客戶端) 所需的時間。
從上面的三個影響因素後,我們將如何縮短 TTFB 的時間:
如何縮短 TTFB 的反應時間
使用一個快速的 WordPress 主機:
這是一個最快速的做法,優化後端基礎架構性能,包含硬體設備;TTFB 中的第二個因素是伺服器處理請求和生成響應所花費的時間,基本上主機處理時間也是會影響您網站的所表現的結果。
挑選一個快速的 DNS (Domain Name Server) 主機:
大家常常忽略了這個問題,DNS 的作用是將域名和 IP 位址相互對映的一個分散式資料庫,瀏覽器 (客戶端) 輸入一個網址 (yungke.me),DNS 主機會快速查詢 Domain Name 和 IP 對應資料,而指向該 IP 位置的主機。
這些對應的動作,就是上述 TTFB 中的第一個影響因素。
您可以利用 SolveDNS 速度測試工具進行 DNS 主機測試,以下是 yungke.me 網站所使用的 Name.com DNS 為例:
http://www.solvedns.com/dnsspeedtest/

CloudFlare 的免費 DNS 和響應時間:

您也可以測試一下自己的 DNS 主機的響應時間,有的 DNS 主機的響應時間會慢到 100ms 以上,如果網站伺服器又不快速,TTFB 的時間被拉長是必然的了。
快取您的 WordPress:
在 WordPress 網站上使用快取方式,也是一個減少 TTFB 時間的方式;用對的快取方式不只減少加載時間,還可以所短 TTFB,我用一個網站安裝免費 KeyCDN 的 Cache Enabler 快取外掛來做測試,很明顯的啟動外掛後的 TTFB 的效果。
未啟動 Cache Enabler Plugin,TTFB 為 124ms
啟動 Cache Enabler Plugin,TTFB 為 44ms
伺服器的頻寬與距離:
快速的網路連接及最接近客戶端的伺服器是一個重要部分,當 Web 伺服器所產生的回應通過網絡回傳到瀏覽器 (客戶端),這是第三個因素。
加載網站頁面所需的時間不僅取決於連接的速度,還取決於該網站主機的頻寬;把網路連接比喻是一條水管,頻寬越大,水管越大,主機端可以下載的數據就越多。簡單的說,瀏覽器 (客戶端) 可以很快的看到 Web 伺服器所回應的數據 (文字和圖片)。

所以,為何我前面所說的,我曾使用 GCP 台灣主機,TTFB 會有這麼低 ms,剛好符合快速的 DNS 主機、WordPress 快取、客戶端與 GCP 主機有最短的距離。
如果您的客戶端都在台灣,以上的作法是可以縮短 TTFB 的時間,如果客戶端是在全世界,那你有必要增加 CDN 的服務。
KeyCDN Tools 工具測量 TTFB:
https://tools.keycdn.com/performance

由上圖看見,我的網站沒有做 CDN,除了日本、台灣有不錯的 TTFB 外,其他地區的 TTFB 都很悲慘,相對的,這些地區的客戶端開啟我的網站,也不會很快。
另一個減少 TTFB 最好的方法,使用 CDN (內容傳遞網路)。
如果您的網站為全球各地的訪問者提供服務,CDN 則會大大降低您的 TTFB,就如我所述,伺服器的位置非常重要,最好就在客戶端所在地。

結語
這只是一個對 TTFB 的概述,讓您了解 TTFB 與網站間的關係,國外的技術網站對 TTFB 的優化說明越來越多,您除了很努力優化 WordPress 速度外,TTFB 也是一個不可忽略的優化。
參考資料:
- Improving Search Rank by Optimizing Your Time to First
- We Analyzed 143,827 URLs and Discovered the Overlooked Speed Factors That Impact Google Rankings
- How to Reduce TTFB to Improve WordPress Page Load Times
Photo by Kristin Wilson on Unsplash