クエリ モニター プラグインとは何ですか?

スピードアップの方法がわからない低速の Web サイトに遭遇したことがある場合や、クライアントからパフォーマンスの向上を求めているというフィードバックがあった場合は、Query Monitor プラグインが新しい親友になる可能性があります。 Query Monitor は、WordPress の開発者ツール パネルです。

これにより、データベース クエリ、PHP エラー、フックとアクション、ブロック エディター ブロック、エンキューされたスクリプトとスタイルシート、HTTP API 呼び出しなどのデバッグが可能になります…」. また、特に開発者の場合、WordPress Web サイトでエラーや予期しない動作を必然的にデバッグする必要がある場合に備えて、ツールボックスに入れておきたいツールです。

この記事では、Query Monitor プラグインとは何か、開発者が WordPress Web サイトで実行されているすべてのコードをよりよく理解するために、このプラグインがどのように役立つかを見ていきます。

クエリモニターとは

Query Monitor は、開発者にとってまさに「スイス アーミー ナイフ」のようなプラグインです。 テンプレート、スクリプト、スタイル エンキュー、およびサイトで使用されているさまざまなプラグインすべてを見ることに慣れているかもしれませんが、クエリ モニターを使用すると、さらに 1 レベル深く進むことができます。

Query Monitor プラグインをインストールすると、実際に発生しているデータベース クエリ、特定のページ ロードの一部として組み込まれているさまざまなテンプレート パーツをすべて確認し、パフォーマンスの問題を引き起こしている可能性のあるものを掘り下げることができます。 Webサイト。

クエリ モニターが必要になるのはいつですか?

クエリ モニターは、全体的なパフォーマンスの問題、特定のページの問題、GTMetrix や Google PageSpeed などのツールからフラグが付けられた問題など、Web サイトの問題を特定したときに最も重要です。 ただし、これらのツールを使用すると、実際の問題が隠されることがあります。

たとえば、Google PageSpeed 分析で低いパフォーマンス スコアが表示されている場合、すべてのページでレンダリングするよりも時間がかかっている不正なデータベース クエリはありますか? PageSpeed はサイトのバックエンドにアクセスできないため、「サイトのこの部分を高速化する必要があります」以外の具体的な情報を提供することはできません。 そこでクエリモニターの出番です。

クエリ モニター インターフェイスはどのようなものですか?

Query Monitor には多数の機能が組み込まれていますが (ドキュメントの一部としてより完全に参照できます)、プラグインの 3 つの特定の部分に焦点を当てます: データベース クエリのデバッグ、テンプレートに関する詳細情報の検索WordPress サイトで使用されているフックとアクションを詳しく調べます。

Query Monitor プラグインをインストールした後、WordPress ユーザーとしてログインしている場合、Query Monitor には管理バーの一部として独自のセクションがあり、デバッグを開始するのに役立つ詳細な統計にアクセスできます。

データベース クエリ

管理バーの [クエリ モニター] セクションからQueries項目を選択すると、画面の下部にポップアップ ウィンドウが表示され、現在のページをレンダリングするためにサイトが作成したさまざまなデータベース クエリが分類されます。

ここでは、WordPress のどの部分が最初にクエリを作成したかによってデータベース クエリをフィルタリングできるだけでなく、オブジェクト キャッシュの恩恵を受ける可能性のある重複したデータベース クエリがいつ作成されたかを簡単に確認することもできます。

このリストを下にスクロールすると、現在表示しているページをレンダリングするために使用されたすべてのデータベース クエリ、およびデータベースを作成した WordPress コードベースの部分と、クエリの実行にかかった時間が表示されます。

Time列は並べ替え可能であるため、ページの読み込みの一部として実行に最も時間がかかっているクエリをすばやく確認し、そこでデバッグを開始できます。

