Sfruttare la Cache per pagine più veloci

Per attivare la memorizzazione cache sul proprio sito esiste un modo piuttosto semplice che prevede la modifica dell’.htaccess che è un file di configurazione di Apache Web Server letto dal web server per abilitare o disabilitare funzionalità specifiche per il controllo delle risorse o per la gestione degli URL. Questo file è posizionato nella root (cartella principale del sito).

Questo controllo è molto importante e va applicato a tutte quelle risorse che tendenzialmente possono rimanere invariate nel tempo come ad esempio i fogli stile, i JavaScript o le immagini.

Il metodo prevede di “comunicare” al browser che uno specifico tipo di risorsa, identificata in base alla sua estensione, non dovrà essere scaricata nuovamente per un determinato tempo massimo (es. una settimana).

Questo si ottiene attraverso la modifica del file .htaccess e sfruttando il modulo Apace Expires.

Gestione e caratteristiche del browser caching

Esistono più modi di abilitare le date di scadenza ed alcuni aspetti che è importante conoscere al fine di gestire nel modo corretto questa fondamentale funzionalità del web server.

Utilizzare il Cache-Control

L’intestazione Cache-Control fa parte delle specifiche HTTP/1.1 ed è supportato da tutti gli attuali browser moderni: è quindi il metodo più semplice e raccomandato.

Per abilitare questa funzione su tutte le risorse basta utilizzare questa stringa nel file .htaccess:

Header set Cache-Control "max-age=31536000, public"

Se invece l’intenzione è quella di eseguire un controllo per tipologia di file è pobbile specificare l’estensione:

<filesMatch ".(jpg|jpeg|png|gif|svg|css|js|ttf|eot|woff|woff2)$">

Header set Cache-Control "max-age=31536000, public"

</filesMatch>

Vediamo nello specifico il significato:

• la prima riga filesMatch serve a specificare quali tipi di file devono essere coinvolti nel processo di caching
• Header set genera una header (informazioni prodotte dall’interazione tra il browser e il server) che comunica la scadenza di tutte le richieste HTTP
• la durata viene espressa in secondi, dove 31.536.000 corrispondo ad un anno
• la direttiva public indica che la richiesta è valida principalmente per il browser di un utente o per una CDN; l’alternativa è la direttiva private che permette di archiviare il contenuto in cache solamente al browser dell’utente

Modulo Expires per impostare la scadenza

Se per qualche motivo il primo metodo non fosse utilizzabile, è possibile creare la stessa configurazione con mod_expires.

Le intestazioni di Expires (Apache Module mod_expires) specificano per quanto tempo il browser può utilizzare la risorsa memorizzata nella cache senza controllare se è disponibile una nuova versione.

Dopo che la risorsa è stata scaricata la prima volta, il browser non invierà alcuna richiesta al server finché non raggiunge la data di scadenza impostata o l’utente svuota la cache. Le linee guida di Google suggeriscono di impostare la scadenza su minimo una settimana e, preferibilmente, massimo un anno nel futuro.

Le istruzioni per utilizzare una data di scadenza seguendo le direttive di Google sono le seguenti e vanno inserite nel file .htaccess:

## 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 image/svg+xml "access 1 month"

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"

ExpiresByType application/font-woff "access 1 year"

ExpiresByType application/font-woff2 "access 1 year"

ExpiresByType application/vnd.ms-fontobject "access 1 year"

ExpiresByType application/x-font-ttf "access 1 year"

ExpiresByType font/opentype "access 1 year"

</IfModule>

## EXPIRES CACHING ##

Nell’esempio sopra sono stati specificati tempi differenti per tipologia di risorsa.

Utilizzo di fingerprint dell’URL

Nel caso ci siano risorse che vengono aggiornate o modificate con regolarità, esistono alcuni accorgimenti che permetteranno di “forzare” lo scaricamento del file aggiornato. A tal fine è possibile assegnare un URL univoco a ogni versione della risorsa sfruttando l’URL fingerprint.

Ad esempio, se il foglio stile del sito si chiama style.css e viene modificato prima della sua data di scadenza, possiamo rilascia una versione del file richiamandolo nell’HTML con un parametro appeso dopo il nome come style.css?v=2.

Utilizzare un parametro appeso alla fine dell’URL come ?v=2 è più pratico in quanto evita di dover modificare ogni volta il nome del file (e di conseguenza il codice che lo richiama in tutte le pagine).

Così facendo il browser riceverà l’istruzione di recuperare nuovamente la risorsa perché la considererà nuova. L’utilizzo di questo metodo consente di impostare date di scadenza non ravvicinate anche per le risorse che vengono modificate con maggiore frequenza e di beneficiare quindi di un tempo di caricamento più veloce.

Quando non è possibile intervenire

La memorizzazione della cache funziona solo ed unicamente per le risorse locali, ovvero per tutti i file che risiedono fisicamente nel proprio web hosting. Questo perché il file .htaccess va a modificare le istruzioni eseguite dalla macchina (hosting) che ospita il sito web.

Per questa motivazione è normale trovarsi davanti ad una situazione simile quando si analizza una pagina con strumenti come PageSpeed Insights.

Gli script esterni integrati nelle pagine come quelli di Google Tag Manager, Google Analytics, AddThis o iubenda avranno una scadenza legata alla configurazione del server da cui vengono distribuiti.

Tipicamente il tempo di cache di questi script è molto basso (da pochi minuti a poche ore) dato che devono assicurarsi che eventuali versioni aggiornate siano scaricate immediatamente da chi visita le pagine.

L’unico modo per raggirare questo aspetto, se mai ci fosse una reale ragione di farlo, consiste nello scaricare le librerie esterne manualmente o con una procedura automatica (ad esempio un cronjob) per poi caricarle sul proprio spazio FTP.

Di conseguenza questi file saranno soggetti alle regole inserite nel file .htaccess e rispetteranno le scadenze personalizzate.