選擇最好的 WordPress 延遲加載插件:7 大插件比較

已發表: 2023-02-08

將視覺元素添加到您的站點是使您的頁面更具吸引力的簡單方法。 您可以包括營銷橫幅、產品圖片、圖庫或視頻教程。 不幸的是,包含一堆文件會使您的站點不堪重負並導致性能下降。

延遲加載是減輕服務器壓力同時提高網站加載速度的好方法。 它會延遲為訪問者呈現圖像,直到他們向下滾動到屏幕上的位置。 更好的是,一些延遲加載插件是免費的、易於使用的,並且具有用於網站優化的額外功能。

在這篇文章中,我們將探索一些最好的 WordPress 延遲加載插件。 然後,我們將向您展示如何根據您的需要選擇理想的工具。

WordPress 的七個最佳延遲加載插件

讓我們來看看適用於您的 WordPress 網站的七個最佳延遲加載插件!

1.噴氣背包助推器

Jetpack Boost 主頁設計

Jetpack Boost 是一款一體化優化插件,可提高網站的整體加載速度。 您不僅將擁有一個高效的延遲加載工具,而且您還可以享受許多其他功能來提高您的網絡性能。

此外,Jetpack 是此列表中對初學者最友好的選項之一。 有了乾淨、直觀的儀表板,導航起來再簡單不過了。

真正讓 Jetpack Boost 與眾不同的是,它專為幫助您改進 First Contentful Paint (FCP) 和 Largest Contentful Paint (LCP) 等指標而構建。 因此,使用 Jetpack Boost 可以幫助您改善 Core Web Vitals、用戶體驗和搜索引擎排名。

Jetpack Boost 的主要特點

  • 帶有跨移動和桌面設備即時性能評分的簡單報告
  • 一個直觀、乾淨的儀表板,用於查看您的表現並調整您的設置
  • 生成關鍵 CSS 等的其他優化工具

Jetpack Boost 的優點

  • 它提供 SEO 見解,以提高您的搜索排名和 Core Web Vitals。
  • 它優化了 CSS 加載並推遲了非必要的 JavaScript。
  • 您可以使用高級計劃自動化關鍵 CSS。
  • 它由 Automattic(WordPress.com 背後的人)製作,因此您可以高枕無憂,因為它可靠且與大多數流行的主題和插件兼容。

Jetpack Boost 的缺點

  • 雖然您可以選擇 Jetpack 自己的 CDN,但您將無法使用 Cloudflare 等第三方 CDN。

使用方便

Jetpack Boost 非常容易設置和維護。 您可以像安裝任何其他 WordPress 插件一樣安裝 Jetpack Boost。 然後,只需轉到您的儀表板並分別打開每個設置。

價格

您可以通過免費的 Jetpack Boost 插件訪問它的許多功能。 要使用自動 Critical CSS 功能,您需要升級到高級計劃,起價為每月 20 美元。

2. 糊塗

Smush 主頁設計,並說明其在工作中的功能

Smush 是一種流行的圖像優化插件,活躍安裝量超過一百萬。 除了 WordPress 中的延遲加載,Smush 還提供圖像優化、壓縮和調整大小的工具。

與 Jetpack 一樣,Smush 非常易於使用。 事實上,一旦安裝完成,您只需幾秒鐘即可啟動並運行它。 更好的是,Smush 與許多主題、插件和瀏覽器兼容,因此您可以像往常一樣開展業務。

Smush 的主要特點

  • 圖像優化、壓縮和調整大小工具
  • 將圖像上傳到 WordPress 時自動壓縮文件
  • 能夠直接在圖像塊中查看所有 Smush 圖像數據

Smush 的優點

  • 您可以選擇單獨或批量優化圖像(一次最多 50 張圖像)。
  • 您可以限制小部件、內容區域和縮略圖等媒體的輸出位置。
  • Smush Pro 附帶 Smush CDN 和 WebP 轉換,並存儲原始圖像的備份。

