Stelle dir dieses Szenario vor: Du arbeitest an einem WordPress-Entwicklungsprojekt und hast ein Dutzend oder mehr Plugins installiert. Allerdings macht deine Website nicht ganz so mit, wie du es dir wünschst. Du hast alle üblichen Verdächtigen eliminiert: Das Hosting ist ausreichend, es gibt keine offensichtlichen JavaScript- oder PHP-Fehler, und es gibt nichts anderes, was eindeutig nicht stimmt. Du vermutest, dass eines oder mehrere der von dir installierten Plugins schuld sind, aber wie findest du heraus, welches Plugin das Problem verursacht?

Die übliche Methode, um ein lästiges Plugin zu identifizieren, besteht darin, Plugins einzeln zu deaktivieren, bis das Verhalten, das du zu adressieren versuchst, aufhört. Mit dem richtigen Debugging-Plugin kannst du das Problem jedoch schneller und genauer lokalisieren. Dies ist die Art von Szenario, in dem der Query Monitor durchgeführt wurde.

Was ist der Query Monitor?

Query Monitor ist ein kostenloses Debugging- und Entwicklungs-Plugin für WordPress. Du kannst es verwenden, um langsame Datenbankabfragen, AJAX-Aufrufe, REST-API-Anfragen und vieles mehr zu identifizieren und zu debuggen. Darüber hinaus meldet das Plugin Website-Details wie Skriptabhängigkeiten und Abhängigkeiten, WordPress-Hooks, die während der Seitengenerierung ausgelöst wurden, Details zur Hosting-Umgebung, bedingte Abfrage-Tags, die von der aktuellen Seite erfüllt werden, und vieles mehr.

Query Monitor WordPress plugin

Query Monitor WordPress plugin

Das Plugin wurde von John Blackbourn entwickelt, einem Kern-Committer von WordPress, der derzeit Entwickler bei Human Made ist und zuvor bei WordPress.com VIP beschäftigt war – mit anderen Worten, jemand, der WordPress wirklich kennt. Query Monitor wurde 2013 in das WordPress Plugin-Verzeichnis aufgenommen und verfügt derzeit über mehr als 10.000 aktive Installationen – eine beeindruckende Summe für ein Entwicklungs-Plugin. Die Benutzerbewertung des Plugins von fünf von fünf Sternen erklärt seine Beliebtheit bei Entwicklern.

Was macht der Query Monitor?

Wir werden uns nicht die Zeit nehmen, alle Funktionen von Query Monitor aufzulisten, aber wenn du dich in die Details vertiefen möchtest, schau dir Query Monitor auf GitHub an. Auf einer hohen Ebene überwacht der Query Monitor jede WordPress-Transaktion, die auf dem Server oder zwischen dem Server und dem Browser des Besuchers stattfindet, während eine WordPress-Webseite generiert wird. Es fügt dann einen Bericht an die Fußzeile der Webseite an, der alle gesammelten Informationen enthält. Es funktioniert auf jeder Seite, einschließlich /wp-admin/ Seiten, so dass du es verwenden kannst, um jede Frontend oder Backend-Seite zu debuggen.

Das Plugin ist nach einem Kernfeature benannt: dem Überwachen von Datenbankabfragen. Jede Abfrage wird überwacht, getaktet und an die Funktion gebunden, die sie erzeugt hat. Dadurch kannst du Abfragen danach sortieren, wie lange sie für die Verarbeitung benötigen, und problematische, langsam ladende Abfragen lokalisieren.

Query Monitor verfolgt und listet auch die WordPress Hooks und Conditional Tags Anwendung auf der generierten Seite auf. Als Entwickler kannst du diese Informationen verwenden, um den richtigen Haken oder das richtige bedingte Tag zu identifizieren, das du beim Hinzufügen neuer Plugin- oder Theme-Funktionen verwenden kannst.

Der Query Monitor bietet viele zusätzliche Informationen. Der beste Weg, um alles, was von Query Monitor generiert wird, in den Griff zu bekommen, ist, es auf einem Testgelände zu installieren und einen Blick auf die Berichte zu werfen.

So verwendest du den Query Monitor

Installiere Query Monitor nach deiner bevorzugten Methode: Es ist auf GitHub und auch im WordPress Plugin-Verzeichnis verfügbar. Sobald du das Plugin installiert hast, wirst du als erstes feststellen, dass ein neuer Menüpunkt in der Adminleiste hinzugefügt wurde:

Query Monitor Admin-Leiste

Query Monitor Admin-Leiste

Die Bezeichnung auf dem neuen Element zeigt einige Metriken an:

  • Zeit für die Seitenerstellung,
  • Maximale Nutzung des PHP-Speichers,
  • Datenbankabfragezeit und
  • Die Gesamtzahl der durchgeführten Datenbankabfragen.

