Divi 速度優化：終極指南

已發表: 2021-08-25

Divi 不僅僅是任何頁面構建器。 Divi 通過完整的網頁設計系統將設計過程提升到一個全新的水平，讓您可以直觀地設計網站的每個部分。 但這並不意味著 Divi 必須緩慢。 離得很遠。

Divi 內置的速度和性能優化功能可以輕鬆將您的網站置於 Google PageSpeed 得分列表的頂部。 憑藉動態模塊框架、動態 CSS、動態 JavaScript 庫等功能，Divi 現在既是一個強大的頁面構建器，又是一個輕量級主題。 但與 Divi 一樣快，還有其他潛在因素需要優化。 如果不加以解決，您的 Divi 網站的速度將不必要地受到影響。

在這篇文章中，我們將探討已經為加速 Divi 所做的工作以及我們可以做些什麼來使其更快。 以下是我們將涵蓋的一些關鍵主題：

  • WordPress 性能與 Divi 性能
  • Divi 的內置速度和性能優化功能
  • 動態模塊框架
  • 動態 JavaScript 庫
  • 推遲 jQuery 和 jQuery 遷移
  • 動態 CSS
  • 關鍵 CSS
  • 臨界閾值高度
  • 加載動態內嵌樣式表
  • 改進谷歌字體加載
  • 禁用 WordPress 表情符號
  • 推遲古騰堡塊 CSS
  • 動態圖標
  • 響應式圖像的原生 Srcset 支持
  • 您可以做 14 件事來優化您的 Divi 網站的速度和性能
  • #1 升級您的主機
  • #2 TTFB 優化
  • #3 優化您網站的數據庫
  • #4 優化您的 DNS
  • #5 使用內容分發網絡 (CDN)
  • #6 添加緩存
  • #7 添加縮小和聚合
  • #8 啟用 Gzip 壓縮
  • #9 圖像優化
  • #10 視頻優化
  • #11 建立你的 Divi 頁面以提高速度
  • #12 小心謹慎地使用插件
  • #13 進行速度測試
  • #14 考慮我們的 Divi 高速頁面藍圖
  • 使用 Divi 和其他第三方性能插件
  • 其他提示

WordPress 性能與 Divi 性能

Divi 通常不是您網站性能的主要決定因素。 這只是拼圖的一部分。 您還需要考慮一般 WordPress 網站的底層優化需求。 Divi（Divi 主題和/或 Divi Builder）位於 WordPress（CMS）之上，後者位於一堆服務器軟件之上，而後者又位於託管基礎設施之上。 所有這些都需要正確調整。 首先，這些包括良好的託管、緩存和 CDN。 如果沒有這些底層優化，無論我們如何優化 Divi，Divi 站點都會變慢。 因此，如果您的 Divi 網站速度很慢，那麼您也需要考慮這些其他難題。

有了 WordPress 網站的底層優化需求，我們需要解決 Divi 的性能優化問題。 這是通過增強 Divi 主題和/或 Divi Builder 的性能來實現的，確保它在它基於 WordPress 構建的領域和它在 WordPress 中工作的領域中表現最佳。 一旦優化了所有這些部分，我們就可以成功構建具有最佳速度和性能的 Divi 網站。

在下面的文章的其餘部分中，我們將首先解決 Divi 的內置性能優化（已經為您完成的工作）。 然後我們將通過解決一些潛在的優化需求（您可以做的其他事情）來解決如何進一步優化您的 Divi 網站。

Divi 的內置速度和性能優化功能

首先，讓我們來看看 Divi 已經具備的一些內置速度和性能優化。 這些優化功能從各個角度加速了 Divi，使其成為市場上最快的頁面構建器。 但這還不是全部。 Divi 採用動態框架構建，可消除膨脹，並提供一個基礎，使 Divi 可以通過更多模塊和更多功能增長，而無需為您的網站增加膨脹。 這為您提供了兩全其美的優勢：擴展頁面構建器的強大功能和輕量級主題的敏捷性。

可以通過導航到 Divi > 主題選項來管理性能優化功能。 在常規選項卡下，選擇性能子選項卡。

分區速度優化

現在讓我們仔細看看使構建超快速 Divi 網站變得如此容易的功能。

動態模塊框架

動態模塊框架功能通過按需選擇和執行 PHP 函數以強大的方式提高站點速度。 Divi 處理所需的邏輯，以便在運行中僅呈現每個頁面上使用的模塊和功能——其他一切都被排除在外。 換句話說，任何可能被視為“膨脹”的東西都會從後端刪除。

按需模塊

例如，如果你在一個頁面上有 3 個模塊，Divi 只會處理這 3 個模塊所需的功能，而不是處理所有模塊的所有功能，而不管使用哪個模塊。 這 3 個函數將將該模塊的短代碼/HTML 呈現到頁面上，而不會浪費任何處理時間。

分區速度優化

點播功能

正如 Divi 按需動態處理和加載模塊一樣，Divi 對頁面上使用的所有功能也執行相同的操作。 Divi 不處理可在 Divi 元素上使用的所有可能特徵的函數（滾動效果、動畫、粘性選項、邊框選項等），Divi 僅處理元素上實際使用的那些特徵函數。 此功能不僅適用於模塊，還適用於任何 Divi 元素，包括部分、行和列。

divi 防膨脹功能可提高網站速度

動態 Javascript 庫

為了提高網站速度，我們優化了 Divi 的 JavaScript，使其更加簡潔和模塊化。 這允許 Divi 動態按需加載 JavaScript。 僅當頁面上的模塊或功能需要時，Divi 才會加載和處理 JavaScript 函數（如粘性選項）以及外部 JavaScript 庫（如 Magnific Popup）。

較小的基本 Javascript 文件大小與動態 JavaScript 庫相結合肯定會提高站點速度，因為每個頁面加載需要處理的代碼更少。 未使用的腳本被刪除。 而且，因為這種防膨脹邏輯是在每頁的基礎上發生的，如果您在一個頁面上有一個粘性行，您就不必擔心粘性 JavaScript 會加載到沒有它的頁面上。 這就是 Divi 動態 JavaScript 的美妙之處。

示例：使用 Lightbox 的圖像模塊的動態 JavaScript 庫

假設您有一個帶有啟用燈箱的圖像模塊的頁面。 Divi 將動態指向並運行該頁面的 Magnific Popup JS 庫，以便應用該燈箱彈出功能。 如果在圖像上禁用了燈箱，則不會在頁面上加載或運行 JS 庫。