Smush 的缺點

  • Smush 會跳過超過 5MB 的圖像,這對於某些網站(例如那些有作品集的網站)來說可能會出現問題。
  • 對於某些用戶來說,免費版本的壓縮選項可能過於簡單。

使用方便

開始使用 Smush 非常簡單。 您只需單擊一個按鈕即可激活這些功能。 這會立即延遲折疊下方圖像的加載。 只需前往插件的設置,訪問延遲加載 部分,然後點擊激活

價格

您可以使用該插件的免費版本或選擇 Smush Pro,起價為每月 7.50 美元。 此外,您可以先通過 7 天免費試用來測試該工具。

3.懶加載程序

藍色背景上帶有三個“Z”的 Lazy Loader 主圖

Lazy Loader 是一個簡單、直接的插件,完全按照它說的做。 使用此工具,您不會有任何煩惱或多餘的裝飾。 相反,您可以簡單地啟用/禁用某些元素的延遲加載並添加一個微調動畫來加載內容。

此外,Lazy Loader 可以應用於多種類型的內容,包括視頻、iframe、音頻內容、圖像,甚至背景、腳本和頁面樣式。 因此,雖然沒有花哨的功能可供使用,但 Lazy Loader 無疑是一個強大的工具。

延遲加載器的主要特性

  • 通過手動修改延遲加載背景圖像和腳本的能力
  • 為特定帖子和頁面啟用/禁用延遲加載的複選框
  • 能夠在瀏覽器中使用本機延遲加載功能來修改 iframe 和圖像

懶加載程序的優點

  • 它推遲加載所有類型的內容,從頁面樣式到 iframe 和腳本。
  • 您可以禁用具有特定 CSS 類的圖像的延遲加載,並添加過濾器以供插件處理。
  • 它使用“noscript”元素作為禁用 JavaScript 的後備。

延遲加載程序的缺點

  • 您需要修改標記以將其用於未插入內聯樣式和腳本的背景圖像。

使用方便

如果您計劃將 Lazy Loader 用於未插入內聯樣式和腳本的背景圖像,則需要更多的技術專業知識。 但是對於任何其他元素,Lazy Loader 都非常容易設置。 在設置 Media ,配置您想要的確切選項,插件立即開始工作。

價格

自由的。

4. 優化分子

帶有火箭插圖的 Optimole 英雄形象

Optimole 是一個基於雲的全方位服務系統,提供延遲加載和調整大小。 它還使您能夠優化和壓縮 WordPress 中的圖像。 此外,您甚至可以利用 Optimole CDN 來加快內容交付速度。

Optimole 的一個獨特功能是它用基於雲的 URL 替換所有圖像 URL 並動態壓縮它們。 此外,您還可以享受額外的功能,例如基於格式的優化、智能裁剪和水印。

免費版每月可處理來自 200 多個地點的 5000 名訪客。 但如果這還不夠,您可以隨時升級到專業版以適應每月 5 萬名訪客。

Optimole 的主要特點

  • 全球 CDN,無需額外費用
  • 完全支持頁面構建器
  • 雲圖像庫支持和 AVIF 支持更小的圖像尺寸

Optimole 的優點

  • 它不會影響佈局,因此您可以改善用戶體驗 (UX)。
  • Optimole 支持所有圖像類型,包括 WebP 和視網膜。
  • 它根據每個訪問者的設備實時優化。

Optimole 的缺點

  • 延遲加載不如其他工具有效(有時圖像會暫時被模糊圖像替換)。
  • Pro 選項比此列表中的其他選項貴。

使用方便

Optimole 是一個全自動插件。 因此,您可以“一勞永逸”設置,並且該工具在您網站的後台運行,幾乎不需要持續維護。 另外,您可以同樣輕鬆地卸載 Optimole,您的網站將完好無損。

價格

有一個非常實用的免費版本的 Optimole 工具。 或者,您可以升級以適應更多流量、在無限站點上使用該工具以及訪問電子郵件支持。 付費計劃起價為每月 19.08 美元。

5. WP Rocket 的 LazyLoad

具有橙色背景和圖像插圖的 LazyLoad 主圖

