Come fare meno richieste HTTP in WordPress

I siti Web che effettuano più richieste HTTP tendono a caricarsi più lentamente. L'ottimizzazione del tuo server per effettuare meno richieste HTTP migliorerà le prestazioni del tuo sito web e la velocità di caricamento complessiva.

In questa guida imparerai come ottimizzare il tuo sito web per fare meno richieste HTTP . Prima di ciò, spieghiamo cosa significano le richieste HTTP e perché dovresti ridurre il numero di richieste elaborate dal tuo server.

Contenuto:

• Cosa sono le richieste HTTP?
• Vantaggi della riduzione delle richieste HTTP
• Come analizzare le richieste HTTP del tuo sito
• Suggerimenti per fare meno richieste HTTP in WordPress
• Conclusione

Cosa sono le richieste HTTP?

HTTP è l'abbreviazione di HyperText Transfer Protocol. È il modo in cui i server comunicano tra loro (es. browser e web server).

Un sito Web contiene vari elementi come file immagine, JavaScript e file CSS. Questi file lavorano insieme per garantire che il sito web venga visualizzato correttamente. Se uno degli elementi non viene caricato correttamente, influirà sul design e sulla funzionalità del sito web.

Per caricare una pagina, il browser Web deve scaricare tutti i file dal server Web. Perché ciò accada, il browser deve effettuare richieste HTTP al server.

Il server si occupa di recuperare la pagina richiesta. Quindi, se è necessario caricare 40 file, il server effettuerà 40 richieste HTTP separate.

Più file hai sul tuo sito web, più richieste HTTP deve fare il tuo server.

Vantaggi della riduzione delle richieste HTTP

Devi fare meno richieste sul tuo server perché riduce i tempi di risposta del server. Se il server deve effettuare molte richieste HTTP, rallenterà il tuo sito web.

Le impostazioni predefinite della maggior parte dei siti Web richiedono che il server scarichi tutti i file necessari prima di visualizzarli sul browser Web dell'utente.

Alcune richieste sono di natura "bloccante". Ciò significa che le altre richieste non verranno eseguite finché la richiesta di blocco non sarà stata completata.

Un sito web lento influisce sull'esperienza dell'utente, il che può portare a un'elevata frequenza di rimbalzo sul tuo sito web. Inoltre, quando la tua frequenza di rimbalzo è alta, influenzerà il posizionamento del tuo sito sui motori di ricerca. Per questo motivo, devi ottimizzare la velocità del tuo sito Web effettuando meno richieste HTTP.

Prima di procedere, è necessario comprendere una regola pratica generale. Se hai più file sul tuo server che devono essere caricati, si tradurrà in più richieste HTTP. Inoltre, se hai file di grandi dimensioni sul tuo server, il tempo di risposta sarà più lungo.

Per effettuare meno richieste HTTP sui siti WordPress, è necessario ridurre il numero di file elaborati dal server. Ma questo da solo potrebbe non ottimizzare completamente la velocità del tuo sito web. Devi anche ridurre le dimensioni del file sul tuo server in modo che possa elaborare le richieste in tempo.

Come analizzare le richieste HTTP del tuo sito

Ora sai cosa sono le richieste HTTP e i vantaggi di ridurre il numero di richieste elaborate dal tuo server.

Prima di andare oltre, dovrai testare il tuo sito web per conoscere il numero di richieste che genera attualmente. Sapere questo in anticipo ti farà sapere se i suggerimenti che applicherai da questa guida hanno un buon impatto sul numero di richieste effettuate dal tuo sito.

Esistono molti strumenti online per testare le richieste HTTP. Gli strumenti di test di velocità GTmetrix e Pingdom possono analizzare i tempi di caricamento del tuo sito web. Alcuni di questi strumenti di test possono anche evidenziare i file che si caricano più lentamente e suggerire possibili correzioni.

Per questo esempio, utilizzeremo lo strumento GTmetrix per analizzare un sito Web di prova. Per iniziare, vai sul sito web di GTmetrix e inserisci l'indirizzo del tuo sito web. Successivamente, fai clic su Analizza .

Lo strumento analizzerà le prestazioni del tuo sito web, incluso il tempo al primo byte e la velocità di caricamento complessiva.

Scorri verso il basso fino alla sezione "Problemi principali". Vedrai problemi che incidono sulle prestazioni del tuo sito web e sulla velocità di caricamento. Da qui, puoi anche vedere le possibili soluzioni ai problemi.

Scorrendo ulteriormente verso il basso fino alla sezione "Dettagli pagina", vedrai la velocità complessiva di caricamento della pagina e il numero totale di richieste. Il sito Web in questo esempio effettua circa 57 richieste durante il caricamento della pagina. Possiamo ridurre il numero di richieste per migliorare le prestazioni del sito web.

