Imaginez ce scénario : Vous travaillez sur un projet de développement WordPress et vous avez installé une douzaine de plugins ou plus. Cependant, votre site ne ronronne pas comme vous le voudriez. Vous avez éliminé tous les suspects habituels : l’hébergement est adéquat, il n’y a pas d’erreurs JavaScript ou PHP évidentes, et il n’y a rien d’autre qui cloche clairement. Vous soupçonnez qu’un ou plusieurs des plugins que vous avez installés sont à blâmer, mais comment savoir quel plugin cause le problème ?

La méthode habituelle d’identification d’un plugin gênant est de désactiver les plugins un par un jusqu’à ce que le comportement que vous essayez d’adresser cesse. Cependant, avec le bon plugin de débogage installé, vous pouvez localiser le problème plus rapidement et avec plus de précision. C’est le type de scénario pour lequel Query Monitor a été conçu.

Qu’est-ce que Query Monitor ?

Query Monitor est un plugin gratuit de débogage et de développement pour WordPress. Vous pouvez l’utiliser pour identifier et déboguer les requêtes lentes de la base de données, les appels AJAX, les requêtes REST API, et bien plus encore. De plus, le plugin rapporte les détails du site Web tels que les dépendances de script et les dépendants, les hooks WordPress qui se déclenchent pendant la génération de pages, les détails de l’environnement d’hébergement, les balises de requêtes conditionnelles rencontrées par la page courante, et beaucoup plus.

Plugin Query Monitor WordPress

Plugin Query Monitor WordPress

Le plugin a été développé par John Blackbourn, un committer du noyau de WordPress qui est actuellement développeur chez Human Made et qui était auparavant employé par WordPress.com VIP – en d’autres termes, quelqu’un qui connaît vraiment WordPress. Query Monitor a été ajouté au répertoire des plugins WordPress en 2013 et compte actuellement plus de 10 000 installations actives – une somme impressionnante pour un plugin de développement. L’évaluation de cinq étoiles sur cinq du plugin par les utilisateurs aide à expliquer sa popularité auprès des développeurs.

Que fait Query Monitor ?

Beaucoup de choses.

Nous ne prendrons pas le temps de lister toutes les fonctionnalités offertes par Query Monitor, mais si vous voulez en savoir plus, jetez un oeil à Query Monitor sur GitHub. À un haut niveau, Query Monitor surveille chaque transaction WordPress qui a lieu sur le serveur, ou entre le serveur et le navigateur du visiteur, pendant qu’une page Web WordPress est générée. Il ajoute ensuite un rapport au pied de la page Web détaillant toutes les informations qu’il a recueillies. Il fonctionne sur toutes les pages, y compris les pages /wp-admin/, vous pouvez donc l’utiliser pour déboguer n’importe quelle page d’accueil ou page du back-end.

Le plugin porte le nom d’une fonctionnalité essentielle : la surveillance des requêtes de la base de données. Chaque requête est surveillée, chronométrée et liée à la fonction qui l’a générée. Par conséquent, vous pouvez trier les requêtes en fonction de leur temps de traitement et identifier les requêtes problématiques à chargement lent.

Query Monitor suit et répertorie également les hooks WordPress et les applications de balises conditionnelles sur la page générée. En tant que développeur, vous pouvez utiliser ces informations pour identifier le bon hook ou la balise conditionnelle à utiliser lors de l’ajout de nouvelles fonctionnalités de plugin ou de thème.

Query Monitor fournit de nombreuses informations supplémentaires. La meilleure façon d’avoir une vue d’ensemble de tout ce qui est généré par Query Monitor est de l’installer sur un site de test et de jeter un coup d’œil aux rapports.

Comment utiliser Query Monitor

Installez Query Monitor en utilisant la méthode de votre choix : c’est sur GitHub et aussi disponible dans le répertoire des plugins WordPress. Une fois le plugin installé, la première chose que vous remarquerez est qu’un nouvel élément de menu a été ajouté à la barre d’administration :

Barre d'administration de Query Monitor

Barre d’administration de Query Monitor

L’étiquette du nouvel élément affiche quelques métriques :

  • Temps de génération des pages,
  • Utilisation maximale de la mémoire PHP,
  • Heure de l’interrogation de la base de données, et
  • Le nombre total de requêtes effectuées dans la base de données.