LazyLoad 是一個功能強大但輕量級的插件,腳本重量不到 10KB。 我們說功能強大是因為 LazyLoad 會處理您網站上的所有資產,包括頭像、縮略圖、iframe、背景圖片、YouTube 視頻等。

它將 JavaScript 注入您的標頭並延遲圖像,而無需使用任何 JavaScript 庫(如 jQuery)。 使用更少的 HTTP 請求,LazyLoad 提供了另一種提高速度和提高 LCP 分數的方法。

LazyLoad 的主要特性

  • 在帖子內容或小部件文本中延遲加載圖像的能力
  • 在某些頁面上停用延遲加載的過濾器
  • 自動(或手動)延遲加載背景圖片

LazyLoad 的優點

  • 它針對特定目標,例如改進 PageSpeed Insights 的指標或提高首次輸入延遲分數。
  • 它為圖像使用“透明”佔位符(而不是模糊圖像)。
  • 它用預覽縮略圖取代了 YouTube iframe。

LazyLoad 的缺點

  • 評論聲稱 LazyLoad 會破壞您網站上的圖像放置、佈局和其他設計元素。
  • 它不是最適合移動設備的插件。
  • 它接收更新的頻率低於其他延遲加載插件。

使用方便

如果您堅持使用基本選項,LazyLoad 很容易安裝和配置。 但是,如果你想獲得更好的控制,比如從延遲加載中排除某些頁面,你需要手動編輯你的functions.php文件。

價格

LazyLoad 是 WP Rocket 的免費插件。 此外,如果您已經擁有 WP Rocket Cache 插件,則包含 LazyLoad。

6. 延遲加載視頻

延遲加載帶有徽標和視頻圖像的視頻圖像

Lazy Load for Videos 是最好的延遲加載插件之一,適用於包含 YouTube 或 Vimeo 嵌入式內容的投資組合或網站等視頻密集型網站。 它的工作原理是用可點擊的圖像預覽替換任何嵌入的視頻,這會延遲 JavaScript。

更好的是,YouTube 視頻也以增強隱私的模式加載。 此外,您還可以享受大量自定義選項,例如調整“播放”按鈕或在視頻結束後隱藏相關視頻建議。

視頻延遲加載的主要功能

  • 沒有供應商鎖定,也沒有自定義短代碼,所以如果您決定停止使用該工具,您的視頻仍然可以播放
  • GDPR 合規性,使您能夠在預覽圖像上方顯示隱私免責聲明
  • Vimeo 播放器和進度條的自定義顏色

視頻延遲加載的優點

  • 如果您願意,可以將嵌入設置為自動播放。
  • 您可以隱藏註釋和 YouTube 控件以創建乾淨整潔的空間。
  • 它包括附加功能,例如您可以應用於所有視頻的前置/後置廣告。

視頻延遲加載的缺點

  • Jetpack“Shortcode Embeds”擴展、BuddyPress 和 YouTube Embed WordPress 插件存在一些兼容性問題。

使用方便

與此列表中的其他插件一樣,Lazy Load for Videos 的安裝和管理非常簡單。 此外,隨時可以輕鬆打開和關閉插件。

價格

自由的。

7. a3 延遲加載

a3 Lazy Load 插件主圖,帶有時鐘和汽車圖標

最後,a3 Lazy Load 提供獨家的延遲加載服務。 它的設置非常簡單,即使對於初學者也是如此,而且它適合移動設備。

雖然該插件使您的頁面加載速度更快,但由於 a3 Lazy Load 廣泛的自定義選項,您還可以切換視頻和 iframe 的設置。 更好的是,您可以包含/排除特定元素,甚至可以添加一些平滑的過渡效果,如淡入淡出和微調器。

a3 Lazy Load 的主要特性

  • 將插件用於內容豐富的網站的能力(已經過 1000 張圖像的測試)
  • 延遲加載縮略圖、頭像、小部件、自定義帖子類型等
  • 與 WordPress 嵌入完全兼容