Puoi accedere a un rapporto dettagliato sulle singole richieste dalla scheda Waterfall .

Qui vedrai il tempo impiegato da ciascuna richiesta per essere elaborata in dettaglio.

Nella sezione successiva, condivideremo suggerimenti su come effettuare meno richieste. Dopo aver implementato i suggerimenti, analizzeremo nuovamente questo sito di esempio per vedere il miglioramento che abbiamo ottenuto. Iniziamo.

Suggerimenti per fare meno richieste HTTP in WordPress

Ora sai cosa sono le richieste HTTP e come analizzare il numero di richieste effettuate dal tuo server. Successivamente, ti mostreremo 10 modi per ottimizzare il tuo sito Web e ridurre i tempi di risposta del server.

1. Installa un plug-in per la memorizzazione nella cache di WordPress
2. Minimizza i file CSS e JavaScript
3. Combina risorse CSS e JavaScript
4. Ottimizza le tue immagini (rimuovi le immagini non necessarie)
5. Abilita caricamento lento
6. Usa un CDN
7. Sostituisci i plugin pesanti con quelli più leggeri
8. Elimina plugin e temi inutilizzati
9. Riduci gli script di terze parti
10. Rinvia JavaScript di blocco del rendering

Installa un plug-in per la memorizzazione nella cache di WordPress

Prima di iniziare le ottimizzazioni, dovrai installare un plug-in di memorizzazione nella cache sul tuo sito web. Utilizzando un plug-in di memorizzazione nella cache, puoi implementare la maggior parte dei suggerimenti che condividiamo in questa guida.

Sono disponibili molti plugin gratuiti e premium. Plugin premium come WP Rocket ottimizzano alcune parti del tuo sito Web per impostazione predefinita. Tuttavia, è un'opzione premium e non è disponibile per i principianti online.

Useremo un plugin gratuito che si avvicina in termini di funzionalità e caratteristiche. Per seguire i passaggi di questa guida, devi installare il plug-in LiteSpeed ​​Cache sul tuo sito web.

Per questo, accedi alla tua dashboard di amministrazione di WordPress e poi vai su Plugin >> Aggiungi nuovo . Nella casella di ricerca, inserisci "litespeed cache".

Successivamente, dovrai fare clic sul pulsante Installa ora per iniziare l'installazione.

Al termine dell'installazione, il pulsante cambia in "Attiva". Fare clic su questo pulsante per attivare il plug-in.

Minimizza i file CSS e JavaScript

I file CSS e JavaScript sono essenziali per abbellire la tua pagina web e renderla interattiva. Tuttavia, questi file sono spesso di grandi dimensioni e possono aumentare il tempo necessario al server per elaborare le richieste.

Servire una versione minimizzata delle risorse del tuo sito riduce notevolmente le dimensioni dei file. Alcuni temi e plug-in utilizzano già script minimizzati. Tuttavia, devi comunque abilitare questa opzione per ottimizzare ulteriormente le risorse del tuo sito.

Per iniziare, vai su LiteSpeed ​​Cache >> Ottimizzazione della pagina . Dovrai abilitare l'opzione Minimizza CSS nella scheda "Impostazioni CSS".

Inoltre, fai clic sulla scheda Impostazioni JS e abilita l'opzione Minimizza JS .

Combina risorse JavaScript e CSS

I temi e i plug-in di WordPress hanno il loro foglio di stile CSS e file JavaScript separati. Ogni volta che carichi una pagina, il tuo server deve scaricare tutti i file singolarmente prima di mostrare la pagina all'utente.

Il numero di richieste HTTP che il tuo sito deve aumentare man mano che continui a installare plug-in sul tuo sito web. Per risolvere questo problema, devi combinare tutti i file CSS e JavaScript in modo che il tuo server combini più richieste.

Nelle impostazioni di ottimizzazione della pagina LiteSpeed ​​Cache, vai alla scheda Impostazioni CSS e abilita l'opzione che dice "Combina CSS".

Allo stesso modo, vai alla scheda Impostazioni JS e abilita l'opzione Combina JS .

Nota: vedrai un avviso che dice; "Questa opzione potrebbe causare un errore JS o un problema di layout nelle pagine front-end con determinati temi/plugin. L'errore JS può essere trovato dalla console per sviluppatori del browser facendo clic con il pulsante destro del mouse e scegliendo Ispeziona . "

Significa essenzialmente che la combinazione di file JS può causare problemi di compatibilità con alcuni dei tuoi plug-in. Quindi ti consigliamo di visitare il frontend del tuo sito Web dopo aver salvato le modifiche per verificare se tutto funziona come dovrebbe. In caso contrario, puoi disabilitare questa opzione e procedere con il prossimo suggerimento per l'ottimizzazione.

Ottimizza le immagini (rimuovi le immagini non necessarie)