Bewege den Mauszeiger über die Admin-Leiste und ein Dropdown-Menü erscheint. Alle von Query Monitor erzeugten Daten sind in einem einzigen Bericht enthalten, der am Fuß der Seite hinzugefügt und in mehrere Abschnitte unterteilt wird. Klicke auf einen der Punkte im Dropdown-Menü, um zum entsprechenden Abschnitt des Query Monitor-Berichts zu gelangen. Nachfolgend siehst du beispielsweise einen Screenshot der gesamten „Abfragen“, die auf der Seite ausgeführt werden.

Query Monitor Abfragen

Query Monitor Abfragen

Wenn PHP-Fehler auftreten oder Abfragen zu lange dauern, werden dem Dropdown-Menü zusätzliche Elemente hinzugefügt, die diese Probleme hervorheben. Klicke auf sie, um mehr Details zu sehen.

Du wirst vielleicht feststellen, dass sich die letzten paar Punkte in der Liste von einer Seite zur nächsten ändern. Diese grün markierten Elemente sind die bedingten Abfrage-Tags, die von der aktuellen Seite erfüllt werden.

Blättere durch den gesamten Bericht, um die Fülle der vom Query Monitor erzeugten Daten zu sehen. Nimm dir die Zeit, die Dropdown-Menüs auszuprobieren, die zum Filtern der im Bericht enthaltenen Daten zur Verfügung stehen, sowie die Kästen mit einem „+“-Symbol, mit denen du mehr Daten über viele berichtete Details anzeigen kannst.

Wenn du noch mehr Daten aus dem Query Monitor herausholen möchtest, schaue dir die Add-Ons von Drittanbietern an, um zu sehen, ob ein Plugin existiert, das die benötigten Debugging-Informationen generiert.

So zeigst du Abfrageüberwachungsdaten als abgemeldeter Benutzer an

Wenn du eine WordPress-Website ansiehst, während du als Admin angemeldet bist, enthält die Website eine Admin-Leiste und zusätzliches Skripting, das abgemeldete Besucher nicht sehen. Query Monitor ermöglicht es, die Website im abgemeldeten Zustand anzuzeigen und dennoch Zugriff auf Debugging-Informationen zu haben. Die erstmalige Verwendung dieser Funktion kann jedoch etwas schwierig sein.

Um Query Monitor-Daten als abgemeldeter Besucher anzuzeigen, führe diese Schritte aus:

  • Gehe in den WordPress-Administrationsbereich, während du als Admin angemeldet bist, und klicke auf das Element Query Monitor in der Adminleiste.
  • Scrolle ganz unten in den gemeldeten Daten und suche nach dem Link, der lautet: Set authentication cookie. Beachte, dass du dich im Admin-Bereich befinden musst, um den Link zu sehen. Wenn du nach dem Link auf einer Frontend-Seite suchst, wirst du ihn nicht finden.
  • Wenn du auf diesen Link klickst, wird ein Authentifizierungs-Cookie zu deinem Browser hinzugefügt. Auf diese Weise weiß der Query Monitor, dass er Testergebnisse anzeigen muss, auch wenn du nicht angemeldet bist.
  • Mit dem gesetzten Authentifizierungs-Cookie kannst du dich von der Website abmelden oder mit einem Plugin wie User Switching zu einem Non-Admin-Benutzerprofil wechseln.
  • Navigiere zu der Seite, auf der du Debugging-Informationen sehen möchtest, und scrolle zum Ende der Seite. Dort siehst du eine Kurzfassung des Query Monitor-Berichts. Klicke auf ein beliebiges Element, um den Bericht zu erweitern.

Zusammenfassung

Als WordPress-Entwickler kann Ihnen der Einsatz der richtigen Tools die Arbeit erleichtern. Query Monitor ist ein kostenloses Tool mit dem Potenzial, dir viel Zeit zu sparen. Du kannst es benutzen, um:

  • Lokalisiere langsame Abfragen und die Funktionen, die sie auslösen,
  • Erstelle eine Liste der WordPress-Hooks, die während der Generierung der Seite durch WordPress gefunden wurden,
  • Überprüfe, welche bedingten Tags auf die aktuelle Seite oder den aktuellen Beitrag zutreffen,
  • Identifiziere die Beziehungen zwischen JavaScript-Ressourcen,
  • Wirf einen Blick auf die Details der Serverkonfiguration und
  • Vieles mehr.

Wenn du Query Monitor ausprobierst, besteht eine gute Chance, dass es schnell zu einer permanenten Ergänzung deiner WordPress-Entwicklungsumgebung wird.

Empfohlene Lektüre:

Wie man seine WordPress-Seite beschleunigt (Ultimate Guide)

Debuggen von WordPress Performance-Problemen – Stuff Happens Checkliste

15
Mal geteilt