Survolez la barre d’administration et un menu déroulant apparaîtra. Toutes les données générées par Query Monitor sont contenues dans un seul rapport ajouté au bas de la page et divisé en plusieurs sections. Cliquez sur l’un des éléments du menu déroulant pour accéder à la section correspondante du rapport de Query Monitor. Par exemple, vous trouverez ci-dessous une capture d’écran de l’ensemble des « requêtes » qui s’exécutent sur la page.

Requêtes dans Query Monitor

Requêtes dans Query Monitor

Si des erreurs PHP surviennent, ou si les requêtes prennent trop de temps, des éléments supplémentaires seront ajoutés au menu déroulant pour mettre en évidence ces problèmes. Cliquez dessus pour voir plus de détails.

Vous remarquerez peut-être que les derniers éléments de la liste changent d’une page à l’autre. Ces éléments, affichés en vert, sont les balises de requêtes conditionnelles satisfaites par la page courante.

Faites défiler l’ensemble du rapport pour voir la richesse des données générées par Query Monitor. Prenez le temps d’essayer les menus déroulants disponibles pour filtrer les données contenues dans le rapport ainsi que les cases contenant un symbole « + » qui peut être utilisé pour afficher plus de données sur plusieurs détails rapportés.

Si vous voulez obtenir encore plus de données de Query Monitor, jetez un coup d’oeil aux modules complémentaires de Query Monitor pour voir s’il existe un plugin qui va générer les informations de débogage dont vous avez besoin.

Vous avez des problèmes de temps d'indisponibilité et de WordPress ? Kinsta est la solution d'hébergement conçue pour vous faire gagner du temps ! Découvrez nos fonctionnalités

Comment afficher les données de Query Monitor en tant qu’utilisateur déconnecté

Lorsque vous visualisez un site Web WordPress alors que vous êtes connecté en tant qu’administrateur, le site contient une barre d’administration et des scripts supplémentaires que les visiteurs déconnectés ne voient pas. Query Monitor permet de visualiser le site pendant la déconnexion et d’avoir toujours accès aux informations de débogage. Cependant, utiliser cette fonction pour la première fois peut s’avérer un peu délicat.

Pour afficher les données de Query Monitor en tant que visiteur déconnecté, procédez comme suit :

  • Allez dans la zone d’administration de WordPress lorsque vous êtes connecté en tant qu’administrateur et cliquez sur l’élément Query Monitor dans la barre d’administration.
  • Faites défiler le bas des données rapportées et recherchez le lien qui indique Définir le cookie d’authentification. Notez que vous devez être dans la zone d’administration pour voir le lien. Si vous cherchez le lien sur une page d’accueil, vous ne le trouverez pas.
  • Cliquer sur ce lien ajoutera un cookie d’authentification à votre navigateur. De cette façon, Query Monitor saura afficher les résultats des tests même si vous n’êtes pas connecté.
  • Avec le cookie d’authentification défini, déconnectez-vous du site ou passez à un profil d’utilisateur non-administrateur en utilisant un plugin comme User Switching.
  • Naviguez jusqu’à la page où vous voulez voir les informations de débogage et faites défiler jusqu’au bas de la page. Vous y verrez une version condensée du rapport Query Monitor. Cliquez sur n’importe quel élément pour agrandir le rapport.

Résumé

En tant que développeur WordPress, disposer des bons outils peut vous faciliter la tâche. Query Monitor est un outil gratuit qui peut vous faire gagner beaucoup de temps. Vous pouvez l’utiliser pour :

  • Repérez les requêtes lentes et les fonctions qui les déclenchent,
  • Générer une liste des hooks WordPress rencontrés lors de la génération de la page par WordPress,
  • Confirmer quelles balises conditionnelles s’appliquent à la page ou à l’article en cours,
  • Identifier les relations entre les ressources JavaScript,
  • Jeter un coup d’œil aux détails de la configuration du serveur, et
  • Bien plus encore.

Si vous essayez Query Monitor, il y a de fortes chances qu’il devienne rapidement un ajout permanent à votre environnement de développement WordPress.

Lectures recommandées :

Comment accélérer votre site WordPress (Guide ultime)

Débogage des problèmes de performances de WordPress – Checklist des choses qui se produisent

 

16
Partages