在處理安裝了數十個或更多插件的 WordPress 開發項目時，經常會遇到性能問題。但是，找出導致性能問題的原因並不總是那麼容易。
您已經消除了通常的疑點：託管是足夠的，沒有明顯的 JavaScript 或 PHP 錯誤，沒有其他問題。您懷疑您安裝的一個或多個插件是罪魁禍首，但是您如何確定是哪個插件導致了問題？
識別麻煩插件的常用方法是停用插件，直到找到性能瓶頸。
但是，有一種更快更有效的方法。這是免費的查詢監視器插件解決的場景。它可以幫助您調試性能問題，更有效地開發網站，並更好地處理您的 WordPress 網站。
在本指南中，您將了解有關 Query Monitor 所需了解的所有信息——它是什麼、它的作用以及如何使用它。
什麼是查詢監視器？
查詢監視器插件。
Query Monitor 是一個 100% 免費的插件，可幫助您調試 WordPress 網站的性能和開發。
您可以將其視為 Chrome 開發人員工具，但專門針對 WordPress。您可以深入研究資料庫查詢、腳本、時間安排等。您還可以查看大量有用信息，例如一般環境信息和特定頁面的詳細信息。
然後，Query Monitor 以一種易於訪問的方式呈現所有這些信息，您可以從站點上的任何位置訪問這些信息。
查詢監視器由 Human Made 的首席 Web 工程師 John Blackbourn 維護。他還有其他幾個有用的插件，包括 WP Crontrol（非常適合 wp-cron 調試）和 User Switching（非常適合調試不同用戶角色的體驗）。
John 反應迅速，並不斷致力於維護和改進 Query Monitor。Automattic 和其他贊助商支持他的工作。
如果您在完成這篇文章時發現該插件的價值，您可以通過在 GitHub 上贊助該項目來支持 Query Monitor，每月只需 1 美元。查詢監視器有什麼作用？
Query Monitor 可以幫助您調試的不僅僅是對 WordPress 資料庫的查詢，儘管名稱如此。
不要誤會我們的意思——調試資料庫查詢是 Query Monitor 做得很好的事情，也是該插件最顯著的好處之一。
然而，它也深入到許多其他領域，包括以性能為中心的調試和一般的開發調試。
以下是 Query Monitor 可以幫助您分析和調試的許多詳細信息的示例：
- 資料庫查詢，包括顯示來自特定插件的查詢
- PHP 錯誤
- 內存使用情況
- HTTP API 調用
- 排隊的腳本和樣式，包括依賴項
- 鉤子和動作
- 主題模板文件
- 語言和翻譯
- 重寫規則
- 塊編輯器塊
- 一般環境信息
- WordPress 管理屏幕
Query Monitor 的一個顯著限制是它主要用於「即時」調試。當它向您顯示資料庫查詢、時間等信息時，它只是針對當前頁面載入進行的。
它通常不跟蹤或顯示歷史信息/趨勢，儘管 John 說此功能計劃用於未來版本。
如何使用查詢監視器調試 WordPress 並提高性能
既然您知道什麼是 Query Monitor 以及它的作用，那麼讓我們來了解如何使用 Query Monitor 來調試站點的性能以及用於一般開發調試的其他一些工具。
我們將向您簡要介紹查詢監視器界面及其工作原理。然後，我們將深入研究界面中的每個區域。
有 12 多個不同的高級界面區域，因此有很多內容可以覆蓋。但是，您看到的界面菜單的確切數量將取決於您正在分析的頁面。
讓我們深入挖掘。
查詢監視器介面介紹
查詢監視器沒有自己獨立的界面區域。相反，它會在前端和後端的 WordPress 管理欄中顯示新信息。
Query Monitor 最初會顯示一個包含四個信息的快速摘要：
- 頁面生成時間——屏幕截圖中的 0.05 秒。
- 內存使用峰值——屏幕截圖中的 7.7 MB。
- SQL 查詢所用的總時間（以秒為單位） – 屏幕截圖中的 0.00 秒。
- SQL 查詢總數 – 屏幕截圖中的 54 個。
在 WordPress 管理欄上查詢監視器的摘要。
如果單擊此摘要，您將打開整個查詢監視器界面，該界面顯示為您當前正在查看的前端或後端頁面上的窗口覆蓋。
查詢監視器界面。
Query Monitor 提供的所有功能和信息都包含在此覆蓋窗口中。
如果您希望更改覆蓋窗口的布局，可以單擊右上角的按鈕將其切換到側邊欄界面。您還可以使用拖放來更改窗口的大小。
如何切換到側邊欄界面。
查詢監視器界面及其信息僅對管理員（或 WordPress 多站點上的超級管理員）可見。
還有一個選項可以設置身份驗證 cookie 以仍然查看查詢監視器輸出，即使您沒有登錄（或者您以具有較低用戶角色的用戶身份登錄）。我們稍後將在指南中分享如何執行此操作。
讓我們瀏覽界面中的每個選項卡，並解釋如何使用它來調試您的 WordPress 網站。
概述
概述選項卡顯示來自管理欄摘要的更多詳細信息和一些一般環境信息。
例如，「概覽」選項卡不僅可以查看內存使用峰值，還可以進一步查看峰值使用情況與您的伺服器和 WordPress 內存限制的比較。
查詢監視器中的概覽選項卡。
這裡沒有什麼太詳細的——它只是一個概述（因此得名）。
查詢
查詢選項卡可讓您深入了解您正在查看的頁面的每個資料庫查詢。它是查詢監視器中信息最豐富的區域之一，當您考慮插件的名稱時，這很有意義。
對於每個查詢，您可以看到以下信息：
- 完整的查詢
- 查詢調用者
- 查詢組件（例如是來自核心、主題還是插件）
- 行數
- 查詢花費的時間
在一般調試中，您可以使用它來查找阻礙您網站性能的緩慢載入查詢。
查詢監視器將按您的主題和各個插件分解查詢，以便您可以看到每個擴展的影響。
假設一個特定的插件導致大量載入緩慢的查詢。在這種情況下，你需要找到一種方法來解決這個問題——要麼通過優化插件設置或伺服器配置中的某些內容（例如使用資料庫或對象緩存），要麼切換到更有效的不同插件。
在主選項卡中，您可以查看每個查詢的所有高級信息。
主查詢選項卡顯示所有查詢的列表。
如果您想了解有關特定查詢的更多信息，請單擊加號圖標以展開更多詳細信息。
如何查看查詢的擴展詳細信息。
如果您在這裡看到異常低的數字，可能是由於某種類型的緩存——例如頁面緩存或緩存其資料庫查詢的插件。因此，在調試時禁用緩存會很有幫助。
該區域還有一些子菜單可幫助您查找特定類型的查詢：
- 重複查詢
- 來電者查詢
- 按組件查詢
重複查詢
重複查詢區域突出顯示重複查詢並列出「潛在的麻煩製造者」，以幫助您調試它們並簡化事情。
如何查看重複查詢列表。
來電者查詢
來電者查詢區域可讓您查看此頁面上的所有來電者。如果您單擊一個，您可以看到該呼叫者的查詢列表。
如何查看調用者的查詢。
按組件查詢
Queries by Component 區域顯示了所有進行查詢的組件的列表，包括 WordPress 核心、您的主題和各個插件。
您可以單擊特定組件以查看其所有查詢。
如何按組件查看查詢。
同樣，這是最有價值的報告之一，因為它可以讓您找到特定的插件，這些插件會因查詢緩慢而降低您的網站性能。
如果您沒有按組件查看查詢，請閱讀此內容
如果您在 Query Monitor 中看不到組件信息，可能是因為 Query Monitor 無法符號鏈接其 db.php 文件。在這些情況下，您會看到如下所示的錯誤消息。
如果顯示此錯誤，您將無法按組件查看查詢。
這裡有兩個可能的原因：
- 您網站的 wp-content 文件夾的文件許可權。
- wp-content/db.php 文件已經存在（可能是因為像 W3 Total Cache 這樣的緩存插件）。
您可以在這篇 GitHub 文章中看到一些修復和解決方法。如果您覺得通過 SSH 連接到您的伺服器很舒服，您可以使用 WP-CLI 命令解決問題（儘管還有其他方法）。
Query Monitor 的大部分功能仍然可以解決此問題，但在解決此問題之前您將無法看到任何組件信息。
日誌
日誌選項卡是一個高級選項卡，可讓您設置要記錄的消息和變數。這可以幫助您調試技術問題或密切關注您的站點以發現問題。
當您第一次安裝查詢監視器時，此選項卡不會顯示任何內容，因為您沒有設置任何日誌記錄變數。
但是，如果您確實想設置自定義日誌記錄變數，則可以使用如下簡單語法進行設置：
do_action(‘qm/debug’, ‘這發生了！’);
Query Monitor 支持以下操作，可讓您在不同級別記錄問題：
- 質量管理/緊急
- 質量管理器/警報
- 質量/關鍵
- 質量/錯誤
- 質量/警告
- qm/通知
- 質量/信息
- 質量管理/調試
如果您想了解更多信息並查看一些示例，請查看查詢監視器日誌記錄變數頁面。
要求
主請求選項卡顯示當前請求的查詢變數。
主請求選項卡。
還有一些子菜單可以看到 Request Headers 和 Response Headers，這可能對性能調試更有幫助。
例如，也許您想調試緩存行為或 CDN 行為。在 Response Headers 子菜單中，您可以看到 Cache-Control 行為，讓您可以在您的站點上調試瀏覽器緩存。
如何查看響應標頭。
塊
僅當您查看使用本機 WordPress 塊編輯器（AKA Gutenberg）構建的頁面時，「塊」選項卡才可見。
在這些情況下，此頁面將列出頁面上的每個單獨塊，以及有關該塊的詳細信息。
這裡的一件聰明的事情是，它會告訴您該塊是來自 WordPress 核心還是其他插件。
僅當您創建了塊編輯器的內容時，才會出現塊區域。
模板
只有在站點前端使用查詢監視器時，模板選項卡才會可見。它可以幫助您查看和調試您正在查看的頁面的模板層次結構。
訂閱時事通訊
想知道我們是如何將流量提高到 1000% 以上的嗎？
加入 20,000 多人的行列，他們會通過 WordPress 內幕技巧獲得我們的每周時事通訊！
現在訂閱
您可以看到該頁面的特定模板文件以及各種模板部分和正文類。
這與性能沒有任何關係，但它對自定義主題開發是有益的。
如何查看模板層次結構。
管理屏幕
僅當您在 WordPress 管理儀錶板中使用查詢監視器時，管理屏幕選項卡才會可見。您可能不會經常使用它，但如果您需要在自定義管理屏幕中調試行為，它會很有幫助。
如果您查看帶有列表的管理屏幕，它將顯示自定義列過濾器和操作。它還將向您顯示 get_current_screen 的狀態。
管理屏幕詳細信息。
腳本
在查詢選項卡之後，腳本選項卡可能是查詢監視器中下一個最有用的性能調試區域。
此選項卡顯示頁面上每個排隊的 JavaScript 腳本及其依賴項和依賴項。您還可以使用過濾器快速查找來自特定主機或具有顯式依賴項/依賴項的腳本。
作為粗略的規則，更多的腳本等於一個更慢的網站，因為它們會增加頁面大小並添加 HTTP 請求。
您可以使用此區域來發現不同擴展的影響，並找到減少每個頁面上載入的排隊腳本數量的方法。
腳本區域顯示所有排隊的腳本。
不過，查詢監視器不會向您顯示所有這些腳本的載入時間。如果你想看到這一點，你需要使用速度測試工具並深入研究瀑布分析——Pingdom 和 GTmetrix 都是很好的選擇。
如果您需要幫助使用這些詳細信息來優化您網站的腳本，我們有很多有價值的指南來優化 WordPress 上的 JavaScript：
- 如何推遲 JavaScript 解析
- 如何消除渲染阻塞 JavaScript
- 如何減少 HTTP 請求
風格
Styles 選項卡類似於 Scripts 選項卡，但它顯示排隊的 CSS 而不是 JavaScript。這是另一個方便的選項卡，用於在您的站點上調試性能。
與腳本一樣，在頁面上載入更多樣式表通常會導致網站載入速度變慢。
在此區域中，您可以發現不同擴展程序對您網站的影響。您可以使用此信息來減少需要在頁面上載入的樣式表的數量，這將減少文件大小和載入頁面所需的 HTTP 請求。
Styles 區域顯示所有排隊的樣式表。
與腳本一樣，Query Monitor 不會深入分析 CSS 的載入方式以及它是否會阻止站點的關鍵部分載入。為此，您需要再次使用瀑布分析。
我們有一些有用的帖子可幫助您優化網站的 CSS：
- 如何優化 CSS
- 如何優化關鍵渲染路徑
鉤子和動作
Hooks & Actions 選項卡列出了當前頁面中的所有掛鉤和操作，以及它們的優先順序。
對於操作，您可以展開單個操作以查看與該操作關聯的實際文件和代碼行。您還可以按組件過濾操作，以從 WordPress 核心、插件和主題中查找操作。
這個領域並不真正關注性能，但它便於定製開發。
如何查看掛鉤和操作。
語言
語言選項卡顯示您網站上的語言和文本域以及用於每個擴展的語言文件。
因停機時間和 WordPress 問題而苦苦掙扎？Kinsta 是旨在節省您時間的託管解決方案！查看我們的功能
如果您有一個英語單語言網站，這不是很有用。但是，如果您有一個多語言站點和/或您的站點使用的語言可能沒有完整的翻譯包覆蓋範圍，則此選項卡會很有幫助。
HTTP API 調用
HTTP API 調用選項卡顯示頁面載入期間發生的所有伺服器端 HTTP 請求，包括請求詳細信息、時間和 HTTP 狀態代碼。
如果插件或主題的 HTTP API 調用速度較慢，這通常是導致性能不佳的「隱藏」原因，您需要找到解決此問題的方法，或者通過更改擴展設置中的某些內容或切換到不同的擴展名。
對於許多頁面，您應該看到「沒有 HTTP API 調用」，這是一個好兆頭，因為這意味著沒有任何東西妨礙您網站的性能。
能力檢查
Capability Checks 區域可讓您查看哪些用戶功能可以訪問您正在查看的當前內容。這可以很方便地查看不同的用戶是否可以訪問某些前端或後端內容。
但是，出於性能原因，默認情況下禁用此功能。如果要啟用它，則需要編輯站點的 wp-config.php 文件並添加以下代碼段：
定義（’QM_ENABLE_CAPS_PANEL’，真）；
環境
環境選項卡提供了站點環境的詳細摘要，包括：
- PHP
- 資料庫
- WordPress
- 伺服器
您可以查看重要的詳細信息、限制、版本號、配置設置等。
這也可以為有關性能的重要決策提供信息。
例如，如果您發現站點的內存限制是有限的，您可能希望增加內存限制以避免與內存限制相關的錯誤。
同樣，如果您發現您使用的是舊版本的 PHP，您可能需要升級到最新版本以提高性能。
如何查看環境信息。
條件句
條件選項卡可幫助您查看哪些條件語句適用於您正在查看的頁面，這有助於自定義開發。
您可以看到「真」條件句和「假」條件句。
如何查看頁面條件。
如何以非管理員用戶身份查看查詢監視器信息
在某些情況下，您可能希望以不同的用戶角色或註銷用戶的身份查看查詢監視器信息。這對於 WooCommerce 商店、會員網站和類似網站非常有用。
您需要在瀏覽器中設置身份驗證 cookie 來完成此操作。設置該 cookie 後，無論何時訪問該站點，您都可以查看查詢監視器信息，即使您已註銷。
要設置身份驗證 cookie，請單擊查詢監視器面板右上角的齒輪圖標。然後，單擊設置身份驗證 cookie 按鈕。
如何在查詢監視器中設置身份驗證 cookie。
如果您想禁用此功能，可以返回此界面並單擊清除身份驗證 cookie 按鈕以刪除 cookie。
如果您將其與來自同一開發人員的另一個有用插件 User Switching 結合使用，您可以在站點上的不同用戶角色之間快速切換。
如何使用附加組件擴展查詢監視器
到目前為止，我們只專註於核心 Query Monitor 插件中的功能和分析選項。但是，一些第三方插件可以進一步擴展查詢監視器。
這些可以添加對特定性能技術的支持，例如 Memcached 和 Redis，以及特定的 WordPress 插件，例如 WooCommerce 或 GiveWP。
Query Monitor 還支持 Debug Bar 插件的所有附加組件，它添加了 ElasticPress、Elementor、Cache Lookup 等的集成。
您可以在此 GitHub 頁面上查看 Query Monitor 附加組件的完整列表。
調試和提高 WordPress 性能的其他有用工具
雖然查詢監視器是一個方便的免費工具來調試 WordPress 性能，但它並不能涵蓋所有內容。您還應該考慮使用其他一些有用的工具來分析 WordPress 性能的不同領域。
Kinsta APM（應用程序性能監控）
Kinsta APM 工具。
如果您在 Kinsta 託管您的網站，您可以免費訪問 Kinsta 應用程序性能監控 (APM)。
像 Kinsta APM 這樣的 APM 工具比 Query Monitor 更深入，具有以下類型的分析：
- 緩慢的 PHP 進程
- 資料庫查詢慢
- 長 API 調用
- 長外部 URL 請求
- 全棧跟蹤到有問題的區域
您還可以查看此信息如何隨時間變化，這是 Query Monitor 無法做到的。此外，您可以分析整個網站，而不是逐頁分析。
對於一般教程，您可以遵循我們的 Kinsta APM 指南。
我們還有關於使用 APM 優化資源密集型 WordPress 網站的具體指南：
- 使用 APM 優化 WooCommerce 商店
- 使用 APM 優化會員網站
新遺物
New Relic 是另一個有用的性能監控工具，類似於 Kinsta APM。
如果您不在 Kinsta 託管，這可能是訪問類似類型分析的好方法。即使您在 Kinsta 託管，您仍然可以在需要時啟用 New Relic 跟蹤，但您需要擁有自己的許可證。
要了解如何使用 New Relic，您可以按照我們的 New Relic 性能教程進行操作。
質量速度測試工具
我們之前在談論瀑布分析時提到了這一點，但是一個好的速度測試工具對於調試您的網站載入內容和網站載入方式非常寶貴。
為了幫助您使用您選擇的任何工具，我們提供了有關運行速度測試的正確方法的專門指南。我們還發布了一些關於一些最流行工具的文章：
- GTmetrix 教程
- Pingdom教程
- PageSpeed Insights 教程
WordPress 調試模式
WordPress 包含自己的內置調試模式，可以查看所有 PHP 錯誤、通知和警告。您還可以選擇將這些問題保存到日誌文件中。
有關更多詳細信息，請查看我們的 WordPress 調試模式完整指南。
Web 瀏覽器開發者工具
與其他一些瀏覽器一樣，Chrome 包含非常詳細的開發人員工具，可以幫助您調試網站的性能。
例如，「網路」選項卡可讓您查看站點上每個 HTTP 請求的時間安排以及瀑布分析。性能選項卡為您提供了非常詳細的性能分析。
您還可以從 Lighthouse 選項卡運行 Lighthouse 審計。這與 PageSpeed Insights 使用的性能測試演算法相同。
如果您想了解如何使用 Chrome 開發者工具來調試性能，這個幫助中心是一個很好的起點。
無需一一停用插件，而是在此處了解如何更快速、更準確地查明和調試 WordPress 問題
點擊鳴叫
概括
如果您想調試 WordPress 網站上的性能和開發問題，查詢監視器插件是最好的免費工具之一。
要分析您網站的性能，您可能需要最關注界面的這些區域：
- 概述
- 查詢
- 日誌（適用於更高級的用戶）
- 腳本
- 風格
- HTTP API 調用
- 環境
但是，如果您開發 WordPress 網站，其他領域也很方便。
立即嘗試 Query Monitor，看看它有什麼幫助。如果您不想將它安裝在您的實時站點上，您可以隨時創建一個臨時站點並將其安裝在那裡，以查看您的站點底層發生了什麼。
通過以下方式節省時間、成本並最大限度地提高站點性能：
- 來自 WordPress 託管專家的即時幫助，24/7。
- Cloudflare 企業集成。
- 全球受眾覆蓋全球 29 個數據中心。
- 通過我們內置的應用程序性能監控進行優化。
所有這些以及更多，在一個沒有長期合同、協助遷移和 30 天退款保證的計劃中。查看我們的計劃或與銷售人員交談以找到適合您的計劃。