divi 抗膨脹功能可提高網站速度

推遲 jQuery 和 jQuery 遷移

在可能的情況下，jQuery 和 jQuery Migrate 將移至正文以刪除渲染阻塞請求並加快加載時間。 如下圖所示，如果 jQuery 腳本提前加載（在標題中），它將暫停 HTML 的解析，直到腳本被執行。 這會減慢頁面的渲染速度

分區速度優化

只有另一方面，如果第三方插件將 jQuery 註冊為依賴項，它將被移回頭部以避免衝突。 如果此選項導致問題，則可以禁用該選項。

動態 CSS

動態 CSS 將相同的反膨脹邏輯（在動態模塊框架中使用）應用於 Divi 的樣式表。 可以想像，考慮到 Divi 的所有功能，它的主要樣式表會非常大。 但是在每個頁面上加載一個大的樣式表會導致不必要的膨脹和更慢的頁面加載時間。

使用動態 CSS，Divi 的 CSS 被分解為數百個小組件。 在每個頁面上，這些 CSS 組件組合在一起形成一個獨特的樣式表，其中僅包含根據您使用的模塊、模塊功能和主題佈局選項設置特定頁面樣式所需的部分。

divi 抗膨脹功能可提高網站速度

這修復了 CSS 膨脹問題，因為它現在不存在。 沒有膨脹，因為沒有加載其他 CSS。 如果沒有動態 CSS，Divi 的樣式表將在900kb左右，無論內容如何，它都會加載到所有頁面上。 現在，如果頁面只需要 80kb 的 CSS，動態 CSS 消除了不需要加載頁面的 800+kb。 這意味著您的頁面加載速度更快。

關鍵 CSS

Divi 的關鍵 CSS 系統通過識別對首屏內容進行樣式設置所需的 CSS 並推遲其他所有內容來提高站點速度。 由於在頁面首次加載時只需要關鍵樣式，並且由於渲染阻塞資產在頁面速度方面發揮著如此重要的作用，Divi 自動分離關鍵和非關鍵樣式的能力使其比其他 WordPress 主題和構建器具有巨大優勢. 在 Divi 處理完其 CSS 後，網站標題中幾乎沒有任何剩餘內容，這意味著內容會立即顯示，這就是為什麼 Google 立即為 Divi 網站提供如此高的分數。

例如，如果您的首屏內容由標題、段落、按鈕和圖像組成，那麼訪問者加載頁面後，只會加載與這些元素相關的 CSS。 當然，其餘的 CSS 也會被加載，但不會在第一次交互時加載。 這就是所謂的非關鍵 CSS。

div 批判性 css

有關此功能如何工作以及如何使用它的更完整說明，請查看我們關於 Divi 的關鍵 CSS 功能如何提高網站速度以及如何構建最快的 Divi 頁面的文章。

臨界閾值高度

與臨界 CSS 相關的是臨界閾值高度選項。

啟用關鍵 CSS 後，Divi 會確定“首屏閾值”並推遲首屏元素的所有樣式。 但是，此閾值只是一個估計值，可能因不同設備而異。 增加閾值高度將延遲更少的樣式，導致加載時間稍慢，但發生累積佈局偏移 (CLS) 的機會更少。 如果您遇到 CLS 問題，您可以增加閾值高度。

加載動態內嵌樣式表

Load Dynamic In-Line Stylesheet 選項是最終的 CSS 優化，它刪除了所有阻止渲染的 CSS 請求。

由於動態 CSS，基本的 Divi 樣式表現在足夠小，可以在實際頁面上內嵌加載！ 內嵌加載此 CSS 會刪除渲染阻止請求並提高 Google PageSpeed 分數。 啟用關鍵 CSS、動態 CSS 和加載動態內聯樣式表選項後，將刪除所有阻止渲染的 CSS 請求。

改進谷歌字體加載

改進 Google 字體加載選項可以緩存 Google 字體並在標題中內嵌加載它們。 這減少了渲染阻塞請求並加快了加載時間。

我們還添加了限制舊版瀏覽器的 Google 字體支持選項。

這基本上刪除了舊字體文件以減少有效負載。 啟用此選項將減小 Google Fonts 的大小並縮短加載時間，但是，它會限制某些非常舊的瀏覽器對 Google Fonts 的支持。 您可以關閉此功能以增加對舊瀏覽器的支持，但會降低性能。

禁用 WordPress 表情符號

WordPress 帶有一個原生表情符號系統，但由於現代瀏覽器中的原生表情符號支持，這真的不再需要了。 事實上，原生表情符號看起來比 WordPress 版本要好得多。 Divi 為您提供禁用原生 WordPress 表情符號的選項，從而刪除不需要的資源。 使用更少的資源來呈現會導致更快的頁面加載。

推遲古騰堡塊 CSS

在頁面上使用 Divi Builder 時，您還選擇不使用默認的 WordPress 塊編輯器（Gutenberg）。 而且由於您不會使用塊來設置頁面樣式，因此您不需要 Gutenberg CSS 渲染阻止您的 Divi 頁面加載。 啟用延遲古騰堡塊 CSS 選項後，Divi 現在（默認情況下）將在您使用 Divi Builder 的頁面上延遲加載古騰堡塊 CSS。 它仍然會加載以防萬一（在頁腳中），但它不再是渲染阻塞。

動態圖標

Divi 現在隨附圖標字體子集，這些子集根據您使用的模塊和功能按需加載。 這將 Divi 的基本圖標字體大小從 90kb 一直減小到 6kb。 僅在需要時加載完整的圖標集。 如果您使用子主題或自定義 Divi 模塊，則默認情況下禁用此選項。 如果您的子主題或第三方 Divi 模塊使用完整的 Divi 圖標集，則此選項應保持禁用狀態。

根據頁面需要使用三種圖標字體子集。

  • 基本 - 此子集包括 Divi 主題及其模塊中默認使用的所有圖標。
  • 社交 - 此子集包括所有基本圖標和所有社交圖標，這些圖標在使用社交媒體關注模塊時加載。
  • 全部 - 這是在 Divi 模塊中使用圖標選擇器選擇自定義圖標時使用的整個圖標集。

這是由於頁面上存在社交媒體關注模塊而動態加載的社交圖標字體子集的示例。

如果您需要訪問所有頁面上的整個圖標字體（例如，如果您在子主題中使用我們的圖標字體），那麼您可以禁用此選項並在所有頁面上加載整個圖標字體庫。

