Configurare la cache del browser tramite file htaccess.
(Aggiornato il 10/02/2024)
Configurare la cache del browser tramite file htaccess consente di migliorare la velocità di caricamento del sito impostando una data di scadenza per dei file specifici e per le intestazioni di risposta HTTP, in questo modo avendo impostato la cache del browser verranno fornite risorse statiche già memorizzate e salvate in precedenza evitando di essere richiamate ogni volta dal client al web server.
Come sempre ricordo che stiamo parlando di server linux e apache e prima di fare qualsiasi modifica al file htaccess salvate una copia originale.
Le due direttive principali per configurare la cache del browser sono mod_headers e mod_expires, con la prima direttiva, secondo nostre esigenze possiamo controllare e modificare le richieste HTTP e le intestazioni di risposta, mentre con la seconda possiamo impostare scadenze e controllare la cache.
Se non hai pratica in configurazioni linux e apache e stai pensando che la questione sia abbastanza complessa ti confermo che è proprio cosi, ad ogni modo qui di seguito ti fornisco una configurazione preimpostata con le direttive per configurare la cache del browser che ti basterà semplicemente copiare e incollare all’interno del file htaccess.
Le direttive fornite sono configurate in modo “generale” cioè vanno bene per qualsiasi sito WordPress che utilizzi linux e apache e non devi modificare niente a meno che tu non stia cercando delle configurazioni particolari a seconda delle esigenze.
Tiene presente che il codice per configurare la cache del browser sotto riportato è lo stesso uguale identico che utilizzo anche io per questo sito.
DIRETTIVE HTACCESS DA INSERIRE:
Il modulo mod_deflatefornisce contenuto compresso al browser e specifica su quale contenuto e file agire. (Disponibile articolo che spiega come impostare la compressione gzip tramite mod_deflate)
Modulo mod_headers che come potete notare specifica varie impostazioni di cache-control e su quali file agiscono.
Modulo mod_expires che specifica il tempo di scadenza della cache per contenuto e file specificati.
Direttive di scadenza per le intestazioni Cache-Control/Expires/max-age.
Direttive BrowserMatch per disattivare la compressione per browser obsoleti.
Direttive Pragma disabilitate per intestazioni di risposta del server.
Direttive ETag disabilitate.
Queste direttive sono da valutare attentamente in caso stiate utilizzando eventuali plugin per il caching sia lato client che lato server.
Per eventuali direttive personalizzate per configurare la cache del browser potete fare riferimento all’elenco dei moduli di apache HTTP Server.
Vedere anche l’elenco completo delle direttive apache.
DIRETTIVE HTACCESS CACHE BROWSER:
Il codice che segue va inserito subito dopo il codice di default presente all’interno del file htaccess facendo attenzione a non lasciare spazi vuoti e non modificare eventuali direttive già presenti.
La scadenza delle intestazioni è impostata al 11 dicembre 2013, da reimpostare una volta scaduta.
Le parole presenti dopo il simbolo del cancelletto (#) non vengono interpretate dal browser e servono come indentazione del codice.
# DEFLATE compressione # Compress HTML, CSS, JavaScript, Text, XML and fonts AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE application/x-font AddOutputFilterByType DEFLATE application/x-font-opentype AddOutputFilterByType DEFLATE application/x-font-otf AddOutputFilterByType DEFLATE application/x-font-truetype AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE font/opentype AddOutputFilterByType DEFLATE font/otf AddOutputFilterByType DEFLATE font/ttf AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE image/x-icon AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/xml # Remove browser bugs (only needed for really old browsers) BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSIE !no-gzip !gzip-only-text/html Header append Vary User-Agent # FINE DEFLATE Header unset Pragma FileETag None Header unset ETag Header set Cache-Control "public" Header set Expires "Mon, 02 Sep 2018 05:00:00 GMT" Header set Cache-Control "max-age=172800, must-revalidate" Header unset Last-Modified # Caching -- mod_headers # 1 Anno = 29030400s = Never Expires <filesmatch "\.(ico)$"=""> Header set Cache-Control "max-age=29030400, public" # 1 Mese = 2419200s <filesmatch "\.(css|pdf|flv|jpg|jpeg|png|gif|swf)$"=""> Header set Cache-Control "max-age=2419200, public" <filesmatch "\.(bmp|css|flv|gif|ico|jpg|jpeg|js|pdf|png|svg|swf|tif|tiff)$"=""> Header set Last-Modified "Mon, 02 Sep 2019 00:00:00 GMT" # 2.5 Giorni = 216000s <filesmatch "\.(js)$"=""> Header set Cache-Control "max-age=650000, private" <filesmatch "\.(xml|txt)$"=""> Header set Cache-Control "max-age=216000, public, must-revalidate" # 5 minuti = 300s <filesmatch "\.(html|htm)$"=""> Header set Cache-Control "max-age=300, private, must-revalidate" # Disabilitare cache per script e altri file dinamici <filesmatch "\.(pl|php|cgi|spl|scgi|fcgi)$"=""> Header unset Cache-Control # Caching -- mod_expires ExpiresActive On ExpiresDefault A604800 ExpiresByType image/x-icon A29030400 ExpiresByType application/pdf A2419200 ExpiresByType image/gif A2419200 ExpiresByType image/png A2419200 ExpiresByType image/jpg A2419200 ExpiresByType image/jpeg A2419200 ExpiresByType text/css A2419200 ExpiresByType application/x-javascript A216000 ExpiresByType text/javascript A216000 ExpiresByType text/plain A216000 ExpiresByType text/html A300 <filesmatch "\.(pl|php|cgi|spl|scgi|fcgi)$"=""> ExpiresActive Off
Se pensi che questo articolo ti sia stato utile e valga la pena di ringraziarmi, considera di condividerlo, grazie :-)
Vietata la Riproduzione.
Io devo modificare il mio primo .htaccess su WP!! Vorrei un’illuminazione: Posso aggiungere manualmente il “module mod_expires” dopo i “mod_rewrite” e il “deflate” aggiunto precedentemente da wp fastest cache plugin? non so proprio cosa possa accadere se sbaglio qualcosa…
Al massimo faccio upload tramite ftp del vecchio giusto? Grazie e complimenti intanto!
Salve Giovanni, se nel file htaccess non sono presenti impostazioni “mod_expires” inserite da un eventuale plugin puoi aggiungere quelle che vuoi secondo esigenze, prima di fare qualsiasi modifica al file salvati l’originale e in caso sbagliassi qualcosa ti barsterà ricaricare il file originale e tutto tornerà come prima. Saluti.
Salve, veramente ottima guida! Io ora ho una pagina creata da un plugin che crea dei disegni degli utenti ed è in continuo aggiornamento quindi non visualizzo i cambiamenti prima di un mese. Vorrei sapere se è possibile tramite htaccess impostare l’expires solo per quella pagina in particolare oppure devo modificare solo il default directive? ora è settato appunto a un mese. Saluti
Salve Pata, stai utilizzando qualche plugin oppure solo impostazioni tramite il file htaccess ? …
io utilizzo wp fastest cache plugin per i css ecc. ma per l’expires ho impostato io manualmente i termini a un mese grazie anche ai consigli di questo sito! Quello che non capisco è come fare per impostare l’aggiornamento continuo per questa pagina in particolare sul mio sito in cui si può lasciare un disegno online. Posso impostare un expires giornaliero solo per questa pagina? patakosmos.com/wp-content/plugins/dooodl/s/
apprezzerei tantissimo un consiglio
grazie intanto
Salve pata, sarebbe possibile impostare tramite file htaccess il problema è che non tutti i browser rilevano le impostazioni più complesse in modo uguale, ad esempio potrebbe funzionare per chrome ma non per explorer, visto che utilizzi un plugin potresti utilizzarlo per gestire tutte le configurazioni incluse impostazioni expires e utilizzare gli short code disponibili del plugin per impedire il caching di specifiche pagine. Ciao.
grazie mille proverò a reimpostare la cosa. Gentilissimo.
Ciao, il mio sito è su Linux Aruba, ho provato ad utilizzare questo codice nell’htaccess ma non capisco se funziona. Su pagespeed il punteggio complessivo è salito da 76 a 83 ma il messaggio “Sfrutta il caching del browser” compare ancora però non più in rosso ma in giallo..
– Per quanto riguarda la data di scadenza intestazioni devo cambiarla e posticiparla a quando?
-Questa data “Header set Last-Modified “Wed, 11 Dec 2013 00:00:00 GMT”, invece, non va modificata?
grazie mille in anticpo
Salve Nicola, se il risultato dell’analisi non compare più in rosso ma in giallo sicuramente vuol dire che “funziona”, senza vedere un’analisi del sito è impossibile dirti cosa ancora non viene inserito nel caching, potrebbero essere file javascript, plugin social ecc… !
La data va modificata per impostare la durata del caching “senza scadenza” ad esempio fino a dicembre 2104.
Per un’analisi più dettagliata ti consiglio di utilizzare gtmetrix oppure pingodm tools in questo articolo puoi trovare un elenco dei migliori siti di strumenti gratuiti per analizzare siti internet inclusi i due appena citati. Saluti.
Ciao, guida molto utile, tuttavia ho ancora dei problemi credo derivati dal fatto che carico alcune risorse in modo asincrono, in particolare file js e css attraverso lo script head.js, infatti dopo l’implementazione delle tue direttive htaccess continuo a ricevere notifiche da google page speed riguardo l’utilizzo del caching del browser. C’è un modo per risolvere la cosa? grazie.
Salve Frank, bhe dipende anche cosa ti segnala page speed e che tipo di “risorse” sono, se derivano da plugin e/o script esterni come ad esempio il codice di traking di analytics e altri. Dipende se utilizzi anche un plugin per il caching come ad esempio WP Super Cache e soprattutto come è configurato. Ti consiglierei prima di tutto di eseguire una scansione anche con pingodom tools dove oltre a fornire i tempi di caricamento del sito, alla tabella di analisi “Performance Grade” ti viene specificato anche cosa non è configurato per caching.
Potrebbe essere anche semplicemente un’impostazione di cache con scadenza troppo breve. Qui trovi un elenco di strumenti gratuiti per analizzare siti internet (consiglio anche GTmetrix).
Se il sito ha dei buoni tempi di caricamento e le risorse segnalate non sono eccessive non mi preoccuperei più di tanto. Saluti.
Buongiorno e grazie per l’utile guida.
Ho usato il codice via .htaccess su diversi siti, trovandone sempre beneficio.
Solo su uno però, pure inserendo lo stesso codice, non funziona: provando poi con il test gidnetwork.com/tools/gzip-test.php vedo che la compressione non è stata abilitata… da cosa può dipendere?
Ciao Stefania, dovrei vedere il codice inserito per capire… hai inserito anche le direttive “mod_deflate” per la compressione ? Ciao.
Sì,
copio e incollo qui di seguito il codice inserito nell’htaccess:
Ciao Stefania, da quello che vedo dal codice mancano tutti i tag di apertura e chiusura, quindi prova a fare riferimento alla pagina apposita dove trovi il codice da inserire per la compressione gzip.
In caso dovresti inviarmi il file completo via email. Per la scansione prova ad utilizzare gtmetrix.com e fammi sapere. Ciao.
Buongiorno, bellissima guida ma con il suo metodo(come con altri tentativi) mi trovo sempre a fronteggiare lo stesso errore che CREDO sia dato dalla browser cache.
Dopo un tot di pagine caricate nel sito mi viene restituita sempre la stessa pagina (una di quelle caricate in precedenza) anche se l’url nella barra effettivamente risulta cambiato. Non capisco cosa generi questo problema. Può aiutarmi? Grazie ancora.
Ciao Grinder, difficile capire senza visualizzare la pagina. Prima di tutto se hai un plugin per la cache, ad esempio wp super cache dovresti cancellare tutta la cache, poi dovresti cancellare tutti i cookie del browser che utilizzi per visualizzare la pagina.
Se il problema si ripresenta prova ad utilizzare un browser differente che non hai mai utilizzato per visualizzare il sito o la pagina, se il problema si ripresenta prova a sostituire il file htaccess solo con le impostazioni di default, con il file htaccess con le impostazioni di default ricancella eventuali file di cache generati da plugin per la cache (se ne hai uno installato) cancella i cookie del browser e controlla ancora se il problema è risolto. Ciao.
Grazie per la risposta veloce, ho provato con i cookie e per un attimo il problema sembrava risolto, poi si è subito ripresentato. In pratica girando tra le varie pagine sembra non esserci problema poi provando a caricare 5 o 6 gallerie della sezione EVENTI, alla quinta ha iniziato a rifarmi vedere una galleria aperta in precedenza (sarò stato chiaro? ).
Questo è il sito balestrieridelmandraccio.it se vuole dare un occhiata.
Ho W3 Total cache attivo , ma in questo momento la sezione Browser Cache è disattivata, quindi non c’è nessun codice scritto nell htcacess se non quello preso da questa pagina e quello iniziale di default.
Ciao Grinder, andare cosi a “tentativi” non se ne può venire a capo, bisogna andare a ritroso procedendo per gradi, oltretutto potrebbe anche essere una modifica che hai fatto in questi ultimi periodi, magari un plugin nuovo, ad esempio quello per i cookie e altro.
Se il problema si è ripresentato dopo la cancellazione dei cookie il problema o è nel file htaccess o nel plugin W3 Total cache. Che nel plugin W3 Total cache non sia attiva la sezione browser cache non vuol dire che non siano stati salvati file di cache e/o non ci siano ancora file di cache vecchi.
A volte è necessario anche disinstallare completamente un plugin per essere sicuri al 100% che non interferisca. Quindi come ti ripeto, CANCELLA tutti i file di cache su W3 Total cache, riporta le funzioni di default nel file htaccess e poi cancella i cookie del browser e controlla se il problema persiste.
Se tutte queste operazioni (eseguite in modo corretto) non portano ad individuare il problema si va oltre, quindi si inizia a disattivare tutti i plugin uno per volta…! Ciao.
Ciao Fausto, grazie ancora per tutte le dritte. Dopo aver cancellato, disabilitato, riportato a default e fatto prove su prove ho scoperto che l’istruzione che dava problemi alle mie pagine era questa “ExpiresByType text/html A300”. Non riesco a capire il perchè.
Grazie ancora.
Ciao Grinder, le impostazione riportate su questo articolo sono le stesse che utilizzo io per il mio sito quindi nel tuo caso può dipendere da innumerevoli fattori, magari anche da che tipo di hosting utilizzi ed eventuali configurazioni, l’importante è aver individuato il problema. Ciao.
Ciao Fausto e complimenti per l’ottimo lavoro! è da qualche giorno che provo a “Sfruttare il caching del browser” secondo indicazioni di PageSpeed di Google ma senza risultati…anzi! Ho provato ad inserire nel mio htaccess il seguente modulo:
## EXPIRES CACHING ##
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 text/css “access 1 month”
ExpiresByType text/html “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”
ExpiresDefault “access 1 month”
## EXPIRES CACHING ##
Il risultato è che il Caching sembra funzionare, migliorando il punteggio su PageSpeed, ma il sito va in blocco. Nello specifico non funzionano più i link interni nella barra dei menù. Non viene caricata la pagina selezionata.
Non ho ancora inserito in blocco i codici da te suggeriti perchè ho notato che hai inserito le istruzioni per la compressione gzip che io avevo già inserito nel mio htaccess.
Da cosa può dipendere questo blocco dei link? Grazie 1000 in anticipo
A titolo informativo il test di Pingdom mi da 66/100 e nella sezione Performance Grade, mi da:
Combine external JavaScript – 0
Combine external CSS – 0
Parallelize downloads across hostnames – 0
Leverage browser caching – 34
Remove query strings from static resources – 81
e tutto superiore a 84 nei valori successivi.
Salve Marco, grazie dei complimenti. Se quando inserisci il tuo codice in seguito hai qualcosa che non funziona è evidente che sbagli qualcosa, mettere mano al file htaccess è una questione delicata e bisogna stare attenti a come e cosa si modifica, inoltre fornirti un aiuto avendo solo uno spezzone di codice del file htaccess è impossibile, potrebbero esserci altre funzioni impostate da altri plugin ed esempio plugin per il caching.
Se pensi di essere in grado, copia le funzioni dall’articolo le inserisci nel file htaccess facendo attenzione a non cancellare quelle di default, ricordandoti di modificare le due date 2014. Eventualmente inviami il file htaccess tramite email. Ciao.
Ciao Fausto, si ho installato il plugin Wp SuperCache ed ho notato infatti che è intervenuto nella scrittura sull’htacces. A questo punto non so che fare…cancellare il plugin e inserire le funzioni da te suggerite o andare a tentativi cancellando altre parti del codice. Io cmq ti invio il file htaccess per email così anche tu avrai una visione globale del tutto. Grazie 1000 dell’aiuto..6 grande!
Ciao Fausto
complimenti per indicazioni, le ho trovate utilissime e mi hanno risolto parecchi problemi.
Non hai una guida per risolvere il classico “above-the-fold”?
Salve Marco grazie dei complimenti, mi fa piacere l’articolo ti abbia aiutato. Per il discorso “above-the-fold” non c’è molto da dire o per quanto mi ricguarda non c’è niente di complicato, si tratta di inserire all’inizio della pagina, quindi quello che vedrà l’utente di primo impatto senza necessità di scrollare la pagina, contenuto con parole che chiariscono subito di cosa tratterà l’articolo in questione. Ciao.
Ciao! Innanzitutto colgo l’occasione per augurare a te e a tutti i lettori di questa pagina una Buona Pasqua, se pure in ritardo!
Venendo a noi, ho inserito le regole per la cache sul mio file .taccess, copiandole pari La compressione mi funziona perfettamente, ma non il leverage browsing cache, risultato determinato dai files immagine.
Ciò vale sia per Page Speed, sia per Yslow, il quale mi segnala addirittura una F 0 per quanto riguarda la voce: “Add expires Header”. Sono già intervenuto cambiando le date, sia di fine, portandola a lunedì 1 gennaio 2018, sia riferita all’ultima modifica, inserendo mercoledì 16 marzo 2016. Successivamente ho portato ad un anno la scadenza per i file immagine, senza per altro ottenere risultati.
Se può servire, uso wp-super cache in modalità php, mentre per l’ottimizzazione sfrutto Better WordPress Minify, plugin non potentissimo, ma che non modifica l’assetto del sito. Per altri particolari sono qui! Grazie e complimenti ancora.
Salve Roberto grazie degli auguri ricambio. Per il tuo problema ti posso dire subito che è impossibile aiutarti senza capire come è configurato il sito, cosa è installato e se quello che è installato è configurato correttamente. Prova ad eseguire le scansioni anche con altri tools (vedi pingdom) e prova a ripeterle più volte per vedere se i risultati cambiano e si “sistemano”.
Per sicurezza, prima di eseguire le scansioni, cancella tutta la cache generata da wp super cache.