Introduzione alla memorizzazione nella cache HTTP
Sono sicuro che hai notato che quando apri un sito Web per la prima volta, il caricamento richiede del tempo. Tuttavia, quando lo riapri dopo qualche tempo, il sito si presenta molto più velocemente. Immagina se un sito impiegasse lo stesso tempo a caricarsi ogni volta, quanto la navigazione sarebbe lenta. Bene, questo è tutto grazie a un'idea ingegnosa chiamata HTTP Caching. Diamo un'occhiata a cosa è, come funziona e come viene utilizzato per rendere la navigazione in Internet un'esperienza più rapida.
Che cos'è la cache HTTP?
La memorizzazione nella cache HTTP è l'idea di archiviare alcuni dati di uso comune o frequente in un luogo a cui è possibile accedere rapidamente. Con questo, ci sono ottime possibilità che sia possibile accedere ai dati più necessari molto più velocemente perché il computer non deve arrivare troppo lontano per ottenerli.
Nel caso della navigazione Web, la memorizzazione nella cache viene considerata quando il browser Web come Chrome memorizza una copia di un sito Web o di un'app Web nella memoria locale. Una volta memorizzato nella cache un sito Web, un browser Web non dovrà scaricare nuovamente tutti i dati dal server e questo renderà la navigazione molto più veloce.
Ad esempio, una volta scaricato un file CSS di un sito Web, un browser non deve scaricarlo per ogni pagina della sessione. Lo stesso si può dire per molti file JavaScript, immagini (come il logo del sito e le icone dei social media) e persino alcuni contenuti dinamici. La memorizzazione nella cache è abilitata utilizzando le intestazioni della cache.
Intestazioni della cache in HTTP
La cache HTTP ha due principali intestazioni della cache, la prima si chiama "Cache-Control" e la seconda si chiama "Scadenza". Diamo un'occhiata a entrambi:
Cache-Control
Puoi considerare Cache-Control come uno Switch per attivare la memorizzazione nella cache nel browser dell'utente. Una volta aggiunta questa intestazione, abilita la memorizzazione nella cache per tutti i browser Web supportati. Se questa intestazione non è presente, nessun browser manterrà una cache dei contenuti della pagina Web anche se supporta la memorizzazione nella cache.
Il controllo della cache ha due tipi di impostazioni sulla privacy, la prima è pubblica e la seconda è privata.
Nel caso di Public, le risorse possono essere memorizzate nella cache da qualsiasi proxy intermedio come Content Delivery Networks (CDN).
Un'intestazione Cache-Control con risposta privata indicherà al browser che la memorizzazione nella cache verrà eseguita solo per un singolo utente e non per alcun proxy intermedio.
Il valore "max-age" nell'intestazione Cache-Control imposta il tempo per cui il contenuto sarà cache. Questa volta è in secondi.
Cache-Control:public, max-age=31536000
Scade
L'intestazione Expires viene utilizzata quando Cache-Control è presente nel codice. Questa è una semplice intestazione della cache HTTP che imposta una data a partire dalla quale qualsiasi risorsa cache viene considerata non valida. Una volta scaduta la cache e l'utente carica il sito Web, un browser Web richiederà semplicemente nuovamente tutto il contenuto della pagina.
Richieste condizionali
Le intestazioni sopra discusse indicano semplicemente al browser quando recuperare i dati dal server Web. Le richieste condizionali, d'altra parte, indicano al browser come recuperarlo. Le richieste condizionali indicano a un browser come può chiedere al server se la copia dei dati nella cache non è aggiornata.
In questo processo, il browser invia alcuni dati sulle risorse memorizzate nella cache e, dopo aver letto questi dati, il server decide se i dati sono obsoleti o meno.
Richieste basate sul tempo
Nelle richieste basate sul tempo, viene verificato se la risorsa richiesta è stata modificata sul server o meno. Se la copia memorizzata nella cache nel browser è l'ultima, il server restituirà il codice 304.
Per impostare la richiesta condizionale sulla base del tempo, è possibile utilizzare "Ultima modifica" nell'intestazione della risposta.
Cache-Control:public, max-age=25998579
Last-Modified: Fri, 08 Jul 2018 15:25:00 GMT
Content-Based
Nelle richieste basate sul contenuto, l'Hash MD5 (o qualsiasi altra opzione valida) viene controllato sia per la copia del server che per la cache. Questo indica se i dati sono uguali o meno, nel caso in cui siano diversi il checksum MD5 non corrisponderà e il server invierà una nuova copia delle risorse.
Questo viene fatto tramite "ETag" nell'intestazione. Il suo valore è il riassunto delle risorse.
Cache-Control:public, max-age=25998579
ETag: "496d7131f15f0fff99ed5aae”
Visibilità
Quasi tutti i browser moderni includono alcuni strumenti di sviluppo che consentono di controllare risorse, codice sorgente e altri aspetti di una pagina Web. Tra questi, puoi trovare uno strumento per vedere le intestazioni restituite da qualsiasi applicazione.
Su Google Chrome, per visualizzare queste intestazioni, è possibile fare clic con il pulsante destro del mouse su qualsiasi area vuota di una pagina Web e fare clic su "Ispeziona" o premere CTRL + MAIUSC + I per aprire DevTools. In questo strumento, fai clic sulla scheda Rete e premi CRTL + R per ricaricare per vedere tutte le intestazioni della pagina.
Usa casi nella cache HTTP
Di seguito sono riportati alcuni casi di utilizzo della memorizzazione nella cache HTTP che sono i seguenti:
Per beni statici
Per le risorse statiche di una pagina come immagini, file JS e qualsiasi file CSS, puoi scegliere di memorizzare in modo aggressivo i contenuti nella cache. Non dover caricare questi file comporterà un notevole miglioramento delle prestazioni. Per questo caso d'uso, scegli l'intestazione Cache-Control con il valore di età massima di più di un mese o addirittura un anno.
Cache-Control:public; max-age=31536000
Per contenuti dinamici
Nel caso di contenuti dinamici di una pagina, dovrai pensare a te stesso per quali file deve essere memorizzato nella cache del browser e per quanto tempo. Nel caso in cui il contenuto venga modificato frequentemente, sarà necessario assicurarsi che la durata scelta per la memorizzazione nella cache non comporti alcun problema per l'utente.
Memorizzazione nella cache di contenuti privati
Come discusso nella sezione Cache-Control, nel caso in cui il contenuto della pagina sia di natura privata, è possibile impedire che venga memorizzato nella cache da proxy intermedi come CDN aggiungendo "Cache-Control: private" nell'intestazione.
Un altro approccio più sicuro è quello di non memorizzare nella cache alcun contenuto privato.
Implementazione della memorizzazione nella cache HTTP
Ora che sai cos'è la cache HTTP e come funziona, diamo un'occhiata a come puoi implementarlo sul tuo sito web. L'implementazione della memorizzazione nella cache HTTP è leggermente diversa per i diversi tipi di server. Nel nostro caso, diamo un'occhiata all'implementazione della cache tramite il file .htaccess.
Per abilitare la memorizzazione nella cache sul sito, è possibile aggiungere ad esempio le intestazioni nel file .htaccess sul server:
FilesMatch "\.(ico|pdf|flv|jpg.webp|jpeg.webp|png|gif|js|css|swf)$"
Header set Cache-Control "max-age=31536000, public"
/FilesMatch
Quanto sopra memorizzerà nella cache tutto, pdf, flv, jpg.webp e altri formati citati menzionati nel "File Match" per un anno.
Conclusione
La cache HTTP è uno dei trucchi più importanti che rendono la navigazione del tuo sito un'esperienza più rapida per i tuoi visitatori e ora che puoi vedere come funziona, puoi implementarlo sui tuoi siti e app Web per renderli più veloci per i tuoi utenti e per salvare la larghezza di banda del server.
Articoli consigliati
Questa è stata una guida alla memorizzazione nella cache HTTP. Qui abbiamo discusso dell'implementazione, delle richieste condizionali, dell'intestazione della cache e dei casi d'uso di HTTP. Puoi anche consultare i nostri altri articoli suggeriti per saperne di più -
- Scopri cos'è l'HTML
- Come installare Github?
- Che cos'è MapReduce in Hadoop?
- Guida per principianti ai comandi dei nodi
- Cookie HTTP | Sicurezza