Come eseguire il debug dei problemi di prestazioni di WordPress con Query Monitor

Quando si lavora su un sito WordPress con molti plugin, potrebbero verificarsi problemi di prestazioni. Identificarli può essere difficile. Gli sviluppatori in genere risolvono gli errori di WordPress escludendo parti del codice che potrebbero causare problemi o disattivando i plugin uno per uno.

Questo processo può richiedere molto tempo. Tuttavia, esiste una soluzione più rapida: il plug-in Query Monitor. Offre un modo più efficiente per identificare i problemi di prestazioni e comprendere il funzionamento del tuo sito WordPress.

In questa guida ti racconterò tutto su Query Monitor. Non si tratta solo di identificarne lo scopo e la funzionalità, ma anche di come utilizzarlo in modo efficace per eseguire il debug dei problemi del tuo sito WordPress e migliorarne le prestazioni.

Breve panoramica del plugin Query Monitor

– Fonte: WordPress.org

Query Monitor si distingue come un plugin completamente gratuito progettato per assisterti nella risoluzione dei problemi di prestazioni e sviluppo sul tuo sito WordPress. Offre approfondimenti su query di database, script, tempistiche e altro ancora.

Una volta installato, Query Monitor aggiunge una comoda voce alla barra dei menu in alto, offrendo un elenco a discesa che rivela il numero di query in esecuzione sulla pagina corrente.

Ciò include tempo di caricamento, tipi di query, componenti e altri dettagli. Questi dati consentono agli sviluppatori di comprendere e risolvere meglio gli errori del sito Web.

È stato sviluppato da John Blackbourn ed è disponibile sia sul repository ufficiale dei plugin WordPress che su GitHub.

Query Monitor viene aggiornato regolarmente e il team di sviluppo fornisce supporto tempestivo e correzioni per tutti i bug segnalati.

Cosa fa Query Monitor?

Ecco cosa può fare per te il plugin Query Monitor:

• Identificare gli errori PHP.
• Monitorare l'utilizzo della memoria.
• Analizza le query del database, comprese quelle di plugin specifici.
• Tieni traccia delle chiamate API HTTP sul tuo sito WordPress.
• Esplora gli script e gli stili accodati, insieme alle relative dipendenze.
• Comprendi gli hook e le azioni che influenzano il comportamento del tuo sito.
• Esaminare i file dei modelli di temi in uso.
• Controlla le lingue e le traduzioni all'interno del tuo sito.
• Esamina le regole di riscrittura che influenzano gli URL del tuo sito.
• Analizza i blocchi presenti nell'editor di blocchi di WordPress.
• Accedi alle informazioni generali sull'ambiente del tuo sito.
• Ottieni informazioni approfondite sulle prestazioni delle schermate di amministrazione di WordPress.

L'installazione del plugin è abbastanza semplice e generalmente non richiede passaggi aggiuntivi (rispetto al processo di installazione di plugin simili), né richiede alcuna configurazione aggiuntiva dopo l'installazione.

Visualizza l'elenco a discesa nella barra degli strumenti di amministrazione immediatamente.

È possibile accedere ai dettagli delle query effettuate al database, ai CSS, agli hook attivi e alle chiamate API HTTP facendo clic sulle voci nell'elenco a discesa.

New Relic può anche aiutarti a monitorare le prestazioni del tuo sito WordPress in modo ancora più conveniente, direttamente dalla dashboard di Cloudways. Ma di questo ne parleremo un po' più avanti nel blog.

Requisiti di sistema di Query Monitor

Per utilizzare Query Monitor, il tuo sistema dovrebbe avere WordPress (sono supportate versioni fino a tre anni) e PHP versione 7.4 o successiva. Per maggiori dettagli è possibile visitare il sito web di Query Monitor.

Perché Query Monitor è utile per gli sviluppatori?

Il plug-in Query Monitor aiuta gli sviluppatori a identificare le aree di miglioramento, rivelando plug-in o risorse che causano problemi o conflitti con le risorse.

Risolve in modo efficiente i colli di bottiglia, consentendo miglioramenti del codice o sostituendo elementi problematici. Ciò avvantaggia i proprietari di siti Web e gli sviluppatori che mirano a ottimizzare le prestazioni.

Per aiutarti a comprendere meglio il vantaggio dell'utilizzo di Query Monitor, consideriamo una semplice attività di sviluppo che in genere richiederebbe l'utilizzo del codice: scoprire il tempo di caricamento della pagina e il numero di query attive sulla pagina.

WordPress offre due semplici funzioni: get_num_queries() e timer_stop() . Questi codici possono aiutarti a identificare i colli di bottiglia nelle prestazioni, che richiedono un certo livello di conoscenza tecnica per essere interpretati in modo efficace.

Query Monitor automatizza il processo di aggiunta di funzioni al codice e di controllo dei risultati, evitandoti di farlo manualmente. Visualizza il numero di query del database e fornisce approfondimenti su vari aspetti delle prestazioni e della funzionalità del tuo sito.