響應式圖像的原生 Srcset 支持

分區速度優化

Divi 包括對所有 Divi 圖像的原生 SRCSET 支持，這意味著 Divi 將自動使您的圖像具有響應性，並為每個設備提供完美尺寸的圖像。 由於較小的圖像提供給較小的設備，這可以大大提高加載速度，並且不需要您做任何額外的工作。

您可以做 14 件事來優化您的 Divi 網站的速度和性能

速度優化繼續在您網站的用戶體驗及其搜索引擎優化 (SEO) 中發揮關鍵作用。 因此，為了讓您的 Divi 網站對訪問者和 Google 表現良好，您需要解決 Divi 之外的那些區域，以進一步優化您的網站速度。

您可以通過以下 14 件事來優化 Divi 網站的速度和性能……

#1 升級您的主機

如果您對網站的速度（和性能）非常重視，那麼首先要選擇一個好的託管服務提供商。 事實上，您可以盡一切努力優化您的網站以提高速度，但由於您的主機，您的網站仍然很慢。 真正優秀的託管服務提供商會為您進行大量速度優化，因此您不必擔心。 因此，如果您的 Divi 站點速度較慢，則第一步是考慮升級您的主機。

使用 Divi 優化託管

如果您想要一個快速的 Divi 網站，那麼選擇不僅針對 WordPress 還針對 Divi 進行優化的託管服務提供商是有意義的。 因此，如果您正在尋找與 Divi 完美配合併帶有自動安裝 Divi 的出色 WordPress 託管，那麼 Divi Hosting 是您的絕佳新解決方案。 我們與一些我們最喜歡的 WordPress 主機（Pressable、Flywheel 和 SiteGround）合作，為 Divi 客戶提供一種簡單的方法來創建快速的 Divi 網站，由滿足 Divi 的所有要求的現代託管基礎設施提供支持，並由領先的 WordPress 專業人士提供支持.

為什麼選擇 Divi Hosting？

最終，每個 Divi 用戶都需要對託管做出選擇。 做出錯誤的選擇會導致很多悲傷。 我們想讓這個選擇變得容易。 以下是使 Divi Hosting 與眾不同的幾件事：

  • 創建網站時，Divi 會自動安裝。
  • 您的新網站會自動連接到您的 Elegant Themes 帳戶並使用您的許可證密鑰進行設置，以便您可以獲得更新和支持。
  • 您的託管環境將配置為開箱即用地滿足 Divi 推薦的所有 PHP 設置。 無需調整。
  • 您的網站將由快速且現代的託管基礎設施提供支持，這意味著快速加載時間和自動緩存和 CDN 等現代工具。
  • 您將由一家內外都了解 WordPress 的公司託管。
  • 您將由我們的一位合作夥伴託管，這意味著他們致力於確保在其係統上獲得出色的 Divi 體驗。

有很多託管選項，而且它們並非都是平等的。 我們每天都在幫助客戶處理與託管相關的兼容性問題，這些問題可能令人非常沮喪。 每個人都需要託管才能使用 Divi，而您的託管體驗無需掙扎。 有關更多信息，請了解 Divi 託管如何成為 Divi 的最佳託管解決方案。

為您的 Divi 站點尋找合適的託管解決方案

請您將n EED用航空維修主機有一個快速的航空維修網站？ 絕對不。 還有其他出色的託管解決方案，而 Divi 將始終在出色的託管環境中運行良好。 但是由於託管在速度和性能優化方面起著如此關鍵的作用，您應該花必要的時間為您的 Divi 站點找到合適的託管解決方案。

那裡有很多很棒的和不太優秀的託管公司。 每一個通常都提供多種託管解決方案和服務。 因此，找到合適的人可能會讓人不知所措。 以下是有關在為您的 Divi 站點尋找合適的託管解決方案時要考慮的最常見託管類型的一些有用信息。

傳統（共享）託管（不推薦）

這是迄今為止最受 WordPress 用戶歡迎的託管類型，這在很大程度上是因為它最實惠。 但不幸的是，這是速度優化最糟糕的選擇。 使用傳統的共享主機，您將與他人共享服務器的所有可用資源。 因為您是共享的，所以這種託管的成本很低。 但缺點是您無法控制其他站點在您的共享服務器上獲得的流量。 因此，您很容易陷入加載速度極慢的時期，甚至網站完全關閉的時期。 所以你最好清楚你的共享主機可以處理多少流量。

專用主機

使用專用主機，您將擁有專屬於您的專用服務器。 無需與任何人共享任何資源。 這意味著您的網站將擁有更可預測且一致的快速加載時間。 這通常作為大公司的頂級選項以高溢價提供。

VPS 主機

虛擬專用服務器 (VPS) 託管基本上是共享和專用託管之間的中間地帶。 您的服務器空間是“私有的”，這意味著它與其他人完全分開（有點像您站點文件的封閉社區）。 因此您的站點文件不會暴露給服務器上的其他人。 與共享主機不同，VPS 確實擁有大量的專用系統資源（或電源）供您使用，以確保您的站點始終獲得所需的資源，從而始終如一地提供快速加載時間。 因此，您不必擔心其他網站的流量高峰會影響您的網站速度。

但是，除非您有託管的 VPS，否則這種託管主要適用於那些精通技術以自行處理事情的 DIY 類型。 有關更多信息，請參閱 VPS 託管和共享託管之間的性能比較。

雲主機

使用雲託管，您可以訪問服務器網絡（在雲中）而不是單個物理服務器。 這允許您根據需要從該服務器網絡中提取所需的所有資源。 從本質上講，您擁有一個由整個網絡的力量和資源支持的服務器空間的虛擬分區。 因此，您不必像在共享主機中那樣擔心流量高峰。 雲託管非常靈活，可根據您的需求進行擴展。

雲託管和 VPS 託管之間的一個主要區別在於，VPS 託管具有專用（或有限）數量的資源可供提取，這些資源可能會耗盡，也可能不會耗盡。 另一方面，雲託管能夠在不耗盡資源的情況下保持您的資源可用，因為它始終可以從雲中的其他服務器中提取。 理論上，雲託管提供了更加一致和可靠的高速。 因此，如果您對速度很在意，雲託管是一個不錯的選擇（甚至可能是最好的選擇）。

託管 WordPress 託管