a3 延遲加載的優點

  • 您可以為加載圖像添加淡入淡出和微調效果。
  • 您可以使用開/關功能來包含和排除元素。
  • 它與 WooCommerce 等其他有用的插件完全兼容,因此您可以輕鬆地將它與您的在線商店集成。

a3 延遲加載的缺點

  • 它僅適用於使用核心 WordPress 功能添加的媒體,不適用於任何自定義編寫的功能。

使用方便

a3 Lazy Load 非常容易為所有用戶級別設置和自定義。

價格

有免費版本可用,或者您可以升級到高級版本。 付費計劃起價為每月 24.99 美元,可在五個網站上使用。 此外,您可以免費試用 a3 Lazy Load 14 天,如果您決定反對,可以輕鬆取消訂閱。

最好的懶加載插件:對比表

便於使用額外的圖像優化功能與流行的插件完全兼容提供免費版本
噴氣背包助推器是的是的是的是的
粉碎是的是的是的是的
懶加載程序是的是的是的
優化分子是的是的是的是的
延遲加載是的是的是的
延遲加載視頻是的是的
a3 延遲加載是的是的是的

結論:什麼是最好的 WordPress 延遲加載插件?

最好的延遲加載插件取決於您的網站需求。 例如,如果您的站點上有許多高質量圖像,您可能更喜歡提供圖像優化功能(如壓縮和調整大小)的插件。

此外,如果您的大部分媒體文件都是視頻或 WebP 格式,那麼找到具有此功能的插件很重要,因為某些工具只能處理 JPEG/JPG 和 PNG。

使用 Jetpack Boost,您可以勾選多個複選框。 雖然您可以享受 Critical CSS 和延遲非必要 JavaScript 等額外功能,但 Jetpack Boost 不會用一堆您不需要的工具來拖累您的網站。 相反,這些功能用於增強快速內容交付和延遲加載。

更好的是,您再也找不到更簡單的工具來設置和配置了。 一旦它安裝在您的站點上,只需前往儀表板,您將在其中使用切換來啟用/禁用每個設置。 然後,Jetpack Boost 在您網站的後台運行,幾乎不需要持續維護。

如何選擇懶加載插件

現在您已經了解了 WordPress 最好的延遲加載插件,這裡有一些方法可以縮小您網站的正確選擇範圍。

1. 確保它符合你的技能水平

一些用戶可能想要一個具有大量控製配置和自定義選項的更實用的工具。 但是對於初學者來說,所有這些設置都可能令人生畏。 這就是為什麼找到與您的技能水平相匹配的延遲加載插件很重要的原因。

如果您沒有很多技術經驗,您可能會更喜歡易於安裝和自動運行的工具。 有很多帶有“一勞永逸”選項的選項,因此無需修改複雜的功能和持續維護。

2. 檢查附加功能

如果您正在尋找延遲加載插件,您可能只需要一種方法來延遲加載非首屏圖像。 其中一些插件,如 LazyLoad 和 Lazy Loader,按照包裝盒上的說明進行操作。

但是,對於更複雜、內容較多的網站,您可以從提供附加功能的工具中受益,以增強您的內容交付。 例如,如果您有一個投資組合,您可能需要優化和壓縮工具。 同時,攝影網站可能會發現有用的水印功能。

3.找出支持的圖像格式和尺寸

通常,大多數插件都支持 JPEG 和 PNG 等流行的圖像格式。 但並非所有工具都為 GIF 或視頻等動畫圖像提供延遲加載。 此外,一些較新的圖像格式(如 WebP 和 Retina)可能會被忽略。

這就是為什麼確保您選擇的延遲加載插件能夠支持您打算在您的網站上使用的所有文件類型很重要。 此外,請記住,某些插件的免費版本通常沒有那麼強大。 因此,雖然免費的延遲加載插件在短期內似乎是最佳選擇,但它可能不適用於大型媒體文件。

4.確保它與您網站上的其他插件兼容

您最不想做的就是開始使用延遲加載插件,卻發現它與您網站運行所必需的其他插件不兼容。 例如,如果您擁有一家在線商店,您可能會依賴 WooCommerce 這樣的平台。 同時,論壇站點利用 bbPress 等專門的插件來獲得功能。

