Browser caching

theavenger

Browser caching

Ciao ragazzi. Dopo un bel po' di tempo mi ritrovo a guardare alcuni file del mio sito tra cui .htaccess e mi ricordo di aver incollato sto bel pezzo di codice:

# TN - START EXPIRES CACHING #
ExpiresActive On
ExpiresByType text/css "access 1 month"
ExpiresByType text/html "access 1 month"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/svg "access 1 year"
ExpiresByType image/x-icon "access 1 year"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/xhtml-xml "access 1 month"
ExpiresByType application/javascript "access 1 month" 
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresDefault "access 1 month"
# TN - END EXPIRES CACHING #

# TN - BEGIN Cache-Control Headers
<ifModule mod_headers.c>
<filesMatch "\.(ico|jpeg|jpg|png|gif|swf|pdf|svg)$">
Header set Cache-Control "public"
</filesMatch>
<filesMatch "\.(css)$">
Header set Cache-Control "public"
</filesMatch>
<filesMatch "\.(js)$">
Header set Cache-Control "private"
</filesMatch>
<filesMatch "\.(x?html?|php)$">
Header set Cache-Control "private, must-revalidate"
</filesMatch>
</ifModule>
# TN - END Cache-Control Headers

# TN - BEGIN Turn ETags Off
FileETag None
# TN - END Turn ETags Off

Poi mi sono ricordata che il plugin che uso per la cache ha un'opzione chiamata "Allow broswer caching" .

La domanda è: sono la stessa cosa? In più volevo chiedere se davvero questa cache del browser è una funzione utile oppure può risultare controproducente perché non l'ho mai ben capito. Grazie.

Giapox

Ciao,
si sono la stessa cosa, ma con differenze importanti nel controllo e nella gestione.

Il tuo codice .htaccess implementa manualmente due meccanismi fondamentali di caching lato browser:

Expires Headers (ExpiresByType): definisce una data precisa (relativa all’accesso) dopo la quale il file scadrà nel browser e verrà richiesto nuovamente.
Cache-Control Headers (Header set Cache-Control): imposta istruzioni più flessibili e moderne su come il browser deve comportarsi (es. public, private, must-revalidate).

Il tuo plugin di cache (immagino WP-Optimize, o simile), quando abiliti “Allow browser caching”, inserisce in automatico regole simili nel .htaccess, ma:

non ti mostra il codice (è gestito in background);
potrebbe sovrascrivere o entrare in conflitto con quello che hai già scritto a mano;
di solito imposta solo Cache-Control, non Expires.

Quindi stanno lavorando sullo stesso livello (il server Apache risponde con intestazioni HTTP per il browser). Ma se hai già un blocco .htaccess ben fatto, è meglio disattivare la funzione nel plugin, per evitare sovrapposizioni o conflitti.

Il caching del browser è utile e altamente consigliato, se ben configurato. Infatti:

riduce il carico sul server, perché i file statici (immagini, CSS, JS) non vengono scaricati ogni volta;
migliora la velocità percepita dal visitatore, soprattutto su pagine successive o visite di ritorno;
può influenzare positivamente il punteggio PageSpeed e le metriche Core Web Vitals (come Largest Contentful Paint).