託管 WordPress 主機通常是指由 WordPress 專家管理的共享主機。 它通常比傳統的共享主機貴一點，但如果你想要一個更快的 Divi 網站，託管 WordPress 主機可能是值得的。 它不像 VPS 那樣“私密”，也不像專用託管環境那樣強大。 但它確實有助於通過讓 WordPress 專家完成工作來最大限度地提高共享環境的速度。 他們做得很好，因為他們為 WordPress 站點量身定制了服務並嚴格配置了服務器。 其中很多都帶有許多酷炫而方便的內置功能，例如一鍵登台環境、站點緩存、一鍵 CDN 部署、自動備份、SSL 等。 它們非常適合我們這些不想依賴（或管理）一堆插件來進行基本速度優化、安全性和管理的人。

事實上，Divi Hosting 是針對 Divi 優化的託管 WordPress 託管。 這消除了為您的 Divi 站點優化託管環境的所有麻煩。

#2 優化第一個字節的時間（TTFB）

分區速度優化

什麼是TTFB？

首字節時間 (TTFB) 是用戶從您的主機/服務器接收網站數據的第一個字節所需的時間。 因此，當用戶發出 HTTP 請求（加載您的網頁）時，TTFB 實質上就是瀏覽器接收任何數據之前的等待期。 這很重要，因為 TTFB 越長，頁面加載所需的時間就越長。

把它想像成吃快餐。 餐廳可能會被優化以快速提供您的食物。 事實上，他們可能已經有一個漢堡包在等著你。 但是您仍然需要排隊等候訂購。 那個等待期就是你可以認為第一口的時間（看看我在那裡做了什麼）。

TTFB 應該在 200 毫秒左右（根據 Google 的說法）。 但是對於託管不佳且尚未優化的站點，TTFB 很容易達到 2 秒或更長時間。

是什麼導致 TTFB 緩慢？

您的 Divi 站點上的 TTFB 延遲通常是由以下原因引起的：

  • 需要接收的動態內容量。 這可以通過緩存、數據庫優化和 CDN 來減少。
  • 您的服務器當時正在經歷的流量。 傳統（或共享）託管服務提供商很難關閉 TTFB，因為您要與同一服務器上的其他人共享資源。 他們的流量高峰會降低您服務器的處理速度。
  • 您的網絡服務器配置。 一個好的 WordPress 託管服務提供商可以通過提供可靠的後端基礎設施和優化您的 Web 服務器配置（事情幾乎不受您控制）來幫助您網站的 TTFB。

如何加速您的 Divi 站點的 TTFB

TTFB 是 Google 用來確定您網站排名的 Web Vitals（以及 FCP、LCP 和 CLS）之一。 所以優化它很重要。 好消息是 TTFB 可以優化。 以下是一些可用於減少 TTFB 的關鍵技巧。

  • 升級您的主機。 提升 TTFB 的最有效方法是簡單地升級您的主機。 為 WordPress 或 Divi Hosting 的託管主機支付更多費用將對 TTFB 產生最大的影響。
  • 使用 CDN 。 這將允許訪問者從離他們最近的服務器加載您網站的數據，以便您可以減少延遲並減少 TTFB。
  • 刪除不必要的插件或主題。 插件和主題（尤其是過時的）可能會使您站點的服務器和加載時間（包括 TTFB）陷入困境。 因此，最好只使用基本質量的插件（或主題）並刪除其他插件。
  • 實現緩存。 Divi 具有用於交付 Divi JS 和 CSS 的內置緩存。 但是將您的網站作為一個整體緩存，除了使用 CDN 之外，還會減少 TTFB。
使用 Cloudflare 提升 TTFB

快速提升站點 TTFB 的一種方法是使用 Cloudflare。 免費計劃中提供的緩存和 CDN 肯定會提升 TTFB。 您還可以利用 Cloudflare 的自動平台優化功能，該功能已經過測試，顯示 TTFB 減少了 72%。

要了解更多信息，請查看我們關於 TTFB 的完整文章以及如何為此優化您的網站。

#3 優化您網站的數據庫

分區速度優化

為什麼 WordPress 網站需要乾淨的數據庫

與靜態 HTML 站點不同，WordPress 是一個動態 CMS，它使用 PHP 檢索存儲在 MySQL 數據庫中的數據，以便將該數據顯示在網頁上。 這使管理您的站點變得容易，但缺點是加載頁面需要更長的時間，因為它必須在加載頁面之前定位數據庫中的數據。 通常，出於這個原因，靜態 HTML 網站將比 WordPress 網站更快。

盡可能快地保持 Divi 站點的一種方法是確保您擁有一個乾淨的數據庫。 WordPress 站點文件在您的數據庫中按表組織，每次向站點添加新數據（如主題和插件）時，您都會創建新表和更多數據。 正如您所料，您的數據庫越混亂，查找數據就越困難。 這會導致網站速度變慢。

因此，如果您在多年嘗試其他主題和無數插件後將 Divi 主題添加到您的網站，那麼您可能會存儲一些不再需要的數據。 即使您卸載了插件，也不意味著數據庫中的所有數據都消失了。 插件喜歡在那裡留下一些數據，以防你重新安裝插件。 不酷，我知道。 這些剩餘的數據可能會導致不必要的混亂並減慢您的網站速度。

就像每個人都需要組織更有效地工作一樣，每個 WordPress 網站（無論是否為 Divi）都需要一個乾淨的數據庫來更快地加載頁面。 因此，如果您的網站已經有一段時間了，清理它可以顯著加快速度。

如何優化您的 Divi 站點的數據庫

我建議為此使用插件。 WP Optimize 似乎是一個可靠的選擇。 但是還有其他 WordPress 數據庫插件需要考慮。

或者，如果您知道自己在做什麼，您總是可以在 MySQL 中手動完成。

除了清理您的 WordPress 數據庫之外，您可能還希望通過減少它存儲的數據來使 WordPress 更加輕便。 例如，WordPress 會自動將已刪除的項目保留在垃圾箱中 30 天。 您可能希望將該時間段縮短為 7。

#4 優化您的 DNS

分區速度優化

DNS 如何影響站點速度

當用戶訪問您的某個網頁的 URL 時，需要進行的第一件事是 DNS 查找。 輸入（或單擊）URL 後，訪問者的 ISP 會向名稱服務器發送 DNS 查詢，以查找與您的域相關聯的 IP 地址（每個域/網站都有特定的 IP 地址）。 從本質上講，DNS 查找就像在電話簿中查找您的域名以查找該域的 IP 地址。