I file multimediali come immagini e video rendono i siti Web visivamente accattivanti. Tuttavia, se non ottimizzi i tuoi file multimediali, ciò influirà sulla tua esperienza utente.

Il caricamento di immagini ad alta risoluzione significa che richiederanno più spazio di archiviazione. E quando il server deve effettuare una richiesta, il tempo di caricamento sarà lungo. Ecco un esempio del test del sito Web di esempio con lo strumento PageSpeed ​​Insights.

Ti consigliamo di comprimere i file multimediali per ottimizzare le tue immagini prima di caricarle sul tuo sito WordPress. Strumenti come Compressor.io possono essere utili per comprimere i file immagine.

Puoi anche utilizzare un plug-in di ottimizzazione delle immagini per comprimere le immagini esistenti sul tuo sito web. Per questo, ti consigliamo di utilizzare il plug-in Smush.

Dopo aver installato e attivato il plug-in sul tuo sito Web, dovrai accedere alla pagina delle impostazioni del plug-in tramite Smush >> Bulk Smush . Vedrai il numero di immagini che devono essere compresse nella sezione "Bulk Smush".

Per iniziare a ottimizzare le tue immagini, dovrai fare clic sul pulsante Bulk Smush Now .

Potrebbe volerci un po' di tempo prima che il plugin completi il ​​processo. Una volta completato, il plug-in ottimizzerà le immagini di grandi dimensioni, riducendo le dimensioni dei file.

Il plug-in mostrerà anche la quantità di spazio di archiviazione che hai salvato dall'ottimizzazione delle tue immagini.

Eliminazione di immagini inutilizzate

Se disponi di file multimediali che non utilizzi più sul tuo sito Web, devi eliminarli dal tuo sito. Per eliminare un'immagine dal tuo sito, vai su Media >> Libreria .

Successivamente, individua l'immagine che desideri eliminare, passa con il mouse sopra l'immagine e seleziona Elimina definitivamente .

Abilita il caricamento lento per effettuare meno richieste HTTP

Il lazy loading è una tecnica che consente alle immagini Web di caricarsi solo quando l'immagine si trova nel viewport dell'utente. Ciò significa che il tuo server caricherà altre risorse essenziali e ritarderà il caricamento delle immagini finché non saranno necessarie.

Useremo il plugin Smush per implementare il lazy loading. Per iniziare, vai su Smush >> Lazy Load , quindi fai clic sul pulsante Attiva per abilitare il caricamento lento sul tuo sito web.

Useremo le opzioni predefinite selezionate dal plugin.

Scorri verso il basso e fai clic su Salva modifiche per aggiornare le modifiche.

Utilizzare un CDN per ridurre le richieste HTTP

CDN è l'abbreviazione di Content Delivery Network. È uno strumento per le prestazioni web che funge da intermediario tra il tuo server e il browser dell'utente.

Migliorano le prestazioni del tuo sito Web offrendo agli utenti una versione memorizzata nella cache del tuo sito in base alla loro posizione.

Inoltre, i CDN possono elaborare le richieste più velocemente grazie ai loro server multipli. Il browser dell'utente risponde più velocemente quando è vicino al server.

Sono disponibili molti provider CDN come MaxCDN e Cloudflare. Alcuni di loro offrono servizi gratuiti per i principianti online.

Puoi controllare il nostro tutorial per imparare come configurare Cloudflare in WordPress . La guida spiega anche come ottenere e configurare SSL gratuito utilizzando Cloudflare.

Sostituisci plugin pesanti con versioni più leggere

Se utilizzi un plug-in che richiede molte risorse per funzionare, ciò influirà sulle prestazioni del tuo sito web.

Abbiamo testato lo stesso sito Web per Core Web Vitals utilizzando lo strumento PageSpeed ​​di Google. Ecco il suggerimento di Google.

Google suggerisce di utilizzare un tema e plug-in ottimizzati per ridurre il tempo di risposta iniziale del server.

Il modo migliore per risolvere questo problema è cercare un plug-in alternativo con un design leggero.

Tuttavia, se la sostituzione del plug-in influirà su funzionalità importanti del tuo sito Web, continua a utilizzare il plug-in e contatta gli sviluppatori del plug-in per informarli del problema di prestazioni.

Elimina plugin e temi inutilizzati

Sebbene inattive, alcune delle risorse di temi e plug-in che non stai utilizzando attivamente vengono comunque caricate quando un utente visita il tuo sito web.

Idealmente, non dovresti lasciare file inattivi sul tuo sito. Oltre ad aumentare le richieste HTTP, spesso occupano spazio sul server e questo può influire sul tempo di caricamento del tuo sito web.

Per eliminare un plugin, accedi alla dashboard di WordPress e poi vai su Plugin >> Plugin installati . Successivamente, fai clic sulla scheda Inattivo .

