網站優化:為什麼我的WordPress網站速度慢?
今天,創建網站不僅是關於如何做程式開發或如何使用 CMS(如 WordPress)的知識問題,它還涉及其它主題,例如設計。但是,一個網站再漂亮,如果沒有人來訪問它還有什麼意義呢?因此,SEO已成為一個非常關鍵的點,因為訪問者的數量直接與網站SEO的結果相關聯。
說的簡單些,SEO可以分為4部分:優質的網頁內容、HTML標籤(放在頁面的頭部,標籤描述內容提供搜索引擎檢索訊息)、網站速度(Google和其他搜索引擎對快速網站有加權分)、反向鏈接(從第三方網站鏈接到自己的網站越多越好)。
在本文中,我們將討論第三點:【網站速度】。更準確地說,是什麼原因會導致 WordPress 網站速度變慢。我們將依循以下因素一一道來。
主題和外掛
如果您查看 wordpress.org 倉儲庫,您會發現數以千計的主題和外掛。它看起來是棒極了,這裡提供了大量的設計選擇和擴充的功能,但同時卻必須小心,因為倉儲庫裡所有的主題及外掛良莠不齊,有些程式開發不夠精良及錯誤,它們可能會拖累網站的速度。
主題
在本文中不可能寫出一份可以使用或不可使用的主題的列表,所以只會談談我們(Omahoung)認為最快且優的主題。討論之前有個重要說明:當您在網上看到一些速度測試結果時要注意到,許多在預設的 WordPress 頁面上完成的主題速度比較,其實是將主題『安裝在空的 WordPress上』,這樣的結果會失去客觀性。而WordPress 網站加載速度的比較應該是對具有豐富內容的真實網頁做測試,例如一般的主頁。所以測試的關鍵『不是要知道一個主題在一個空網站中的速度有多快,而是要知道它加載一個充滿內容的頁面的速度有多快』。
最快的 WordPress 主題是 GeneratePress,其次是 Kadence 和 Blocksy。所有這 3 個都是基於 Gutenberg 的主題,它們的程式開發和優化都做得很好。
外掛
一些複雜又重的外掛也會使網站變慢,例如Jetpack、Wordfence Security、Woocommerce、WPML…等外掛,因此在做網站開發時,準確了解您的需求很重要。例如,我們的一些客戶可能絕對想要安裝 Woocommerce,即使他們的產品很少並且實際上不做線上銷售,只是要展示商品。在這種情況下,一個更好的速度優化解決方案不是使用Woocommerce,而是創建一個名為“產品”的客製帖子類型,其中包含所需的客製分類和客製欄位,這樣做的結果將是創建出一個更快的網站。
WordPress頁面編輯器
談論外掛時要考慮的另一個重要點是頁面編輯器。這通常與主題相關聯,因為如今越來越多的主題是帶有自己的頁面編輯器。
我已經在 WordPress 上工作了一段時間,我看過很多 WordPress 網站,我常常覺得真的有很多人知道如何做一個 WordPress 網站,但很少有人知道如何正確的做WordPress 網站。無論您是否使用快速的主題和好的外掛,但如果您選擇了錯誤的頁面編輯器,您的網站將會變慢。
“我常常覺得真的有很多人知道如何做一個 WordPress 網站,但很少有人知道如何正確的做 WordPress 網站”
以下是最快的 WordPress 頁面編輯器列表:
- LiveCanvas
- Gutenberg(古騰堡)
- Nimble Builder(靈活的編輯器)
- Bricks Builder(積木編輯器)
- Oxygen Builder(氧氣編輯器)
LiveCanvas 是一個基於 HTML/CSS 的頁面編輯器,基於 BootStrap。它非常快,因為它允許直接在 HTML 和 CSS 中程式開發。唯一的問題是它是一個面向開發人員的工具,對初學者不太友好。
Gutenberg 是預設的 WordPress 編輯器。結合優秀的 Gutenberg blocks 外掛,Gutenberg 可以實現出色的設計和超快的加載速度。
Nimble Builder 是一個被低估的頁面編輯器,它易於使用且速度非常快。唯一的問題是它缺少一些功能,如果您需要復雜的設計,您可能會有點吃力。
如果您在網站中使用的頁面編輯器不在此列表中,那麼這可能是您的網站速度慢的可能原因。
延伸閱讀:WordPress網站開發,該選用 Elementor 或 Gutenberg?
網站開發
我在一些 WordPress 網站開發上經常看到的另一點問題點:『是開發階段缺乏嚴謹性』。這會導致“不乾淨”的外掛和資料庫。
那麼,究竟會發生什麼?有時,當 WordPress 網站開發人員需要創建特殊功能時,他們會安裝和測試幾個外掛。測試完成後,他們只保留一個並卸載其它外掛。但問題是安裝外掛會在資料庫中創建行或是表格,即使外掛被刪除,這些通常仍然存在。歸根究底,當網站完成時,由於來自這些已刪除外掛的所有垃圾數據,造成資料庫可能過於龐大。
另一個問題涉及頁面修訂。當我們在 WordPress 中編輯頁面時,會自動定期創建備份,這可能會導致資料庫中出現數千條未使用的行。這些也應該清理。
我也經常看到的第三個問題是開發人員忽略了停用未使用的外掛。每次在前端加載頁面時,所有啟用的外掛都會執行它們的一部分代碼。如果不需要外掛,則至少應將其停用,或者將其刪除。
最後一個問題是選擇了錯誤的外掛。它經常發生,這是由於缺乏關於應該使用哪個外掛的知識。當需要某個功能時,總會有幾個可以滿足需求。正常的過程應該是在測試網站上安裝這些外掛,以驗證它們的功能和速度。找到最佳外掛後,在真實網站中僅安裝和使用這一個。
因此,如果您的網站執行緩慢,其中一個可能原因是資料庫不乾淨且過於雜重、外掛過多或外掛選擇錯誤。
網站優化外掛
網站速度慢的第四個原因可能是沒有使用優化外掛。這裡要小心,前面的 3 點是最重要的,在安裝任何優化外掛之前有必要對它們進行處理。如果不是,那就有點像一個月不洗澡,把香水倒在身上來掩蓋難聞的氣味!前面3點必須先完成,才能優化網站。
很簡單,當頁面在瀏覽器(例如Chrome)上加載時,該頁面具有一定的大小(意味著必須下載多少 MB)並產生一定數量的請求(意味著必須下載多少檔案)。請求的大小和數量越低越好,優化外掛的主要目的是減少這些(當然還有其他)。
有幾個 WordPress 外掛可以使用:WP Rocket、LiteSpeed Cache、SG Optimizer、WP Optimizer 等等……在我們的網站上,我們主要使用 SG Optimizer,因為它簡單且高性能。
一個好的優化外掛應該包括:暫存系統、CSS 縮小化和組合、CSS 預加載、JS 縮小化和組合、延遲渲染阻塞 JS、HTML 縮小化、字體預加載、DNS 預取、WEBP 圖像片管理。
優化網站有時並非易事,因為某些功能可能會產生錯誤甚至破壞網站。當您優化您的網站時,請始終同時在前端執行測試,以檢查一切是否仍然正常運作。
伺服器
可能影響您的網站速度的最後一個原因是您的伺服器。
讓我先解釋一下這個問題。當您在瀏覽器上請求頁面時(點擊鏈接,在地址欄中輸入 URL),此請求與伺服器回饋之間的時間量稱為“伺服器回饋時間”(Server Response Time,SRT)。有了良好的 SRT,當然還有一個針對速度進行了優化的網站,您的網站似乎幾乎可以立即加載。沒有它,頁面將需要更長的時間來加載,這可能會損害用戶體驗,並最終損害搜索引擎排名。
SRT 以稱為第一個位元的時間 (Time to First Byte,TTFB) 的單位進行測量。 TTFB 測量客戶端發出請求和接收第一個資料位元之間的時間長度。它是以毫秒(milliseconds)為單位。
什麼是好的、壞的和可接受的 TTFB 各不相同。以下是一些一般規則:
- 快於 100 毫秒是極好的。
- 100–200 毫秒是好的。 Google PageSpeed Insights 建議 SRT 低於 200 毫秒。
- 200ms 到 1s 是可以接受的。
- 任何超過 1 秒時間的都是有問題。
所以現在首先要考慮的是伺服器位置。我有時會看到僅在對台灣市場銷售的公司將其網站安裝在位於美國的伺服器上。如果您的客戶在台灣,為什麼需要美國的伺服器呢?將您的網站安裝在遠離台灣的地方會增加伺服器回饋時間並使您的網站變慢。在這種情況下,您始終該考慮的是使用擁有在台灣附近伺服器的主機公司。例如我們自己的伺服器位於新加坡,因此我們可以保證網站能對在台灣的任何人展出快速回饋。
其次是測試自己的伺服器。如果您想知道自己伺服器的 TTFB 是什麼,您可以訪問 GTmetrix 或 Google PageSpeed Insights。輸入您網站的 URL 並執行測試。在 GTmetrix 中,您將在摘要部分看到 TTFB。在 Google PSI 裡,您可在 “診斷” (“diagnostics”)裡的錯誤和警告(errors and warnings))部分看到TTFB ,或如果您的 TTFB 是正常,則可在“通過審核”(“passed audits”)部分中找到它。
如果您已經按照前面的步驟優化了網站,而 TTFB 仍然高於 1s,這時就要考慮更換您的伺服器。
結論
一個 WordPress 網站加載速度慢的主因,通常是選擇錯誤主題和外掛的結果。許多主題很重,然後大多數的頁面編輯器都很慢…。另外資料庫更應該始終盡可能保持乾淨和輕量,尤其隨著時間的推移,網站的一些舊功能(外掛)需要刪除,一些新功能需要安裝的情況下。這是做WordPress 網站維護的開發人員應始終牢記的一點。
要了解 WordPress 佈景主題及外掛的速度測試細節結果,你可參考網站 namkawp.com。
Another interesting plugin for image optimization:
https://wordpress.org/plugins/optipic/
OptiPic automatic convert image to Webp (for webp-supported browsers) and compressed/optimized png/jpeg (for webp-unsupported browsers).
Thank you for your comment and for sharing the plugin suggestion. Image optimization is indeed an important aspect of website performance. While I haven’t personally used the OptiPic plugin yet, I appreciate you bringing it to my attention. It sounds interesting, especially with its automatic conversion to WebP and optimized PNG/JPEG for different browsers.
Like with any plugin recommendation, it’s crucial to thoroughly review and test the plugin first. Consider factors such as plugin compatibility, potential performance impact, and user reviews before integrating new tools into a website’s setup.
感谢分享