但是當用戶訪問您網站上的某個頁面時，該頁面可能需要訪問多個域才能拉出該頁面。 因此，您可以在單個頁面加載（可能更多）上進行 3 或 4 個域查找。

一般來說，像 Godaddy 和 Namecheap 這樣的大多數免費 DNS 提供商通常會比您喜歡的速度慢。

使用 Cloudflare 進行 DNS 優化（如果需要，還可以進行更多）

可以提高 DNS 查找速度的最佳免費選項可能是 Cloudflare。 他們擁有 DNSPerf.com 上記錄的最快 DNS 性能。 這將比 GoDaddy 和 Namecheap 快得多。 而且，如果需要，您甚至可以優化 Cloudflare 以用於 DNS，而無需其他服務（如 CDN 或 WAF）。

例如，您可能希望將 Cloudflare 用於 DNS 和安全性（DDOS 檢測），並將 KeyCDN（或 MaxCDN）用於 CDN。 這似乎是一個很好的組合。

設置 Cloudflare

Cloudflare 真的很容易設置。 您不必擔心事先切換您的主機或任何事情。 您需要做的就是完成他們從輸入域開始的 5 分鐘設置。

分區速度優化

他們將自動檢索您當前的 DNS 記錄。

分區速度優化

完成設置所需要做的主要事情是將當前 DNS 提供商（如 GoDaddy）上的默認名稱服務器更改為 Cloudflare 的名稱服務器。

分區速度優化

然後，您可以從他們的儀表板輕鬆管理您的 DNS。

分區速度優化

就像這樣，您可以提高 DNS 查找速度、更高的安全性以及您網站的 CDN（以及更多）。

說到 CDN，您肯定需要使用其中之一。

#5 使用內容分發網絡 (CDN)

分區速度優化

StackPath CDN PoP

內容交付網絡 (CDN) 將站點速度提升到另一個水平。 顧名思義，CDN 是用於傳送內容的網絡。 該網絡由世界各地的服務器組成，這些服務器存儲您網站內容的緩存靜態文件（圖像、視頻、腳本等）。 然後，當某人發送對該內容的請求（通過訪問您的網站）時，距離該人最近的服務器（或 PoP）將提供該內容。 如果沒有 CDN，您的網站文件可以從一個服務器位置訪問（無論您的主機在哪裡存儲這些文件），因此您離該服務器越遠，將該網站內容傳送到您的瀏覽器的速度就越慢。

想一想，當您想要將披薩送到您家時，您不會選擇 30 英里外的披薩店。 您選擇 5 英里外的那家是因為您希望它盡快送達（如果您是一個和我一樣喜歡披薩的普通人）。 CDN 的工作方式類似。 由於您希望網站盡快出現在您的瀏覽器中，因此 CDN 將使您的網站文件準備好從離您所在位置最近的服務器傳送。 因此，如果您的站點文件存儲在舊金山的服務器上，而倫敦的某個人打開了您的站點，則可能需要 1 或 2 秒才能從數千英里之外的服務器接收該數據。 但是使用 CDN，您可以用一半的時間從倫敦的服務器傳送相同的數據。 這是一個很大的不同！

因此，即使您在家中看不到結果的全部範圍，您也正在加快將您的網站傳送到世界各地的速度。

有很多方法可以為您的站點獲取 CDN。 許多託管公司將提供一個選項，用於在其服務中部署 CDN。 還有像 Cloudflare 和 StackPath（以前稱為 MaxCDN）這樣的網絡平台提供 CDN 功能以及其他性能和安全功能。

以下是一些值得考慮的可靠 CDN 平台：

  • Cloudflare CDN：除了 DNS 優化（如上所述）之外，Cloudflare 還提供了一個快速且安全的全球 CDN，可以緩存靜態內容並將其快速交付給用戶。 這包含在他們的免費計劃中，這對大多數網站來說都很棒。
  • KeyCDN（您甚至可以使用 CDN Enabler WordPress 插件來集成 KeyCDN；此設置也適用於 Cache Enabler）
  • StackPath（以前是 MaxCDN）
  • 亞馬遜雲前線
  • 蘇庫裡

有一些緩存插件，如 WP Total Cache 或 CDN Enabler，其中包括一個選項，用於自動集成多個 CDN 提供商，這非常方便。

以下是一些支持 CDN 的插件：

  • WP 最快的緩存
  • WP火箭
  • 自動優化
  • W3 總緩存
  • WP 超級緩存
  • CDN啟動器

#6 添加緩存

分區速度優化

可以實施四種主要類型的緩存來加速您的站點。

  • 頁面緩存- 此過程存儲頁面的緩存靜態 HTML 版本，以便快速交付。
  • 瀏覽器緩存- 這使您可以更好地控制瀏覽器可以緩存哪些內容以及緩存多長時間。 只有某些插件可以執行此操作，因此最好手動執行此操作以獲得更多控制。 這將有助於在進行速度測試時處理“利用瀏覽器緩存”指標。
  • CDN 緩存– 從離您的用戶最近的 CDN 提供緩存的網站頁面/文件。
  • 對象緩存– 對象緩存緩存 PHP 發起的重複查詢結果，以從數據庫中檢索數據並將其提供給用戶。 這與字節碼緩存不同，字節碼緩存存儲用於顯示您的網站的已編譯 PHP 代碼的緩存版本。

在後台提供 Divi 的 JS 和 CSS 文件時，Divi 確實會執行緩存。 但這主要用於 Divi 主題文件，以獲得更好的 Divi Builder 功能。

仍然需要為整個網站使用緩存。 大多數站點都有多個插件，這些插件可能需要組合、縮小和緩存它們自己的 CSS 文件。 因此，您絕對可以利用第三方解決方案來提供所有頁面的緩存靜態 HTML 版本。

Cloudflare 的 CDN 是向您的 Divi 站點添加緩存的好方法。 它將網站內容（靜態資源）的副本存儲在地理位置更靠近訪問者的位置，以減少頁面加載和延遲。 Cloudflare 的 WordPress APO 似乎是一個更有針對性的解決方案，用於使用他們的 WordPress 插件為 WordPress/Divi 站點緩存網頁和第三方字體。

流行的緩存插件包括：

  • WP火箭
  • 緩存啟動器（閱讀我們的評論）
  • W3 Total Cache（閱讀我們的評論）
  • W3 超級緩存（閱讀我們的評論）
  • Comet Cache（閱讀我們的評論）
  • WP 最快的緩存