如果該插件與您安裝的其他軟件不兼容,您就有可能破壞您的網站。 因此,密切關注您首選工具的集成和兼容性至關重要。 一個很好的例子是 Lazy Load for Videos 插件,它不適用於 Jetpack 的特定擴展。

一般來說,Jetpack Boost,因為它是由 WordPress.com 背後的人製作的,所以可以與大多數主題和插件一起可靠地工作。

有關 WordPress 延遲加載插件的常見問題

現在您已經知道如何為您的網站選擇最好的延遲加載插件,下面是關於延遲加載的一些最常見的問題。

什麼是好的延遲加載插件?

一個好的延遲加載插件可以延遲加載您的圖片。 這樣做可以加快用戶立即可見的內容的交付速度。 雖然這是默認功能,但您還可以找到提供圖像優化、壓縮和調整大小工具等附加功能的延遲加載插件。

最重要的是,最好的延遲加載插件是自動化的、易於使用的,並且與 WooCommerce 等流行插件兼容。 此外,找到一種不會損壞您的用戶體驗或調整圖像質量過於明顯的工具至關重要,因為這可能會讓您的訪問者感到沮喪。

WordPress 上的延遲加載插件要花多少錢?

有很多免費的延遲加載 WordPress 插件。 但許多提供商還提供付費選項,其中可能包括額外功能或處理更大的文件大小。 請務必注意,某些免費工具的功能可能非常有限。

這就是為什麼 Jetpack Boost 是一個不錯的選擇。 有一個完全免費的版本,配置起來超級簡單。 在 WordPress 上進行設置後,您可以延遲加載圖像、推遲非必要的 JavaScript 並優化關鍵 CSS。 這些設置使您能夠在不花一分錢的情況下加快內容交付。

在 WordPress 上設置延遲加載插件容易嗎?

延遲加載插件的易用性各不相同。 您會發現更複雜的工具,需要更實際的方法和配置。 但是您也可以選擇易於安裝和使用的簡單延遲加載插件。

Jetpack Boost 的最佳功能之一是您只需點擊幾下即可進行設置。 然後,使用切換來啟用或禁用個別功能。 另外,您可以隨時停用該插件而不會損壞您的網站。

使用延遲加載插件我可以獲得哪些其他功能?

您可以找到提供簡化服務的延遲加載插件。 但是,如果您想訪問其他功能,則值得選擇一個提供其他功能以提高站點性能的工具。

Jetpack Boost 是一個很棒的延遲加載插件,因為延遲加載服務簡單但功能強大。 更好的是,您可以推遲非必要的 JavaScript,優化關鍵 CSS,並且通過付費計劃,您甚至可以自動化關鍵 CSS。 您還可以將 Jetpack Boost 與 Jetpack 的 CDN 配對,以進一步優化和穩定您的 Web 性能。

使用延遲加載插件提升您網站的性能

雖然添加圖像是美化網站的好方法,但過多的照片會導致加載時間變慢,從而擾亂您的用戶體驗。 幸運的是,使用正確的延遲加載插件,您能夠更快地交付內容並保持您的網站平穩運行。

回顧一下,這裡有一些頂級的 WordPress 延遲加載插件:

  1. Jetpack Boost :一個易於使用的插件,具有用於速度優化的附加功能。
  2. Smush :一個流行的圖像優化插件,帶有壓縮和調整大小工具。
  3. Lazy Loader :一種簡單、無憂的延遲加載圖像的方法。
  4. Optimole :一個包含 CDN 的基於雲的全方位服務系統。
  5. WP Rocket 的延遲加載:一個輕量級但功能強大的插件,可幫助您實現特定目標。
  6. Lazy Load for Videos :視頻延遲加載的最佳選擇,具有大量自定義工具。
  7. A3 Lazy Load :一個專門用於延遲加載的用戶友好插件。

總的來說,使用 Jetpack Boost 是在您的站點上實現延遲加載的最佳插件。 此外,借助一系列額外功能,您可以優化整個網絡性能。 立即開始使用 Jetpack Boost!