Hai bisogno di velocizzare il tuo sito web risolvendo il problema chiamato “Leverage browser caching” comparso nei risultati di analisi di GTmetrix o Google PageSpeed Insights, ma non sai come fare?
Come risolvere “Leverage browser caching”
I noti strumenti di analisi sella velocità di un sito web, come GTmetrix.com o Google PageSpeed Insights, sono rivelano risorse indispensabili per l’ottimizzazione dei siti web, esaminando tutti gli aspetti che possono incidere sui tempi di caricamento del sito e fornendo una panoramica dei possibili miglioramenti.
Ogni possibile problema è segnalato con un preciso messaggio di avviso, come quello che andremo a vedere in questo articolo, chiamato “Leverage browser caching“.
Se anche il tuo sito è afflitto da questo problema, qui di seguito ti aiuterò a scoprire le sue motivazioni e le possibili soluzioni.
Descrizione
Leverage browser caching è un messaggio di avviso generato da Google PageSpeed Insights, oppure in altri tool online similari che prelevano i dati da questa piattaforma.
Nello specifico, questo problema riguarda un aspetto server e non direttamente del sito. Ha inoltre un forte impatto sui tempi di caricamento ed è consigliato risolverlo il prima possibile.
Letteralmente “Leverage browser caching” significa “Sfrutta la memorizzazione della cache del browser”, quindi è già facile capire a cosa sia riferito.
Per capire bene di cosa si tratta c’è da spiegare brevemente in cosa consiste la cache e come viene elaborata dai browser:
Per ridurre i tempi di caricamento delle pagine, i browser vengono istruiti dal server affinché questi vadano a scaricare in locale i file necessari ad aprire una pagina web. Per cache si intende proprio questo, il download in locale dei file ricorrenti e alcune volte immutabili che compongono un sito.
Un esempio semplice: Immagina un foglio di stile CSS unico ed utilizzato per tutte le pagine del sito. Ad ogni visita dell’utente, se il file non venisse scaricato nella cache del browser, questo verrebbe riscaricato ogni qualvolta l’utente dovesse anche solo cambiare pagina.
Questo si traduce in un significativo rallentamento del server e dei tempi di caricamento delle pagine web, poiché il ricorsivo download dei file ha un forte impatto su questi aspetti.
Salvandolo nella cache del browser dunque, si risolve questo problema. Il download resta memorizzato localmente nel dispositivo dell’utente così da poter essere riutilizzato successivamente.
Ma per quanto tempo resta salvato?
I tempi sono variabili e non esiste una scadenza fissa per tutti i file mantenuti nella cache. La scadenza è variabile anche in base alla tipologia di file, ad esempio un file immagine JPG avrà una scadenza più lunga rispetto a un file CSS, in quanto quest’ultimo ha più probabilità di essere modificato nel tempo.
Proprio in qui subentra il “Leverage browser caching” e lo sfruttamento della cache del browser. Infatti è buona regola indicare una durata di mantenimento dei file e stabilire una scadenza al fine di ridurre i tempi di caricamento.
In molte situazioni i siti web che presentano questo problema, hanno file con scadenze molto brevi (meno di una settimana), e questo è visto come un aspetto negativo dell’ottimizzazione del sito.
Durata della cache dei file
Come già detto, per ogni tipologia di file dovrebbe essere stabilita una scadenza dal momento in cui viene scaricata. Al termine di questo periodo verrà cancellata dalla memoria dei browser e scaricati nuovamente.
La durata può essere ridotta o totalmente azzerata se indicato dal server. Molti tool di gestione della cache e plugin WordPress riportano una voce come “Purge cache” o “Delete cache storage” che servono proprio a questo scopo, a cancellare la cache precedentemente salvata.
Questa durata deve essere indicata dal server (come vedremo qui di seguito) con una scadenza ben precisa divisa in base alla categoria di file.
Qui una panoramica della durata della cache:
| Tipologia | Durata |
|---|---|
| file CSS | un mese |
| file JS | un mese |
| immagini | un anno |
| file PDF | un mese o più |
Questi dati possono variare in base a diversi fattori. Nel caso di siti in sviluppo dovranno essere molto brevi (un giorno, una settimana o massimo un mese).
Si sconsiglia di stabilire durate più lunghe di un anno e inferiori a una settimana per siti stabili e già avviati.
Tornando al nostro problema di sfruttamento della cache del browser, come indicato dai tool di analisi, questo si presenta perché il sito ha file con cache a breve scadenza.
In GTmetrix e Google PageSpeed, sono indicati i file interessati, con cache a breve scadenza, prova a migliorare questi. Molto spesso però riguardano risorse esterne al sito.
Non ci resta dunque che risolvere come descritto qui di seguito.
Soluzione
htaccess
Quello che dobbiamo fare per risolvere “Leverage browser caching” è istruire il nostro server per stabilire le scadenze dei file più longeve.
Possiamo fare questo direttamente tramite il nostro file .htaccess e scrivendo le seguenti istruzioni:
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/webp "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresByType video/mp4 "access plus 1 year"
ExpiresByType video/mpeg "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
</IfModule>Se non hai un file htaccess nel server, scopri come crearlo.
Crea un backup del file .htaccess del tuo sito, poi incolla queste righe di codice. Dopodiché elimina la cache del server e successivamente prova nuovamente ad effettuare l’analisi della velocità.
N.B. molte risorse provengono da fonti esterne, come framework, font library e script speciali.
In questi casi puoi risolvere scaricando e ospitando le risorse nel tuo server quando possibile, altrimenti per questi c’è poco da fare.
Cloudflare
Cloudflare è un ottima risorsa per poter gestire la scadenza della cache del sito con un solo click.
Se non hai ancora importato il tuo sito in Cloudflare, fallo ora gratuitamente.
Dal pannello impostazioni della cache di Cloudflare puoi decidere facilmente quanto a lungo dovranno essere mantenuti i file nella cache.
Per farlo:
- Accedi al pannello di amministrazione del tuo sito in Cloudflare;
- Clicca sulla scheda “Caching“;
- Scorri in basso fino alla voce “Browser Cache TTL“;
- Scegli la durata.
Le modifiche verranno attualizzate immediatamente, ma ti consiglio di eliminare la cache tramite il pulsante “Purge Everything” nella scheda “Purge cache” presente nella stessa pagina di Cloudflare.
CMS
Nel caso in cui si utilizzi un CMS come WordPress, basta installare e attivare un plugin specifico a questo scopo, così da evitare l’azione manuale.
Alcuni per WordPress:
Per utenti esperti, dagli stessi plugin è possibile modificare le impostazioni a proprio piacimento e personalizzare la scadenza della cache.
Ora non ti resta che effettuare di nuovo l’analisi della velocità e ottimizzare altri aspetti del sito.
Leggi anche: Risolvere “Defer parsing of JavaScript”
Iscriviti alla nostra Newsletter qui e seguici su Facebook per aggiornamenti!
Articoli recenti:
- Upgrade Scheda Rete. Sostituzione della Realtek RTL8822CE
- Da jQuery a JavaScript Puro: Sfruttare il Potenziale Nativo del Web
- Come Risolvere i Problemi di Connessione Bluetooth al PC
- Guida alla Cybersecurity: Come proteggerti da minacce informatiche
- Come Aggiungere un Dizionario su App Kindle