提示：每當您使用插件在您的網站上啟用頁面緩存時，您都需要確保並在您對網站進行更改時刪除（或清除）緩存，以確保您和您的訪問者獲得最新版本的地點。

#7 添加網站縮小和聚合

分區速度優化

縮小使您的站點文件更小。 縮小站點文件（CSS、JavaScript、HTML）會刪除所有不必要的字符（如空格和分頁符），從而縮小文件大小。 這減少了瀏覽器加載頁面內容所需的時間。

聚合涉及組合站點文件以減少頁面上的總請求並加快訪問者的加載時間。

如前所述，Divi 默認情況下會動態縮小和組合 Javascript 和 CSS。 因此，從技術上講，您不必擔心使用第三方插件來進一步縮小和組合 Divi 的 Javascript 和 CSS。 但是，Divi 不會縮小 HTML 輸出。 因此，您可以從第三方插件中受益，以縮小（和緩存）頁面的整個 HTML。

此外，幾乎每個 Divi 站點都將依賴於 Divi 主題之外的文件（如添加到子主題的插件或其他文件），這將受益於縮小和組合 CSS 和 JS 文件。

向整個網站的 HTML、JS 和 CSS 添加縮小的最佳方法之一是使用 Cloudflare。 Cloudflare 使用 Auto Minify 來減小您網站上所有源代碼的文件大小。 此外，它是免費版本的標準配置。

一些可以縮小站點文件的可靠插件包括：

  • 自動優化
  • W3 Total Cache（閱讀我們的評論）
  • W3 超級緩存（閱讀我們的評論）
  • WP火箭（付費）

這些插件應該與 Divi 一起使用。 但是沒有辦法衡量一個網站的所有細微差別，說一個網站對每個人都是最好的。 有時，第三方插件會以可能導致錯誤/問題的方式自動縮小 JavaScript 文件，因此請務必徹底測試您的網站。 一般來說，縮小 CSS 文件總是安全的。 但是要小心那些 JavaScript 文件。

如果有衝突，你可能需要禁用 Divi 的內置選項，讓第三方插件來處理。

如果您不想為此依賴第三方，您可以隨時手動完成。 有關如何執行此操作的更多信息，請查看有關如何縮小您網站的 CSS、HTML 和 JavaScript 的完整帖子。

#8 啟用 GZIP 壓縮

分區速度優化

Gzip 壓縮如何幫助加速您的 Divi 站點

在您的 Divi 站點上啟用 Gzip 壓縮可以大大提高速度（在某些情況下高達 70%）。 如果您熟悉在計算機上創建壓縮（或壓縮）文件，那麼您已經對 Gzip 壓縮的工作原理有了基本的了解。 我們創建 zip 文件（或文件夾）來縮小文件（或文件夾）的內容。 為什麼？ 所以我們可以更快地上傳和下載文件！ Gzip 壓縮為您的網站做同樣的事情。 它告訴服務器將它可以壓縮的所有文件壓縮成更小的版本，以便可以更快地將其提供給客戶端。 這確實可以提高頁面加載速度。

這是即使在全新安裝時也可以提高 Divi 速度的領域之一。 由於無論如何 Divi 已經縮小了核心主題文件，Gzip 或 Brotli 壓縮將使這些文件比縮小時小得多。

Gzip 壓縮是使用最廣泛的壓縮算法，但看起來 Brotli 壓縮是下一代算法，旨在使文件大小更小以加快數據傳輸速度。 它被 SiteGround 等託管公司和 Cloudflare 使用。

如何在您的 Divi 站點上啟用 Gzip 壓縮

一些託管服務提供商會自動啟用 gzip 壓縮，因為它對站點性能來說非常簡單。 隨意檢查您的網站是否啟用了 Gzip 壓縮

如前所述，Cloudflare 為免費計劃中的所有域提供 Brotli 壓縮。

許多 WordPress 性能插件（如 W3 Total Cache 和 WP Super Cache）將包含 Gzip 壓縮作為一個選項。 但是，似乎沒有必要為這一優化添加性能插件。

啟用 Gzip 壓縮（在 Apache 服務器上）的一種常用方法是使用 mod_deflate 手動進行。 您所要做的就是通過 FTP 訪問您的網站（根目錄）（確保顯示隱藏文件）。 然後將一段代碼複製並粘貼到 .htaccess 文件的底部。

#9 圖像優化

分區速度優化

圖像優化是導致頁面加載速度緩慢的最大罪魁禍首之一。 這可能是因為它很容易被忽略。 畢竟，一張背景圖片可以對網頁造成多大的損害？ 好吧，你可能會感到驚訝。 一些沒有針對 Web 優化的大圖像可能會對頁面加載速度產生災難性的影響。 讓我們面對現實吧，您的網站可能會有很多圖片。

真的沒有足夠強調圖像優化的基本需求。 每個網站都應該這樣做。 單獨的圖像壓縮可以使您的站點明顯更快，較小的圖像尺寸將節省存儲空間和帶寬（雙贏！）。 但是您還應該考慮其他重要的圖像優化。

簡而言之，在為 Web 優化圖像時，您需要執行以下操作：

使用正確的文件類型

對於網絡上的圖像，您確實應該堅持使用以下圖像文件類型：

  • JPG – 這應該是您在網站上使用的大多數圖像/照片的首選文件類型，因為您可以獲得比 PNG 或 GIF 更小的文件大小的漂亮圖像。 除非您需要透明背景，否則避免將 PNG 格式用於背景圖像或照片等內容。
  • PNG – 將 PNG 用於需要透明背景的圖像。 JPG 不支持透明度。
  • SVG – 這是一種矢量格式，使用 HTML 代碼提供極其清晰的細節。 SVG 非常適合製作徽標、圖標和其他矢量動畫。

調整圖像大小和裁剪圖像

你永遠不希望你的圖像比它需要的更大。 例如，如果您在 Divi 的主題選項中添加徽標，則在大多數情況下，您只需要它的寬度為 100 像素。 因此，請勿上傳寬度為 5000 像素的徽標並強制 Divi 為您調整該圖像的大小。 前端的結果可能看起來相似，但大尺寸正在扼殺您的頁面加載時間。

使用 Divi 將圖像上傳到您的頁面時，了解這些圖像在 Divi 的列結構中需要多大是有幫助的。 這份終極指南可以幫助您指明正確的方向。 （但是，自那篇文章以來已經添加了新的列結構，因此我們將嘗試盡快更新）。

