如何消除 WordPress 中的渲染阻塞資源（非常簡單）

擁有一個快速的博客或網站非常重要。 如果您想在搜索引擎中排名靠前，這一點很重要。 如果你的網站速度很慢，那肯定會傷害你的 SEO。

此外，緩慢的網站會使跳出率變高，這在技術上會在很多方面損害您的品牌。 緩慢的網站會影響收入和轉化率。

大多數用戶都沒有耐心，如果您的網站加載時間過長，他們會放棄它並轉向更快的替代方案。 那是一個潛在的客戶或收入的助推器消失了。

如果您一直在嘗試加速您的網站並且您使用 Google PageSpeed Insight 等測試工具，您可能會收到一個警告，即消除渲染阻止資源。

在本文中，您將學習如何輕鬆消除渲染阻塞資源。

什麼是渲染阻塞資源？

阻止渲染的資源是 CSS 和 JavaScript，它們會減慢網站的加載時間，因為它必須在頁面內容可以渲染之前由 Web 瀏覽器下載。

當訪問者試圖訪問一個網站時，瀏覽器會立即開始從上到下閱讀該網站。 如果有任何 CSS 或 JavaScript，瀏覽器將停止讀取，直到下載並處理文件。 在瀏覽器可以呈現首屏內容之前，它必須下載 CSS 或 JavaScript 文件。

您安裝的插件或主題可以添加其中一些 CSS 和 JS。 有些不需要先加載，它們可以稍後加載。 但是因為它們位於頂部，它們會減慢您的網站速度。

所以穀歌“消除渲染阻塞資源”的意思是你從網站頂部刪除不必要的資源，因為它會減慢網站內容的加載速度。

如何找到渲染阻塞資源

在解決渲染阻塞問題之前，您需要知道它的來源。 您可以通過在 Google PageSpeed Insight 或 Web.Measure 上運行測試來找出哪些資源被阻止呈現。

您可以按照以下步驟查找渲染阻塞資源：

1. 訪問 Google PageSpeed Insight

2.輸入你的網址，點擊分析

3. 向下滾動並註意消除渲染阻塞資源警告。

在移動和桌麵點擊中檢查它。

對於 BloggingTools，我們沒有桌面端的渲染阻塞問題，但我們有移動端的問題。 因此，為此，我們將使用 Mobile，如下所示。

如您在上面看到的，對於移動設備，我們有 2 個渲染阻塞問題。 得分為 93。得分更高，但為了這篇文章，我不得不停用 Autoptimize 插件。

BloggingTools.org 在沒有優化的情況下獲得了這個分數，因為我們使用了一個非常快速且輕量級的主題，稱為 GeneratePress。 我們還託管在一個名為 Cloudways 的非常快速的網絡主機上。

注意：您不應該沉迷於在 PageSpeed 洞察力得分上獲得 100 分。 它只是一個指南。 通常，對於大多數人來說，65 到 80 的平均分數就可以了。 不要刪除對您的業務至關重要的文件。

WordPress 的好處是您無需手動完成所有操作。 有一些編碼良好的插件可以提供幫助。

如何修復消除 WordPress 中的渲染阻塞資源問題

請按照以下步驟修復消除渲染阻塞資源問題：

1.安裝並激活自動優化

有很多 WordPress 插件可以做到這一點，例如 W3 總緩存、WP Rocket 等。 但是根據我在許多網站上的經驗，Autooptimize 總是比其中任何一個都處理得更好。 奇妙的是，Autooptimize 與幾乎所有 WordPress 緩存插件兼容，而且它是免費的。

前往 WordPress 插件目錄以安裝和激活 Autooptimize

2.訪問自動優化設置

如果您需要在哪裡找到自動優化設置，請在您的 WordPress 儀表板上單擊設置，然後單擊自動優化。

3.優化JavaScript

在 JavaScript 選項下，選擇優化腳本代碼並選擇聚合 JS 文件。 您可以在下面找到我用於 BloggingTools 的設置。

4.優化CSS

在優化 CSS 選項下選擇優化 CSS 代碼。 還要選擇聚合 CSS 文件和“也聚合內聯 CSS”。 請參閱下面我用於 BloggingTools 的選項。

5.優化HTML

如果你想要更好的性能，你還可以使用 Autooptimize 來優化 HTML。 在 HTML 選項下，選擇優化 HTML 代碼。 您可以在下面看到我用於 BloggingTools 的設置。

6.檢查雜項選項

您可以檢查其他選項並調整一些適合您的設置。 您可以在下面找到 BloggingTools 的設置。

7. 保存並清空緩存。

接下來，只需單擊保存並清空緩存。 就這些！

畢竟，您可以在 Google PageSpeed Insight 上再次檢查您的網站。 對於 BloggingTools，在這樣做之後，我們的分數立即躍升至 95，並且所有消除渲染阻塞資源的警告都完全消失了。 見下文。

請注意，根據您擁有多少渲染阻止資源以及它們對您的站點的重要性，其中一些可能會保留。 不要試圖刪除它們。

如果你想進一步消除，你可以使用 Async JavaScript，一個與 Autoptimize 相同作者的插件。 他們一起工作。 我不建議這樣做，因為它可能會破壞您的網站。 單獨進行自動優化是可以的！

結論

速度很重要，消除渲染阻塞資源可以幫助您的網站加載更快，並在速度測試工具上為您的網站提供更好的分數。 但你永遠不應該沉迷於這些分數，因為它們只是用來指導的。

如果您的網站在此之後仍然很慢。 三個最有可能的問題可能是您的主題或您的 Web 主機不好，或者您安裝了不好的插件。 我推薦Coudways作為最好的網絡主機和GeneratePress作為最好的主題。 如果您是初學者， Bluehost可以處理，但如果您負擔得起，Cloudways 是最好的。 您可以免費開始。 我為 TargetTrend 使用 GeneratePress 和 Coudways

另請閱讀：

如何讓 WordPress 變得非常快

如何為您的博客增加流量

如何通過博客賺錢

如何開始一個博客