Cos’è il browser caching
Quando un browser richiama una pagina web, molte risorse vengono inviate dal server e servite al client per visualzzare correttamente la pagina web richiesta.
Tra i file richiesti abbiamo file HTML, immagini, video, file Javascript, file CSS, etc.
Molti di questi file non variano nel tempo e benché il contenuto della pagina possa cambiare anche spesso, molti di questi file rimangono invariati (ad esempio i file di style, i file di immagini quali loghi, icone, etc.).
Il caching lato client (o browser caching) consente ai browser di salvare in locale molte delle risorse per cercare di utilizzarle in futuro. La tecnologia del browser caching consente quindi di confrontare il contenuto della cache locale (quindi di quello che si è salvato precentemente) con quanto viene richiesto di volta in volta. Se il browser rileva dei file in locale validi il cui contenuto risulta uguale a quello online, evita di scaricarlo.
La tecnica quindi del browser caching consente di scaricare solo le risorse modificate rispetto a quelle salvate nella cache in locale, con un notevole risparmio in termini di velocità, di larghezza di banda, carichi del server, etc.
Qui sotto un esempio di confronto di performance tra un sito che fa caching locale sul browser e senza. Valutate voi.
Come implementare il browser caching sul vostro sito in WordPress
Per implementare il browser caching sul vostro sito in WordPress si potrebbe scaricare magari un plugin ad hoc, ma perché fare questo quando basta semplicemente modificare un file? Ricordatevi bene che ogni plugin è un probabile generatore di problemi di sicurezza e compatibilità. Evitate di instllare solo plugin per pigrizia!
Per configurare il browser caching basta aprire il vostro client FTP ed individuare il file .htaccess nella root del sito.
Scaricando il file .htaccess, inserire le seguenti righe all’inizio del file.
## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
</IfModule>
## EXPIRES CACHING ##Quella indicata è una configurazione base dove si utilizza come data di scadenza della risorsa un anno per le immagini ed un mese per i documenti (PDF, Flash), a partire dalla data di primo salvataggio in locale.
Una volta modificato il file .htaccess, salvare e ricaricare il file in FTP. A questo punto potete verificare che il browser caching sia correttamente configurato utilizzando uno dei molti strumenti online. Noi consigliamo sicuramente https://gtmetrix.com un ottimo strumento gratuito che fornisce anche molte informazioni sulle performance e su come migliorarle.