壓縮文件大小

在您注意到質量下降之前，您需要將圖像文件的大小降低到一定程度。 這是通過圖像壓縮完成的。 大多數照片編輯器、插件和網站（如 tinypng.com）使用無損壓縮（在不損失任何圖像質量的情況下縮小圖像文件）和智能有損壓縮（通過減少元數據和圖像質量來減小圖像文件的大小）來壓縮圖像。用戶並沒有真正注意到的方式）。

利用圖像優化工具

如果可以，我建議您在將圖像上傳到 Divi 站點之前針對 Internet 優化圖像。 這可以通過像 Photoshop 這樣的照片編輯器來完成，其中包括“保存為 Web”選項。 此外，您可以使用免費的第三方網站（如 TinyPNG.com 或 Compressor.io）在將圖像上傳到您的網站之前對其進行壓縮。

有一些很棒的插件可以為您進行圖像壓縮。 某些插件（如 Imagify）會壓縮您網站上已經使用的圖像，並在您將圖像上傳到 WordPress 媒體庫時自動壓縮圖像。 請記住，為此使用插件可能會在壓縮這些圖像時對您的網站造成負擔，因此最好盡可能事先進行圖像優化。

以下是您可以使用的一些出色的圖像優化工具和插件：

  • 網站：
    • Compressor.io
    • Tinypng.com
  • 插件：
    • 想像
    • Smush 圖像壓縮和優化
    • 可濕性粉劑火箭

有關更多信息，請查看 6 種質量圖像優化插件的比較。

Divi 的內置 SRCSET 支持

Divi 還內置了具有本機 SRCSET 支持的響應式圖像。 通過為不同的響應式顯示器（如平板電腦和手機）提供合適尺寸的縮放圖像，這進一步改進了 Divi 中使用的圖像的優化。

#10 視頻優化

分區速度優化

視頻優化比圖像優化要難一些，但絕對不那麼重要。 視頻文件可能很大，因此對頁面加載速度非常不利。 如果您在服務器上託管大量視頻（例如在 WordPress 媒體庫中），您將遇到額外的磁盤空間問題。 這就是為什麼通常建議使用第三方服務（如 YouTube 或 Vimeo）為您託管視頻的原因。 或者，您可以考慮在 Amazon S3 等存儲平台上卸載您的視頻媒體內容。 這將允許您從 Divi 的視頻模塊中鏈接到這些視頻，而不必降低服務器的速度。

如果您要自託管視頻，則肯定需要減小視頻大小以加快加載速度。 您可以使用 Handbrake 等免費工具（易於使用）輕鬆縮小視頻文件。

有關如何在 Divi 中使用視頻的更多信息（例如將第三方託管的視頻 URL 添加到視頻模塊），請查看此終極指南。

#11 建立你的 Divi 頁面以提高速度

當涉及到它時，網站的速度取決於它加載頁面內容的速度。 因此，在考慮性能優化的情況下構建 Divi 網站的每個頁面是有意義的。 重要的是確定您構建的每個頁面的主要目標。 之後，您可以找到速度和設計的健康平衡，以構建一個在前端看起來很棒的頁面，同時保持對後端的依賴。 有關如何優化 Divi 頁面內容以提高速度的實際示例，請查看我們關於如何構建最快的 Divi 頁面的文章。

在構建頁面時，請牢記以下幾個關鍵提示：

  • 優化首屏內容以與 Divi 的內置關鍵 CSS 配合使用。
  • 使用 Divi 預設來利用 Divi 的內置智能樣式功能。 這將允許元素基於類共享 CSS 代碼片段，並避免必須為每個元素加載唯一的 CSS 塊。
  • 如果可能，請限制用於構建頁面的模塊類型。 由於 Divi 的動態框架，Divi 不會處理或加載您不使用的模塊（及其獨特的 CSS）。 例如，如果您可以使用兩個文本模塊（而不是一個文本模塊和一個模糊模塊）獲得相同的結果，那麼最好不要在頁面上使用不必要的處理和加載模糊模塊。
  • 為您的頁面使用動畫要聰明。 由於 Divi 的動態特性，如果您不使用它們，Divi 將不會處理或加載 Motion Effects 等功能所需的 JS 或 CSS。 例如，如果您在整個頁面中使用常規動畫設置，您可能希望避免僅對一個元素使用運動效果。 相反，保持動畫風格一致並享受更快的頁面加載。

#12 小心謹慎地使用插件

分區速度優化

使用質量插件

質量是插件的關鍵因素。 事實上，你可以擁有 10 個高質量的插件，它們不會像一個壞插件那樣拖慢你的網站。 一般來說，請確保您選擇經得起時間考驗並獲得好評的插件。 並且始終在速度測試之前和之後測試插件如何影響您的網站性能以確保。

刪除未使用或過時的插件

除了使用高質量的插件外，從站點中刪除任何未使用和/或過時的插件也很重要。 它們可能會損害您的網站性能並帶來嚴重的安全風險。 另外，每個插件（甚至是高質量的插件）都會添加額外的資源，這會增加每個頁面加載的時間。 如果您想要一個快速的 Divi 站點，您將希望使用盡可能少的插件。

注意渲染阻塞錯誤

Divi 沒有任何渲染阻塞資產，這意味著你的渲染阻塞樣式和腳本來自插件。 如果有一些大型渲染阻止腳本會影響您的速度，您可能會考慮遠離這些插件。

#13 進行速度測試

分區速度優化

如果您沒有在您的網站上進行過至少一次速度測試，您可能不會閱讀本文。 確實如此，了解您的頁面為訪問者加載的速度非常重要。 進行速度測試是您可以做的最簡單的事情之一。 有很多網站可以免費為您執行此操作。 他們提供的指標對於確定進一步優化網站以獲得更好性能的方法非常寶貴。

以下是一些不錯的起點：

  • GTMetrics
  • 谷歌頁面洞察
  • Chrome 開發工具
  • Lighthouse（適用於 Chrome 開發工具）

這些測試的結果促使我們中的許多人開始優化我們的 Divi 網站以加快加載時間。 它們提供了有關您的網頁在各個領域的表現的有用細分。 然後，您可以將他們的建議用作檢查清單，以在優化網站時進行處理。

將這些在線速度測試工具用於您的 Divi WordPress 網站的最佳方法是在進行任何優化之前先在頁面上運行測試。 然後，您可以將其用作基礎，以便在進行更改時比較未來的測試。 在您進行每次優化後，您可以查看您的分數是否有所提高。

