Audit di compressione e cache

Un breve scambio negli header

A ogni richiesta, il browser annuncia i formati di compressione che sa decomprimere:

Accept-Encoding: gzip, deflate, br, zstd

Un server con la compressione attiva ne sceglie uno, riduce il file ed etichetta la risposta Content-Encoding: br (Brotli) o gzip. HTML, CSS e JavaScript sono testo ripetitivo e di solito perdono dal 70 all’85% del loro peso. I file JPEG, PNG, WebP, AVIF e WOFF2 sono già compressi dal loro stesso formato, quindi inviarli così come sono è la cosa giusta.

La cache è l’altra metà. Cache-Control: max-age=31536000 permette al browser di riusare un file per un anno senza chiedere niente. Scaduta la durata, un header ETag o Last-Modified permette al browser di fare una domanda leggera, «è cambiato?», e il server risponde 304 Not Modified senza corpo.

Quali file vengono analizzati

Partiamo dalla pagina stessa, dopo i redirect, poi prendiamo i file dello stesso dominio registrato trovati nel suo HTML: fino a quattro fogli di stile, cinque script, tre immagini e due font. I posti rimasti liberi vanno ai file restanti, per quindici in tutto, e i font citati nei tuoi fogli di stile vengono aggiunti se c’è spazio. Ogni file viene richiesto come farebbe un browser, offrendo Brotli e gzip, su HTTP/2 quando il server lo supporta.

I file su altri domini, come Google Fonts o uno script di statistiche, restano fuori. I loro header non dipendono da te.

Come viene giudicata ogni colonna

Compressione

Verde quando un file di testo arriva con un Content-Encoding. Rosso quando la pagina, o un file di testo sopra i 20 KB, arriva non compresso. Arancione per i file non compressi più piccoli, e non contestiamo niente ai file sotto 1 KB. Per ogni file non compresso, l’audit comprime da sé il contenuto con gzip e mostra la dimensione che otterresti. Immagini e font WOFF2 riportano «non necessario».

Cache

La durata viene da max-age, oppure da Expires quando manca max-age. Un foglio di stile, uno script, un’immagine o un font viene segnalato se non ha durata o ne ha una inferiore a sette giorni. no-store e no-cache contano come zero. La pagina HTML è mostrata solo a titolo informativo, con un avviso se può essere conservata per più di un’ora, perché chi torna sul sito potrebbe vedere una versione superata.

Protocollo

Superato con HTTP/2, che porta tutti i file su una sola connessione in parallelo. HTTP/3 viene rilevato tramite l’header alt-svc, dove un server annuncia h3.

Risparmio

Byte trasferiti rispetto ai byte decompressi per l’intero campione.

Un sito che usa gzip ovunque riceve una nota su Brotli, che rende i file di testo più piccoli del 15-20% circa. Consideralo un miglioramento da pianificare. Senza Brotli non c’è nulla di sbagliato.

Configurarlo senza rischi

Quando c’è qualcosa da correggere, il risultato include blocchi pronti per Apache e nginx. Dietro una CDN come Cloudflare, la compressione avviene sull’edge e le durate della cache sono un’impostazione del pannello. Su WordPress, i plugin di cache scrivono le stesse regole al posto tuo.

Per la durata, una sola regola decide tutto. Una cache lunga è sicura solo se l’indirizzo del file cambia ogni volta che cambia il suo contenuto. Gli strumenti di build producono nomi come app.3f9a1c.js, e WordPress aggiunge ?ver=6.8. File di questo tipo possono avere:

Cache-Control: public, max-age=31536000, immutable

Per i file con un nome fisso conviene restare tra una settimana e un mese. Per l’HTML, Cache-Control: no-cache conserva una copia e la verifica con il server prima di ogni uso.

Per confermare una modifica da terminale:

curl -sI -H "Accept-Encoding: br, gzip" https://example.com/ | grep -iE "content-encoding|cache-control"

Cosa l’audit non considera

È un campione di quindici file da una sola pagina, quindi un problema che riguarda solo un altro template può sfuggire. Non offre Zstandard. Legge max-age e ignora s-maxage, che riguarda solo le cache condivise. E salta i file che la tua CDN serve da un dominio diverso. Ogni file viene scaricato fino a 3 MB.