什麼是查詢監視器插件?

已發表: 2022-12-07

如果您曾經遇到過一個速度緩慢的網站,您只是想不出如何加快速度或客戶反饋他們正在尋求性能提升,那麼 Query Monitor 插件可能就是您最好的新朋友。 Query Monitor”是 WordPress 的開發者工具面板。

它可以調試數據庫查詢、PHP 錯誤、掛鉤和操作、塊編輯器塊、排隊的腳本和样式表、HTTP API 調用等等……”。 而且,特別是如果您是一名開發人員,當您不可避免地不得不調試 WordPress 網站上的錯誤或意外行為時,它是您希望在工具箱中擁有的工具。

在本文中,我們將了解什麼是 Query Monitor 插件,以及它如何幫助您作為開發人員更好地了解在您的 WordPress 網站上運行的所有代碼。

什麼是查詢監視器

Query Monitor 是一個對開發人員來說非常像“瑞士軍刀”的插件。 雖然您可能習慣於查看模板、腳本和样式排隊,以及您網站上使用的所有各種插件,但查詢監視器允許您更深入地了解。

安裝了 Query Monitor 插件後,您可以查看實際發生的數據庫查詢,作為任何特定頁面加載的一部分包含的所有各種模板部分,並真正深入了解可能導致性能問題的任何內容網站。

什麼時候需要查詢監視器?

當您在網站中發現問題時,查詢監視器是最重要的,無論是整體性能問題、特定頁面上的問題,還是 GTMetrix 或 Google PageSpeed 等工具標記的問題。 但是,當您使用這些工具時,它們有時會掩蓋實際問題。

例如,如果您在 Google PageSpeed 分析中看到一個低性能分數,是否有一個流氓數據庫查詢花費的時間超過了它應該在每個頁面上呈現的時間? 由於 PageSpeed 無法訪問您網站的後端,因此除了“您網站的這一部分需要更快”之外,它無法為您提供任何更具體的信息。 這就是查詢監視器的用武之地。

查詢監視器界面是什麼樣的?

雖然 Query Monitor 具有大量內置功能(您可以將其作為文檔的一部分進行更完整的瀏覽),但我們將重點關注插件的三個特定部分:調試數據庫查詢,找出有關模板的更多信息您的 WordPress 網站正在使用並深入研究正在使用的掛鉤和操作。

安裝 Query Monitor 插件後,如果您以 WordPress 用戶身份登錄,您將看到 Query Monitor 有自己的部分作為管理欄的一部分,您可以在其中訪問有助於開始調試的詳細統計信息。

數據庫查詢

如果您從管理欄的“查詢監視器”部分選擇Queries項,您將看到屏幕底部彈出一個窗口,其中分解了您的網站為呈現您所在的頁面而進行的各種數據庫查詢。

在這裡,您不僅可以通過 WordPress 最初進行查詢的部分來過濾數據庫查詢,還可以輕鬆查看何時進行了可能受益於對象緩存的重複數據庫查詢。

Query Monitor 的示例顯示了我們示例站點的各種數據庫查詢

向下滾動此列表,您可以看到用於呈現您當前所在頁面的每個數據庫查詢,以及 WordPress 代碼庫的哪一部分使數據庫可以以及查詢執行所花費的時間。

Time列是可排序的,因此您可以非常快速地查看作為頁面加載的一部分執行時間最長的查詢,並在那裡開始調試。

緩慢和重複的數據庫查詢對於 WordPress 網站來說可能是一個巨大的問題,並且經常被忽視。 但是,通過使用查詢監視器查看數據庫查詢,您可以開始查看是否有,例如,由於您的站點變得太大而需要重構的後元查詢。

模板信息

特別是在站點前端調試意外輸出時,了解正在使用哪個模板以及正在加載哪些模板部分非常有用。 這是查詢監視器非常有用的另一個領域。

通過從 Query Monitor 下拉菜單中選擇Template選項,您可以看到用於呈現頁面的主模板,以及使用的任何模板部分。

顯示用於加載 WordPress 頁面的模板的查詢監視器示例

有了這些信息,您不僅可以看到當前正在使用哪個模板,還可以獲得有關如何將模板層次結構作為此頁面構造的一部分進行解析以及包含哪些主體類的一些信息。

這使得查詢監視器中的Template卡在開始調試前端問題時成為一個非常強大的視圖。

例如,如果您有一個插件應該通過 CSS 類將樣式應用到頁面,那麼開始調試與此相關的樣式問題的最佳位置是使用Template卡檢查該主體類是否被添加到在深入調試 CSS 之前,頁面符合預期。

鉤子和動作

一旦您開始使用 Actions 和 Filters,另一個難以調試的 WordPress 執行區域就會變得很明顯。 各種不同的插件和主題使用 Actions 和 Filters 來自定義 WordPress 功能,但您不能總是確定它們是否按照您希望的方式觸發。

例如,一個常見的問題是一個函數掛鉤到一個動作或過濾器,但隨後它的功能被另一個以更高優先級運行的函數覆蓋。 通過使用 Query Monitor 的Hooks and Actions選項卡,您可以輕鬆地向下鑽取並查看哪些函數掛鉤到哪些操作,以及它們在頁面的執行和加載週期中的確切位置。

用於調試的查詢監視器的 Hooks & Actions 選項卡示例

最右邊的列甚至會告訴您哪個組件負責被調用的功能,因此如果您發現衝突,您可以深入到代碼庫的那部分並找出到底發生了什麼以及需要修改什麼。

查詢監視器與 WP_DEBUG

一種常見的誤解是,如果您在站點上啟用了WP_DEBUG常量,查詢監視器可以讓您訪問本可用的信息。 雖然 Query Monitor確實提供了一些與調試 WordPress 站點時可用的相同信息,但如果不對單個代碼進行大量調試,我們將很難獲得上面詳述的信息。

使用 Query Monitor,您不僅可以獲得一個漂亮、乾淨的界面來瀏覽這些信息,而且您可以開箱即用,而無需修改您的代碼庫,從而使您可以非常快速地開始調試問題並找出哪些部分您的代碼庫需要修改。

此外,因為它只為登錄用戶運行,所以您可以確保您站點的非管理員看不到調試信息,並且未登錄的用戶的頁面性能不會受到 Query 的影響監控運行。

包起來

特別是當您不知道從哪裡開始調試 WordPress 站點上的特定問題時,查詢監視器可能是獲得 WordPress 執行週期所有關鍵部分的總體概覽的好方法。 瀏覽各種選項卡將使您能夠查看是否有什麼地方看起來不太正確,並深入了解頁面加載的特定部分。 使用調試工具箱中的這個強大工具,您將能夠更快地隔離問題並重新構建您的 WordPress 站點。

您將 Query Monitor 用於什麼目的?它對您的工作流程有何幫助? 在下面的評論中讓我們知道。