例如，您可能會注意到使用一個緩存插件會比使用另一個更好。 不要害怕測試多個插件以獲得最佳性能。

這是 GTMetrix 提供的有用的 WordPress 優化指南，很有幫助。

當您對網站實施速度優化時，您應該會看到以下方面的改進：

  • 首字節時間 (TTFB)
  • 首次內容繪製 (FCP)
  • 交互時間 (TTI) – 衡量頁面何時準備好進行用戶交互。
  • 速度指數 (SI) – 衡量您的頁面在視覺上完整的速度有多快
  • 總阻止時間 (TBT) – 類似於 Google 的網絡重要首次輸入延遲 (FID)，它是用戶首次與您的網站交互和他們的瀏覽器響應該操作之間的時間量
  • 最大的內容繪製 – 測量最大的內容元素（如圖像）對用戶可見所需的時間。
  • 累積佈局偏移 – 測量用戶加載頁面時佈局的意外偏移（或移動）。

有關更多信息，請查看我們關於如何提高谷歌頁面速度得分的帖子。

目標是速度，而不是完美

測試您的網站並將其優化到完美很容易陷入困境。 但沒有網站是完美的。 您甚至可能會發現提高某些速度測試性能等級實際上可能會減慢您的頁面加載時間。 那是因為即使是那些速度測試也不是完美的。 像本文一樣，它們只是幫助提高網站性能和速度的指南。

#14 考慮我們的 Divi 高速頁面藍圖

在我們構建的這個測試網站中，很容易構建一個 Divi 網站，在 Google PageSpeed Desktop 上得分為100 ，在 Google PageSpeed Mobile 上得分為99，在 GTmetrix 上得分為100% 。 這個網站藍圖讓開發者可以在真實網站上親身體驗Divi內置的速度優化。 它還可以作為如何優化 Divi 頁面內容以提高速度的一個很好的例子。

本次測試站點優化如下：

  • 託管在 SiteGround
  • 使用 CloudFlare 進行緩存、CDN、Brotli 壓縮
  • 沒有使用額外的插件。
  • 使用 Divi 的內置性能功能
  • 優化頁面內容
    • 使用智能樣式（Divi Presets）來減少為每個頁面生成的動態 CSS。
    • 在首屏優化以確保關鍵 CSS精簡。
    • 使用網絡安全字體 (Arial) 以避免必須從第三方服務器下載字體。
    • 使用壓縮圖像
    • 沒有使用動畫或動作效果
    • 限制使用圖標來加載較小的圖標字體子集，其中包括所需的社交圖標。

結果：

  • CSS 大小減少了 94%。
  • 所有阻止渲染的資產都被完全消除，Divi 的 JavaScript 大小減少了一半。
  • 沒有不需要的資源請求。
  • 折疊內容上方立即顯示。
  • 在 Google PageSpeed Desktop 上的得分為100% ，在 Google PageSpeed Mobile 上的得分為99%
  • 在 GTmetrix 上得分100% 。

我們可以為測試站點學到什麼？

最終，Divi 賦予您選擇使用方式和網站速度的權力。 測試站點表明，您可以立即獲得近乎完美的頁面速度分數。 但是，僅僅因為我們沒有使用使 Divi 如此出色的所有強大的設計工具，並不意味著您必須害怕使用它們。 如果您不在頁面上使用模塊或功能，Divi 將不會不必要地處理和/或加載元素或其 CSS。 但是，如果您決定包含一個模塊或功能，Divi 將小心處理和/或僅加載所需的元素和 CSS，僅此而已。 這為您提供了一個輕量級的框架來構建，當您決定釋放 Divi 的力量來構建您的網站時，無需擔心網絡膨脹。

其他提示

我們幾乎涵蓋了所有有助於加快 Divi/WordPress 網站速度的主要因素。 但是還有很多事情需要考慮，可以進一步提高您的速度。

  • 擁有正確的 Divi 子主題設置
  • 更改您的 WordPress 登錄 URL 以防止這些機器人使您的服務器過載。 這將是使用 Divi 創建自定義登錄頁面的好機會。
  • 避免對外部服務的不必要調用。 某些插件和嵌入要求您使用託管在其服務器上的文件。 這些額外的調用會減慢頁面加載速度。
  • 為圖像和視頻加入延遲加載，以提高頁面加載速度。

使用 Divi 和其他第三方性能插件

Divi 的內置性能優化將加速每個 Divi 站點，因為它們消除了任何性能插件都無法消除的膨脹。 也就是說，除了 Divi 的內置優化之外，您還可以使用其他第三方性能插件來提高網站速度。 Divi 性能改進僅適用於 Divi 而不是第三方插件，因此您的性能插件可能會在 Divi 之外的其他領域使您受益。 例如，您仍然可以從緩存網站和使用 CDN 中受益。

處理衝突的性能插件

因為Divi已經優化過了，使用第三方性能插件可能會導致衝突。 因此，保持 Divi 主題更新並事先徹底測試所有第三方插件非常重要。 我們盡力使用其他流行的優化插件來測試 Divi 的內置優化。 但是沒有辦法衡量一個網站的所有細微差別，說一個網站對每個人都是最好的，或者不會發生衝突。

例如，第三方插件可能會以可能導致錯誤/問題的方式自動縮小或移動 JavaScript 文件，因此請務必徹底測試您的網站。

如果有衝突，你可能需要禁用 Divi 的內置選項，讓第三方插件來處理。 如果您遇到任何問題，請隨時聯繫我們的支持團隊尋求幫助。 我們很高興幫助您解決問題。

最後的想法

Divi 比以往任何時候都快。 通過內置的性能升級，您的標準 Divi 安裝在前端具有更快的頁面加載速度，在後端具有更快的 WordPress 管理員，以及更快的 Divi Builder 來編輯和設計您的網站。 這是一個很好的開始，但要確保您的 Divi 站點盡可能快地運行，還有很多工作要做。 本文中包含的速度和性能優化肯定會提高您的網站速度。 在大多數情況下，這些優化將適用於任何 WordPress 網站/主題，而不僅僅是 Divi。 令人驚訝的是，您可以免費做多少簡單的事情！

我敢肯定還有很多建議和資源沒有提到，所以請隨時在評論中與我們分享。

我期待著您的回音。

乾杯!

精選圖片來自 Sammby/shutterstock.com