Cos'è il caching? 

Il caching si riferisce alla memorizzazione a breve termine di file, come immagini e pagine web, in modo che gli stessi file non debbano essere caricati ogni volta che una pagina viene visualizzata. Questo tipicamente velocizza l'esperienza dell'utente perché riduce la quantità di dati che devono essere caricati. Il caching può avvenire in un certo numero di posti. Per esempio il tuo browser web può memorizzare i file nella cache in modo da non dover scaricare di nuovo tutti i file su una pagina che hai già visitato.

 

Un Content Delivery Network (CDN) come Cloudflare memorizza i file su una scala più ampia, in modo che dopo che un file è stato consultato per conto di un utente, lo stesso file può essere memorizzato sui loro server anche per altri utenti, senza dover fare ulteriori richieste al server di origine. Facendo il caching in questo modo, i CDN possono ridurre il tempo necessario per fornire un file in cache all'utente.

 

Caching, CloudFlare e CSS

Un potenziale problema con il caching è che può portare ad una situazione in cui le modifiche possono essere fatte ad un sito senza che tali modifiche siano immediatamente visibili ai visitatori del sito. Questo può accadere se il sito è stato memorizzato nella cache da un browser web o da un server.

Anche se normalmente ci sono istruzioni per evitare che il caching diventi problematico in questo modo, questo può essere un problema particolare con i fogli di stile a cascata (CSS). Se state usando CloudFlare con il vostro sito, essi metteranno in cache i vostri CSS per molto tempo. Questo significa che se fate delle modifiche al vostro CSS, ci vorrà un po' prima di vederle sul sito dal vivo.

Soluzione per la cache dei CSS

Questo può essere risolto alterando il riferimento al tuo file CSS nell'HTML per la pagina in questione in modo da aggiungere una nuova query string - per esempio alterando "example.css" in "example.css?v=2.2.2". Questo tipicamente fa sì che sia i CDN che i browser web si comportino come se fosse un nuovo file che non hanno scaricato prima - anche se lo hanno fatto.

Nell'esempio dato, CloudFlare metterà in attesa la sua solita assunzione che "example.css" è lo stesso file che ha sempre usato, e farà una richiesta completamente nuova al server di origine per ottenere l'ultima copia del file.

Il server di origine ignorerà la stringa di richiesta "?v=2.2.2", ma fornirà comunque l'ultima versione del file. La prossima volta che "example.css" viene aggiornato, questo può essere cambiato in "example.css?v=2.2.3" - o in qualsiasi numero l'editore preferisca - in modo che CloudFlare ottenga ancora una volta l'ultima versione.

Maggiori dettagli su questa strategia possono essere trovati qui.