WordPress CDN加速能夠極大地提升網站速度體驗

WordPress CDN加速

網站速度方面的必備條件之一是內容交付網路 (CDN)。CDN減輕了您的Web伺服器的負擔,並加快了向所有站點訪問者的內容交付。結果,從您的使用者體驗到搜尋引擎潛力的一切都得到了改善!開始學習該主題的一個好方法是啟用WordPress CDN。

在本文中,我們將解釋將CDN新增到WordPress網站的最簡單方法。但在此之前,我們概述了CDN的基本定義為什麼要使用CDN,以及一些額外的好處。我們還將分享一些速度測試,以便您更好地判斷您希望在您的網站上看到多少效能提升。

  1. 什麼是CDN?
  2. CDN工作原理
  3. CDN的好處
  4. CDN速度測試
  5. 您需要CDN嗎?
  6. 流行的CDN提供商
  7. 如何在WordPress中安裝 CDN

什麼是CDN?

CDN是Content Delivery Network的縮寫。這些是位於全球的伺服器網路(也稱為POP)。它們旨在託管和交付WordPress站點的靜態(有時是動態)內容的副本,例如影象、CSS、JavaScript和視訊流。

內容交付網路(CDN)是網際網路上負責內容交付的透明骨幹。無論我們知道與否,我們每個人每天都在與CDN互動;當在新聞網站上閱讀文章、線上購物、觀看YouTube視訊或瀏覽社交媒體資訊時。

無論你做什麼,或者你消費什麼型別的內容,你都有可能發現CDN在每一個文字字元、每一個影象畫素和每一個傳遞到你的PC和移動瀏覽器的電影幀背後。

要理解為什麼CDN被如此廣泛地使用,你首先需要認識到它們被設計來解決的問題。它被稱為延遲,是指從你請求載入一個網頁到其內容實際出現在螢幕上的那一刻所發生的令人討厭的延遲。

該延遲間隔受到許多因素的影響,其中許多是針對特定的網頁。但在所有情況下,延遲時間都會受到你和該網站託管伺服器之間的物理距離的影響。

CDN的任務是實際上縮短這一物理距離,其目的是提高網站的渲染速度和效能。

CDN的工作原理

為了儘量減少訪問者與你的網站伺服器之間的距離,CDN在多個地理位置(又稱存在點,或PoPs)儲存其內容的快取版本。每個PoP都包含一些快取伺服器,負責向其附近的訪問者提供內容。

從本質上講,CDN一次將你的內容放在許多地方,為你的使用者提供卓越的覆蓋。例如,當倫敦的人訪問你在美國託管的網站時,是通過英國本地的PoP完成的。這要比讓訪問者的請求和你的迴應穿越整個大西洋的寬度來回要快得多。

這就是CDN的工作方式,簡而言之。當然,我們認為我們需要整個指南來解釋內容交付網路的內部工作,兔子洞更深。

首先,您不想讓CDN與您的WordPress託管公司混淆。這些是完全不同的服務。CDN不是您的託管服務提供商的替代品,而是提高網站速度的另一種方式。雖然有可能您的網站託管速度非常快,但CDN可以讓您的網站更快。

CDN究竟是如何工作的?例如,當您託管網站時,您必須選擇物理資料中心位置,例如美國中部、歐洲、南美或亞洲。假設您選擇美國中部。

這意味著您的網站實際上位於愛荷華州康瑟爾布拉夫斯的“主機伺服器”上。當歐洲人訪問您的網站時,載入時間比從德克薩斯州達拉斯訪問的人要長。為什麼?因為資料必須傳播更遠的距離。

這就是所謂的延遲。延遲是指通過網路傳輸資料所涉及的時間和/或延遲。距離越遠,延遲越大。

這就是CDN發揮作用的地方。它通過從更靠近它們的伺服器載入站點的內容來幫助減少延遲。這些CDN伺服器有時稱為POP(存在點)。

有無CDN的區別