Funzionalità di WordPress Query Monitor

Ecco una panoramica completa delle straordinarie funzionalità di Query Monitor:

1. Domande sul database

• Notifiche per query lente, duplicate o errate.
• Opzioni di filtraggio per tipo di query, componente responsabile (plugin, tema, core di WordPress) e funzione di chiamata.
• Visualizzazioni aggregate per ciascun tipo di query, fornendo una suddivisione dettagliata.

2. Informazioni sul modello

Visualizzazione del nome file del modello, della gerarchia completa del modello e delle parti del modello caricate o scaricate (per temi a blocchi e temi classici).

3. Errori PHP

• Presentazione degli errori PHP con dettagli sul componente responsabile, stack di chiamate e un avviso visibile nella barra degli strumenti di amministrazione.
• Identificare l'utilizzo della funzionalità obsoleta o "Doing it Wrong" nel codice.

4. Blocchi e modifica completa del sito (FSE)

Informazioni dettagliate sui blocchi e sulle proprietà associate all'interno del contenuto del post e di FSE.

5. Riscrivere le regole e le stringhe di query

Visualizzazione delle regole di riscrittura corrispondenti, delle stringhe di query associate e delle variabili di query.

6. Script e fogli di stile accodati

Informazioni su script e fogli di stile accodati, incluse dipendenze e avvisi per dipendenze interrotte.

7. Impostazioni della lingua

Dettagli sulle impostazioni della lingua e sui file di traduzione caricati (file MO e file JSON) per ciascun dominio di testo.

8. Richieste API HTTP

Registrazione delle richieste API HTTP con codice di risposta, componente responsabile e tempo impiegato, insieme ad avvisi per richieste non riuscite o errate.

9. Verifiche delle capacità dell'utente

Reporting dei controlli di capacità dell'utente, inclusi il risultato e i parametri passati al controllo di capacità.

10. Informazioni sull'ambiente

Informazioni dettagliate su PHP, database, WordPress e server web.

11. Funzioni condizionali

Valori di tutte le funzioni condizionali di WordPress, come is_single(), is_home(), ecc.

12. Transitori e funzionalità multisito

Identificazione dei transitori aggiornati e utilizzo di switch_to_blog() e Restore_current_blog() su installazioni multisito.

13. Reindirizzamenti

Aggiunta automatica di un'intestazione HTTP contenente lo stack di chiamate ogni volta che si verifica un reindirizzamento.

14. Chiamate AJAX

I siti WordPress dinamici effettuano molte chiamate Ajax per inviare e recuperare dati in tempo reale senza caricare la pagina web completa. Query Monitor mostra anche queste richieste insieme ad altre utili informazioni di debug. Queste informazioni aiutano lo sviluppatore a evidenziare eventuali errori.

15. API REST

Se disponi dell'autorizzazione per monitorare Query Monitor, puoi eseguire il debug delle informazioni nell'intestazione di una richiesta API REST WordPress autenticata.

16. Autenticazione

Per impostazione predefinita, solo l'amministratore di un'installazione a sito singolo e il super amministratore di un WordPress Multisito possono visualizzare i log all'interno di Query Monitor. Tuttavia, puoi configurare un cookie di autenticazione per vedere i log anche quando sei loggato come utente.

17. Informativa sulla privacy

WordPress Query Monitor opera con un impegno per la privacy degli utenti. Non raccoglie né trasmette alcun dato a terzi. Le tue informazioni rimangono sicure e riservate quando utilizzi questo strumento.

Come utilizzare il monitoraggio delle query di WordPress?

Dopo aver installato e attivato Query Monitor dalla dashboard di WordPress, devi seguire i passaggi seguenti:

• Vai su Plugin ;
• Fare clic su Plugin installati → Query Monitor ;
• Fare clic su Impostazioni ;
• Fare clic sul pulsante “ Imposta cookie di autenticazione ”.

Ora vediamo in dettaglio ogni sezione del plugin Query Monitor.

Panoramica

La prima scheda ti fornisce una panoramica del tuo sito web. Mostra il tempo di generazione della pagina, il picco di utilizzo della memoria, il tempo di query del database e le query del database.

Interrogazioni sul database

Una query al database viene attivata ogni volta che un utente richiede o tenta di inviare informazioni.

Query Monitor tiene traccia di questa query e la visualizza all'interno dei log in modo che tu, come utente, possa vedere quali query sono state eseguite correttamente e quali no. Consente inoltre di filtrare in base al tipo e al componente della query.

Cache degli oggetti

Il pannello Panoramica in Query Monitor fornisce informazioni sul tuo sito, inclusa la cache degli oggetti. Query Monitor visualizzerà un messaggio se non dispone di un plug-in per la memorizzazione nella cache degli oggetti persistente.

Un plug-in persistente della cache degli oggetti migliora le prestazioni memorizzando nella cache i risultati di operazioni come le query sul database.