Successivamente, fai clic su Elimina sotto il plug-in inattivo per rimuoverlo dal tuo sito web.

Segui la stessa procedura per eliminare altri plug-in inutilizzati dal tuo sito web.

Per eliminare un tema dal tuo sito web, vai su Aspetto >> Temi per aprire la pagina dei temi. Successivamente, passa con il mouse sopra il tema inattivo e seleziona Dettagli tema .

Nella pagina successiva, fai clic su Elimina, situato nella parte inferiore della pagina.

Ripeti la stessa procedura per altri temi inattivi sulla tua dashboard.

Riduci gli script di terze parti

Gli script di terze parti sono parti di codice che aggiungi al tag <head> del tuo tema per importare funzionalità da uno script esterno al tuo sito web. Questi possono includere script di Google Analytics, Google Font, Facebook Pixel o reti pubblicitarie di terze parti.

Se gli script di terze parti sono pesanti, aumenterà il numero di richieste HTTP e il tempo di caricamento del tuo sito web.

Supponiamo che tu abbia aggiunto uno script al tuo sito web per verificare la proprietà del dominio su un servizio web. Una volta completata la verifica, dovresti rimuovere questi script se non sono essenziali per le prestazioni del tuo sito web.

Alcuni script di terze parti, tuttavia, sono fondamentali per le prestazioni del tuo sito web. La rimozione di questi script può influire sul design o sulla funzionalità del tuo sito web.

Se gli script sono necessari, ci sono 2 modi per gestirli. Puoi posticipare le risorse di blocco del rendering o caricare gli script esternamente utilizzando Google Tag Manager.

Google Tag Manager fornisce uno spazio di archiviazione per ospitare risorse di terze parti invece di aggiungerle direttamente al tuo sito web. Devi solo aggiungere il codice di Google Tag Manager al tuo sito web.

Dopo aver aggiunto il codice, sarai in grado di aggiungere altri script al tuo account Google Tag e funzionerà perfettamente sul tuo sito web.

Spiegheremo di più sul rinvio di JS nella sezione seguente.

Rinvia gli script di blocco del rendering

Gli script di blocco del rendering sono risorse come codice JavaScript e CSS che impediscono il caricamento rapido delle pagine web. Questi script contengono file di grandi dimensioni e il server deve attendere il loro caricamento prima di visualizzare la pagina web.

Un modo per aggirare questo problema è posticipare il caricamento dello script alla prima richiesta. Il differimento è simile al caricamento lento delle immagini.

Quando ritardi gli script di blocco del rendering, il tuo server caricherà le risorse solo quando l'utente inizia a interagire sulla pagina. Ciò ridurrà il numero di richieste che il tuo server fa per caricare una pagina web.

Il plug-in LiteSpeed ​​Cache ha questa funzione. Per abilitarlo, vai su LiteSpeed ​​Cache >> Ottimizzazione pagina . Successivamente, fai clic sulla scheda Impostazioni JS e scorri verso il basso fino alla sezione "Carica JS differito".

Si consiglia di scegliere l'opzione Ritardata . Questa opzione caricherà le risorse di blocco del rendering non appena l'utente inizia a scorrere. In questo modo non influisce sul tempo di caricamento iniziale della pagina.

Nota: vedrai un avviso che dice; "Questa opzione potrebbe causare un errore JS o un problema di layout nelle pagine front-end con determinati temi/plugin."

Ti consigliamo di visitare il front-end del tuo sito Web dopo aver salvato le modifiche per vedere se influiscono sul layout del tuo sito. Se questa impostazione non è compatibile con il tuo tema, ti consigliamo di disattivarla, in modo che non influisca sull'esperienza dell'utente.

Dopo aver implementato i suggerimenti in questa guida, analizza nuovamente il tuo sito Web utilizzando lo strumento GTmetrix per vedere il numero di richieste effettuate dal tuo server. Ecco il risultato del test dello stesso sito web con GTmetrix.

Abbiamo ridotto le dimensioni della pagina e il numero totale di richieste HTTP da 57 a 15. Si tratta di una riduzione del numero di richieste pari a circa il 73%.

Conclusione

Piccole modifiche al tuo sito Web possono influire notevolmente sulla velocità complessiva del tuo sito Web. Se gli utenti trascorrono meno tempo in attesa del caricamento dei tuoi contenuti, rimarranno più a lungo.

In questa guida ti abbiamo spiegato come funzionano le richieste HTTP e perché devi ottimizzare il tuo sito web per fare meno richieste. Abbiamo quindi condiviso 10 modi per ridurre il numero di richieste elaborate dal tuo server.

Effettuare meno richieste HTTP è un modo per velocizzare il tuo sito. Per ulteriori informazioni, consulta la nostra guida all'ottimizzazione della velocità di WordPress.