低速で重複するデータベース クエリは、WordPress サイトにとって大きな問題になる可能性があり、気付かれないことがよくあります。 ただし、クエリ モニターを使用してデータベース クエリを調べると、たとえば、サイトが大きくなりすぎたためにリファクタリングが必要なポスト メタ クエリがあるかどうかを確認できます。

テンプレート情報

特に、サイトのフロント エンドで予期しない出力をデバッグする場合、どのテンプレートが使用され、どのテンプレート パーツが読み込まれているかを知ることは非常に役立ちます。 これは、Query Monitor が非常に役立つもう 1 つの領域です。

[クエリ モニター] ドロップダウンからTemplateオプションを選択すると、ページのレンダリングに使用されたメイン テンプレートと、使用されたテンプレート パーツを確認できます。

この情報を使用すると、現在どのテンプレートが使用されているかを確認できるだけでなく、このページの構築の一環としてテンプレート階層がどのように解析されたか、どのボディ クラスが含まれていたかについての情報を得ることができます。

これにより、クエリ モニターのTemplateタブは、フロントエンドの問題のデバッグを開始するときに非常に強力なビューになります。

たとえば、CSS クラスを介してページにスタイリングを適用することになっているプラ​​グインがある場合、それに関連するスタイリングの問題のデバッグを開始するのに最適な場所は、 Templateタブを使用して、そのボディ クラスが追加されているかどうかを確認することです。 CSS のデバッグに入る前に、期待どおりにページを表示します。

フックとアクション

アクションとフィルターの使用を開始すると、デバッグが困難な WordPress 実行の別の領域が明らかになります。 アクションとフィルターは、あらゆる種類のプラグインやテーマで WordPress の機能をカスタマイズするために使用されますが、それらが意図したとおりに起動しているとは限りません。

たとえば、よくある問題は、関数がアクションまたはフィルターにフックされているが、その機能がより高い優先度で実行されている別の関数によってオーバーライドされることです。 クエリ モニターのHooks and Actionsタブを使用すると、どの関数がどのアクションにフックされているか、実行中のページの実行および読み込みサイクルの正確な場所を簡単にドリルダウンして確認できます。

右端の列には、呼び出されている機能を担当しているコンポーネントも示されているため、競合が見つかった場合は、コードベースのその部分にドリルダウンして、何が起こっていて、何を変更する必要があるかを正確に把握できます。

クエリ モニターと WP_DEBUG

よくある誤解の 1 つは、クエリ モニターを使用すると、サイトでWP_DEBUG定数を有効にしている場合に利用できたはずの情報にアクセスできるというものです。 クエリ モニターは、WordPress サイトをデバッグしている場合に利用できるのと同じ情報の一部を提供しますが、個々のコードを大規模にデバッグしないと、上記で詳述した情報を入手するのははるかに困難です。

Query Monitor を使用すると、この情報をブラウズするための優れたクリーンなインターフェイスが得られるだけでなく、コードベースを変更することなく、箱から出してすぐにすべてを取得できるため、問題のデバッグを非常に迅速に開始し、問題のどの部分を把握することができます。コードベースを変更する必要があります。

さらに、ログインしているユーザーに対してのみ実行されるため、サイトの管理者以外にはデバッグ情報が表示されず、ログインしていないユーザーのページ パフォーマンスがクエリによって影響を受けることはありません。実行中を監視します。

まとめ

特に、WordPress サイトで特定の問題のデバッグを開始する場所がわからない場合、クエリ モニターは、WordPress 実行サイクルのすべての重要な部分の概要を把握するための優れた方法です。 さまざまなタブをざっと見てみると、何かが正しくないように思われるかどうかを確認し、ページの読み込みの特定の部分をさらに掘り下げることができます。 デバッグ ツールボックスにあるこの強力なツールを使用すると、問題をより迅速に特定して、WordPress サイトの構築に戻ることができます。

Query Monitor を何に使用し、ワークフローにどのように役立ちましたか? 以下のコメント欄でお知らせください。