Se vedi "Cache degli oggetti esterni non in uso", installa un plug-in di memorizzazione nella cache come Redis o Memcached per la memorizzazione nella cache persistente. Ciò aumenta notevolmente le prestazioni del tuo sito. Consulta il tuo provider di hosting per ricevere assistenza.

Tempi

Il pannello Tempi in Query Monitor registra e visualizza il tempo impiegato e l'utilizzo approssimativo della memoria durante le azioni qm/start e qm/stop per il nome della funzione specificata.

È importante notare che i tempi visualizzati e l'utilizzo della memoria nel pannello Tempi sono approssimativi e devono essere trattati come tali.

Registri

La scheda Log in Query Monitor è una funzionalità avanzata che ti consente di registrare messaggi e variabili, aiutandoti nella risoluzione di problemi tecnici o monitorando il tuo sito per potenziali problemi.

Durante l'installazione iniziale di Query Monitor, la scheda sarà vuota poiché non è stata configurata alcuna variabile di registrazione.

Richiesta

La funzione Richiesta mostra la variabile di query per l'utente corrente ed evidenzia la query personalizzata . Mostra anche le stringhe di query associate presenti all'interno di una richiesta.

Schermata di amministrazione

La sezione della schermata di amministrazione mostra le attività che si svolgono nel pannello di amministrazione di WordPress. Elenca i componenti a cui si accede dal pannello di amministrazione e mostra un errore dovuto all'indisponibilità di qualsiasi file PHP.

Script

Quando visiti la scheda Script all'interno di Query Monitor, elenca tutti gli script e gli stili in coda racchiusi nella richiesta. Evidenzia inoltre qualsiasi script non funzionante o che non risponde a causa di una dipendenza esterna.

Stili

La scheda Stili in Query Monitor funziona in modo simile alla scheda Script, ma invece di mostrare JavaScript, si concentra sui CSS accodati. Questa scheda è utile per eseguire il debug delle prestazioni del sito.

Il caricamento di più fogli di stile, come gli script, contribuisce a rallentare i tempi di caricamento del sito. Utilizzando questa scheda puoi ottimizzare il tuo sito web riducendo il numero di fogli di stile, portando a file più piccoli e meno richieste HTTP.

Ganci e azioni

Gli hook e le azioni sono essenziali in qualsiasi sito WordPress in quanto consentono di creare funzionalità personalizzate utilizzando i controlli predefiniti forniti da WordPress. Tuttavia, ciò a volte può danneggiare il tuo sito Web e la risoluzione dell'errore potrebbe essere faticosa.

Grazie a Query Monitor, che dispone di uno strumento integrato per identificare gli errori causati da hook e azioni, puoi filtrare azioni e hook per core, tema o plugin. Fornisce inoltre il nome completo e il riferimento, facilmente reperibili all'interno del codice per scopi di debug.

Le lingue

Nel caso di un sito web multilingue , la scheda Lingua identifica eventuali file danneggiati o non disponibili e visualizza le impostazioni della lingua.

Chiamate API HTTP

Questa scheda mostra tutte le query lato server e il codice di risposta, il registro di timeout e le richieste non riuscite. È una funzionalità utile in quanto ti consente di vedere la risposta in tempo reale e ti aiuta a eseguire il debug del codice lato server in modo efficiente.

Aggiornamenti temporanei

WordPress può memorizzare nella cache la risposta API nel suo database, poiché alcune API consentono un certo numero di richieste in un dato momento. Aggiornamenti temporanei mostra questi transitori e visualizza anche la dimensione e il componente.

Verifiche di capacità

Per impostazione predefinita, questo è inattivo e può essere attivato inserendo il codice all'interno del file wp-config.php. Controlli di capacità esegue controlli di capacità per ciascun utente sulla pagina e visualizza i parametri e i risultati.

Ambiente

Questa è una panoramica completa dell'ambiente WordPress contenente le sezioni PHP, Database e WordPress. Ogni sezione mostra le informazioni utili dell'ambiente, come la versione di MySQL, il limite di memoria PHP, la versione di WordPress, ecc.

Condizionali

La funzione Condizionali in Query Monitor mostra tutte le condizioni condizionali di WordPress rilevanti per la richiesta corrente, indicando se ciascuna condizionale restituisce “Vero” o “Falso”. Ciò fornisce informazioni dettagliate sulla logica condizionale applicata durante il caricamento della pagina.

Riepilogo

Il plugin WordPress Query Monitor è un potente plugin per il debug, che offre informazioni dettagliate in un formato facilmente comprensibile. Si rivela particolarmente utile per identificare rapidamente l'impatto di plugin, temi o funzioni sulle prestazioni di un sito web.

Il fatto che il plugin Query Monitor integri perfettamente un menu nella barra degli strumenti di amministrazione, fornendo una rapida istantanea della pagina corrente e fornendo dati completi in un pannello dopo la selezione della voce di menu, è una caratteristica degna di nota.

Quali di questi componenti utilizzi spesso per mantenere in salute il tuo sito? Prova questo plugin e faccelo sapere nella sezione commenti qui sotto.