有無CDN對比圖(via imperva

WordPress使用者有時不願意研究內容交付網路,因為它們聽起來太複雜了。但是CDN的功能相對簡單。以下是它們的工作方式,可以通過三個簡單的步驟實現:

第1步

您註冊一個帶有免費CDN的託管服務提供商或選擇一個單獨的CDN提供商並訂閱他們的服務。第三方CDN提供商通常會根據資料使用情況提供免費和高階計劃。

第2步

您在您的網站上啟用CDN。您可以為第三方CDN安裝一個免費外掛,如CDN EnablerWP Rocket來整合它。

這些外掛會自動將您的資產連結到CDN。您無需做任何工作即可將您的內容放到 CDN 上;這都是放手的!部署 CDN 比以前容易得多。

第3步

當人們訪問您的網站時,它會從全球不同的伺服器載入您的WordPress網站的內容。歐洲的訪問者從歐洲的伺服器接收您的網站內容,而美國的訪問者從距離他們更近的美國伺服器獲得相同的內容。

CDN如何實現這一目標?

CDN通常使用兩種技術將使用者路由到正確的位置:IP Anycast + 地理位置路由。他們可以自動檢測使用者請求的來源並將請求路由到最近的伺服器。

但是,為您的WordPress主機選擇戰略伺服器位置仍然至關重要。因為即使CDN有助於分發您的媒體和內容,當您的網站被載入時,仍然需要向託管服務提供商發出一個請求——除非您在代理伺服器上使用整頁快取,我們稍後將對此進行介紹。

CDN的好處

整體而言,CDN提供了四個顯著的好處。

  • 增加可靠性:沒有什麼是無懈可擊的,包括網際網路。伺服器癱瘓,網路過度擁堵,最終的結果是連線被破壞。CDNs使網路應用即使在這些動盪的時期也能繼續執行。它們通過平衡網路流量的負載來做到這一點,這樣就不會有任何一臺伺服器被過度使用。
  • 更好的效能:使用CDN可以減少高達50%的載入時間。這是通過減少檔案大小,減少內容儲存地和目的地之間的距離,以及優化伺服器以更快地響應使用者請求來實現的。
  • 節省成本:減少與源伺服器之間的交換次數是CDN減少開支的主要方式。有了CDN,網站的大部分內容都被快取起來,這意味著起源伺服器的工作更少,因為它不必重複交付相同的內容。
  • 對網路攻擊的保護:在抵禦拒絕服務(DoS)和分散式拒絕服務(DDoS)攻擊方面,CDN是最重要的。由於能夠吸收大量的垃圾網路流量,即使受到攻擊,它們也能夠保持網站的執行。

以下是在您的WordPress網站上使用CDN的諸多好處詳細說明:

1. 效能提升

效能提升是使用CDN的最大原因之一。已經反覆證明,更快的載入網站與更高的轉化率、更低的跳出率和更長的平均訪問者持續時間相關——更不用說更好的使用者體驗了。

您最後一次因為網站載入時間過長而在瀏覽器中點選返回是什麼時候?這是網站所有者最不想發生的事情。但不要相信我們的話。以下是行業領導者關於網站效能重要性的一些統計資料:

  • 頁面響應延遲1秒會導致轉化率降低7%。(來源:Kissmetrics
  • BBC發現,網站載入後每多一秒鐘就有10%的使用者離開他們的網站。(來源:創意部落格
  • 載入時間每延遲一秒,轉化率就會降低多達20%。(來源:ThinkWithGoogle
  • 在將頁面載入時間減少近40%後,Pinterest的註冊量增加了15%。(來源:Pinterest Engineering on Medium

以下是CDN可以幫助提高WordPress網站效能的幾種方法。

減少TTFB

我們已經在上面提到,WordPress CDN可以通過縮短資料傳輸所需的物理距離來幫助減少延遲。但它也可以幫助您縮短第一個位元組(TTFB) 的時間。

這測量瀏覽器在從伺服器接收到第一個資料位元組之前等待的時間。獲取該資料所需的時間越長,顯示您的頁面所需的時間就越長。

CDN可以幫助減少TTFB

CDN可以幫助減少TTFB

一個常見的誤解是TTFB是在DNS查詢時間之後計算的。但是,原始網路中TTFB的計算總是包括網路延遲。這涉及一個3步過程,因此延遲和延遲可能會發生在兩者之間的任何地方,從而增加您的總TTFB。

高TTFB可能由多種原因引起,例如糟糕的程式碼或主機伺服器上配置錯誤的快取。但地理距離是一個問題。

我們進行了兩項測試,以顯示使用和不使用Cloudflare的TTFB的差異。我們每個測試執行5次,然後取平均值。

測試 1:沒有CDN的 TTFB

我們首先在禁用CDN的情況下執行了Pingdom測試。結果如下:

  • 總載入時間為1.45 s
  • 平均TTFB約為136毫秒

新增CDN之前的TTFB

新增CDN之前的TTFB

測試 2:TTFB與CDN

然後我們啟用了CDN並再次執行測試:

  • 總載入時間降至788毫秒
  • 平均TTFB提高到37毫秒

CDN能帶來多大的改變!

另一個需要注意的重要事項是,我們選擇了斯德哥爾摩地點來執行此測試。為什麼?因為我們想向您展示通過減少物理距離可以實現的真正改進。斯德哥爾摩有一個CDN POP,所以我們的內容是從斯德哥爾摩提供的。

新增CDN後的TTFB

新增CDN後的TTFB

通過快取更快地交付

與您在WordPress主機或外掛中使用快取的方式類似,CDN也使用快取。這是他們可以如此快速地交付檔案的一種方式。

重要提示:一旦CDN獲得您的媒體副本,訪問者通常必須請求一次或兩次,然後才能將其快取在CDN上。CDN在請求上放置一個名為“X-Cache”的HTTP標頭。該檔案通常在第一個或第二個請求中顯示為MISS,這意味著它尚未快取。

CDN未快取 (MISS)

CDN未快取 (MISS)

在後續請求中,它顯示為HIT,現在快取在您的CDN上。它將根據各種因素(例如ETag標頭、過期標頭或手動清除CDN快取)保持快取。

CDN快取 (HIT)

CDN快取 (HIT)

使用諸如Cloudflare之類的CDN,您可以利用所謂的全頁反向代理快取將快取提升到一個新的水平。這涉及在一個主 URL 而不是輔助域上快取所有內容。

使用GZIP壓縮節省大量成本

WordPress CDN還利用GZIP,一種用於檔案壓縮和解壓縮的檔案格式和軟體應用程式。GZIP壓縮在伺服器端(或CDN伺服器/POP)啟用,進一步減小了HTML、樣式表和JavaScript檔案的大小。

它不適用於影象,因為它們已經以不同的方式壓縮。由於壓縮,有些人已經看到了高達70%的減少。這是您可以進行的最直接的優化之一。不用擔心,所有信譽良好的CDN都預設啟用此功能。

HTTP/2

HTTP/2也是所有CDN用來加速資產交付的主要功能之一。效能提升是由於各種原因,例如協議能夠支援更好的多路複用、並行性、Huffman編碼的HPACK壓縮、ALPN擴充套件和伺服器推送。

2. 降低頻寬成本

CDN的另一個好處是它可以幫助從您的託管伺服器(源伺服器)解除安裝CPU和資源。這有助於:

  • 防止流量高峰使您的主機不堪重負
  • 降低整體頻寬成本
  • 消除由於流量波動導致的頻寬費用波動

您最不想要的就是讓某些東西像病毒一樣傳播開來,而您卻要從房東那裡收到高額賬單或超額費用。

CDN幫助降低成本的另一種方法是提供簡單的方法來啟用盜鏈保護。這是指限制HTTP引用並防止其他人將您的資產嵌入其他網站。

你們中的一些人可能聽說過赫芬頓郵報的慘敗。《赫芬頓郵報》的一位作者從Oatmeal的網站複製並貼上了影象,該網站從AWS累積了1,000美元的賬單,該賬單已傳送給Oatmeal的網站所有者。Oatmeal的所有者最終替換了這些影象,以便赫芬頓郵報文章的讀者可以看到它們。

防盜鏈

防盜鏈

這就是為什麼始終必須啟用盜鏈保護的原因。否則,您最終可能會收到一筆離譜的賬單。

3. 高可用性和可擴充套件性

CDN提供高可用性和可擴充套件性。由於複製的內容可以跨不同地理位置的多個POP訪問,因此如果一個伺服器出現故障,Web流量會動態路由到另一臺伺服器。無需擔心可擴充套件性,因為CDN提供商在構建時就考慮到了這一點。如果您使用較小的共享主機,CDN可以防止您的網站崩潰,因為它可以處理大部分負載。

4. SEO優勢

谷歌早在2010年就將網站速度作為排名因素,因此更快的網站可以帶來更高的排名已經不是什麼祕密了。雖然無法知道速度對速度有多大影響,但您可以放心地假設它是更關鍵的因素之一,因為它會影響使用者體驗。

Brian Dean分析了前100萬個域名,以檢視網站速度與Google排名之間的關係, 並發現了正相關關係。雖然這些測試幾乎無法證明,但您可以放心,擁有更快的網站只會在Google中幫助您。簡而言之,谷歌獎勵快速網站。

網站速度 - 谷歌排名

網站速度 – 谷歌排名

除了網站頁面的速度之外,CDN還有助於提高媒體的抓取速度,例如圖片,這與Google圖片搜尋中的索引相關。

5. 額外的安全性

許多CDN通過允許您實施Web應用程式防火牆 ( WAF ) 和一些所謂的Origin shields來提供額外的安全性。這些可以幫助:

  • 緩解各種形式和規模的DDoS攻擊,包括針對UDP和ICMP協議的攻擊
  • 阻止SYN/ACK、DNS放大和第7層攻擊
  • 將您的網站放在代理後面,該代理會隱藏您的原始IP地址,儘管它不是防彈的

檢視我們關於如何阻止DDoS攻擊的案例研究。我們的客戶擁有一個執行Easy Digital Downloads的小型電子商務網站,該網站在7天內對單個頁面的請求超過500萬次

該站點通常每天僅產生30-40 MB的頻寬和數百名訪問者。但該網站突然間突然達到了每天15-19GB 的資料傳輸量!這增加了4650%。谷歌分析顯示沒有額外的流量。這不好。

DDoS攻擊

DDoS攻擊

客戶在他們的站點上實施了Sucuri的Web應用程式防火牆,所有頻寬和請求都立即丟棄在站點上(如下所示),此後再也沒有出現過任何問題。因此,如果您遇到此類問題,這是一項很好的投資和節省時間的方法。

新增WAF防火牆

CDN還提供額外的安全功能,例如安全令牌,允許您生成具有過期時間的安全連結。過期後,使用者將無法再訪問該內容。

CDN速度測試:使用CDN與不使用CDN

讓我們做一些測試來向您展示結果,而不是僅僅告訴您WordPress CDN的好處。

  • 我們從4個不同的測試位置執行了5次測試,啟用了CDN,然後沒有啟用CDN。
  • 該站點使用免費的Cloudflare。
  • 伺服器的物理位置在美國愛荷華州。

重要提示:當您對CDN進行速度測試時,請執行幾次以快取媒體。正如我們之前關於CDN快取所描述的,X-Cache HTTP標頭在快取後將顯示“HIT”。如果它沒有被快取,它會顯示一個“MISS”。如果您沒有正確執行此操作,那麼當您沒有先建立快取時,CDN可能無法幫助您加快網站速度。

沒有CDN(美國德克薩斯州達拉斯)

我們首先使用達拉斯的一臺沒有CDN的伺服器執行了5次Pingdom測試。然後我們取平均值。

沒有使用達拉斯伺服器進行CDN測試

沒有使用達拉斯伺服器進行CDN測試(來源:Pingdom)

沒有CDN(澳大利亞墨爾本)

然後,我們使用沒有CDN的澳大利亞墨爾本伺服器執行了5次Pingdom測試。也取了平均值。

沒有使用澳大利亞伺服器的CDN測試

沒有使用澳大利亞伺服器的CDN測試(來源:Pingdom)

沒有CDN(美國加利福尼亞州聖何塞)

然後,我們在加利福尼亞州聖何塞進行了5次沒有CDN的Pingdom測試,並取平均值。

沒有來自聖何塞伺服器的CDN測試

沒有來自聖何塞伺服器的CDN測試(來源:Pingdom)

沒有CDN(瑞典斯德哥爾摩)

我們在瑞典斯德哥爾摩進行了5次沒有CDN的Pingdom測試,並取了平均值。

沒有在瑞典使用伺服器進行CDN測試

沒有在瑞典使用伺服器進行CDN測試(來源:Pingdom)

使用CDN(美國德克薩斯州達拉斯)

作為比較,我們使用德克薩斯州達拉斯伺服器上的活動CDN執行了5次Pingdom測試。之後取平均值。

使用達拉斯伺服器使用CDN進行測試

使用達拉斯伺服器使用CDN進行測試(來源:Pingdom)

使用CDN(澳大利亞墨爾本)

然後,我們使用來自澳大利亞墨爾本伺服器的CDN執行了5次Pingdom測試,然後取平均值。

用CDN測試澳大利亞

用CDN測試澳大利亞(來源:Pingdom)

使用CDN(美國加利福尼亞州聖何塞)

我們還使用加利福尼亞州聖何塞的伺服器對CDN進行了5次Pingdom測試並取平均值。

使用San Jose伺服器進行CDN測試

使用San Jose伺服器進行CDN測試(來源:Pingdom)

使用CDN(瑞典斯德哥爾摩)

我們為具有活動CDN的Stockholm伺服器執行了5次Pingdom測試。然後取平均值。

使用瑞典的伺服器進行CDN測試

使用瑞典的伺服器進行CDN測試(來源:Pingdom)

結果

讓我們看看結果以瞭解CDN對總載入時間的影響程度。

CDN速度測試對比

CDN速度測試對比

  • 美國德克薩斯州達拉斯:使用CDN將總載入時間減少8.11%。
  • 美國加利福尼亞州聖何塞:使用CDN的總載入時間減少33.02%
  • 澳大利亞墨爾本:使用CDN的總載入時間減少了54.19%。
  • 瑞典斯德哥爾摩:使用CDN的總載入時間減少了54.7%。

CDN在達拉斯和聖何塞站點上產生了稍快的頁面載入時間。但是,如果您檢視澳大利亞的測試,您會發現載入時間存在巨大差異。這是因為測試伺服器的地理位置。

測試伺服器位於愛荷華州,因此在沒有來自達拉斯和聖何塞的CDN的情況下載入資料時不會走那麼遠。但對於澳大利亞來說,距離才是縮短載入時間的關鍵。

當我們啟用CDN時,來自澳大利亞悉尼的CDN POP的內容和媒體載入,這會導致下載時間大大加快。瑞典斯德哥爾摩也是如此。

現在,您想在某些情況下將載入時間減少50%以上嗎?答案應該是肯定的!

您需要CDN嗎?

我們經常收到這個問題。根據我們的經驗,這不應該是一個問題,因為CDN在幾乎所有情況下都是有益的,無論您的網站的大小和流量如何。

看看我們上面列出的所有好處。價格通常不再是一個因素,因為大多數CDN提供商非常便宜,或者使用免費Cloudflare。更不用說,CDN有助於改善SEO、網站載入、使用者體驗等等!

如果您只向特定地理位置的訪問者提供內容,您可能需要做一些進一步的測試。

例如,假設您在加拿大安大略省經營一家帶有網站的小商店。也許您不太關心位於其他地方的客戶。您需要研究CDN提供商的POP所在的位置。

如果您的網路伺服器主機位於安大略省,但您註冊的CDN提供商僅在美國提供最近的POP,則可能會降低您的網站速度。在這種非常罕見的情況下,不使用CDN可能會使您受益。

有很多很棒的CDN提供商,我們鼓勵您探索其他一些頂級 CDN:

  • Fastly CDN
  • StackPath
  • Amazon CloudFront
  • Imperva CDN
  • Sucuri
  • Ezoic

如何在WordPress中安裝CDN

每個CDN提供商都有自己的整合方法,但值得慶幸的是,它們都支援WordPress並使其易於整合。如果您遇到問題,請檢視他們的文件或詢問他們的支援團隊。

Cloudflare

如果您正在使用Cloudflare,我們將提供有關如何在您的WordPress網站上安裝Cloudflare的深入教程。

第三方CDN

如果您正在考慮自己部署CDN,我們建議為您的媒體和資產使用子域,而不是提供商的隨機URL。

示例: cdn.yourdomain.com。

這將確保更好地為您的網站打造品牌,並在索引問題方面減少麻煩。

在提供商處設定好CDN後,您可以使用免費的WordPress外掛快速連結您的資產並自動將它們複製到您的CDN提供商。在下面檢視我們推薦的WordPress CDN外掛列表。

頂級CDN外掛和擴充套件

Cloudflare

這些CDN外掛不會自動在您的WordPress網站上啟用CDN,而是將第三方CDN提供商(如Cloudflare、Fastly或Sucuri)連線到您的WordPress網站,從而允許CDN訪問網站資產並將該內容交付給訪客。

總體而言,最好的WordPress CDN外掛讓您輕鬆連線,提供一鍵式解決方案,而不是複雜的整合。

以下是最好的WordPress CDN外掛:

  • Cloudflare:如果使用Cloudflare作為您的CDN提供商,這是正確的選擇,特別是因為它提供一鍵式安裝、Web應用程式防火牆設定和自動平臺優化工具,可通過250多個快速可靠的資料顯著加快站點速度中心。
  • Bunny.net:作為CDN提供商和WordPress CDN外掛,Bunny.net提供快速整合來替換連結並將它們新增到您的CDN。通過自動HTTPS配置、自定義CDN主機名以及將特定目錄排除在CDN服務之外的能力,您可以獲得快速的效能改進。
  • LiteSpeed Cache:首先,這是一個快取外掛。但它還附帶免費的QUIC.cloud CDN快取,或者您可以連結到任何CDN提供商。您可以使用各種功能以及縮小、影象優化和延遲載入來提高網站的效能。
  • W3 Total Cache:許多快取外掛也兼作CDN WordPress外掛,W3 Total Cache也不例外。與一些最受歡迎的CDN提供商整合,無需任何複雜設定即可立即提升您的網站效能。這會將媒體專案和主題檔案等元素髮送到CDN,同時在CDN中使用之前快取和壓縮這些檔案。
  • CDN Enabler: 此外掛重寫您的所有URL,以便從您的外部CDN提供資產。您可以連結到KeyCDN帳戶並利用快取清除、效能增強等。

使用CDN索引影象

您希望確保Google在移動到CDN時仍會為您的影象編制索引。

對於Yoast SEO外掛的使用者,您需要將以下程式碼新增到您的functions.php檔案的底部。將域和CDN域替換為您自己的域。

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
function wpseo_cdn_filter( $uri ) {
return str_replace( 'http://yourdomain.com', 'http://cdn.yourdomain.com', $uri );
}
add_filter( 'wpseo_xml_sitemap_img_src', 'wpseo_cdn_filter' );
function wpseo_cdn_filter( $uri ) { return str_replace( 'http://yourdomain.com', 'http://cdn.yourdomain.com', $uri ); } add_filter( 'wpseo_xml_sitemap_img_src', 'wpseo_cdn_filter' );
function wpseo_cdn_filter( $uri ) {

return str_replace( 'http://yourdomain.com', 'http://cdn.yourdomain.com', $uri );

}

add_filter( 'wpseo_xml_sitemap_img_src', 'wpseo_cdn_filter' );

如果您不這樣做,可能會導致您的影象被取消索引(如下所示)。您可以隨時在Google Search Console中自行檢查。

圖片未編入索引

圖片未編入索引

但是,Google Search Console存在缺陷,有時當索引影象出現在Google上時無法報告它們。檢查您的影象是否被索引的一個好方法是前往谷歌影象搜尋並輸入以下內容:“site:https://yourdomain.com”。

谷歌圖片搜尋檢查索引

谷歌圖片搜尋檢查索引

重要提示:不要輸入您的CDN URL。即使影象是從CDN提供的,它們仍應在您的根域上編制索引。

如果您的圖片出現在Google圖片搜尋中,它們就會被很好地編入索引。

小結

現在您可以看到使用WordPress CDN可以獲得的所有奇妙好處。它將確保您的媒體在全球範圍內更快地載入,減少您的TTFB,並顯著降低您的頻寬成本和伺服器負載。

不僅如此,由於更快的頁面載入時間,您還可以看到更好的排名。最重要的是,您的訪問者將獲得更出色的使用者體驗。

評論留言