Browser Caching - cache del browser

La cache del browser (Browser caching) ti permette di velocizzare il tuo sito web immagazzinando i tuoi file localmente sul browser dell'utente. 

In questo modo, la quantità di dati che il browser dell'utente dovrà scaricare diminuirà notevolmente, così come il numero di richieste HTTP.

NOTA: La cache del browser si può applicare solamente ai file serviti dal tuo proprio dominio, e NON a quelli di terze parti come Facebook, Google, etc.

Come funziona la cache del browser?

Una buona spiegazione è fornita sul sito di  GTMetrix:

La cache del browser etichetta alcune pagine, o parte di esse, come element che devono necessariamente essere aggiornati in intervalli di tempo differenti rispetto agli. Il logo del tuo sito web, per esempio, difficilmente cambierà da un giorno all'altro. Mettendo in cache l'immagine del logo, possiamo dire all'utente del browser di scaricare l'immagine solo una volta alla settimana, per esempio. Ogni visita che l'utente farà nel corso della settimana non richiederà quindi lo scaricamento dell'immagine del logo.

Dire al server web di immagazzinare questi file e di non scaricarli di nuovo durante una seconda visita, rappresenterà un risparmio di tempo per i tuoi utenti e un risparmio di ampiezza di banda per il tuo server web.

Come far leva sul browser caching con WP Rocket

Per abilitare la cache per il browser con  WP Rocket, tutto ciò che devi fare è installarlo e attivarlo. È qui che inizia la magia.
WP Rocket definirà automaticamente delle date di scadenza per certi tipi di file e modificherà il tuo file .htaccess con tutte le regole necessarie.

# Expires headers (for better cache control)
<IfModule mod_expires.c>
ExpiresActive on
# Perhaps better to whitelist expires rules? Perhaps.
ExpiresDefault                          "access plus 1 month"
# cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
ExpiresByType text/cache-manifest       "access plus 0 seconds"
# Your document html
ExpiresByType text/html                 "access plus 0 seconds"
# Data
ExpiresByType text/xml                  "access plus 0 seconds"
ExpiresByType application/xml           "access plus 0 seconds"
ExpiresByType application/json          "access plus 0 seconds"
# Feed
ExpiresByType application/rss+xml       "access plus 1 hour"
ExpiresByType application/atom+xml      "access plus 1 hour"
# Favicon (cannot be renamed)
ExpiresByType image/x-icon              "access plus 1 week"
# Media: images, video, audio
ExpiresByType image/gif                 "access plus 1 month"
ExpiresByType image/png                 "access plus 1 month"
ExpiresByType image/jpeg                "access plus 1 month"
ExpiresByType video/ogg                 "access plus 1 month"
ExpiresByType audio/ogg                 "access plus 1 month"
ExpiresByType video/mp4                 "access plus 1 month"
ExpiresByType video/webm                "access plus 1 month"
# HTC files  (css3pie)
ExpiresByType text/x-component          "access plus 1 month"
# Webfonts
ExpiresByType application/x-font-ttf    "access plus 1 month"
ExpiresByType font/opentype             "access plus 1 month"
ExpiresByType application/x-font-woff   "access plus 1 month"
ExpiresByType image/svg+xml             "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
# CSS and JavaScript
ExpiresByType text/css                  "access plus 1 year"
ExpiresByType application/javascript    "access plus 1 year"
</IfModule>

Possibili cause

Su Apache

Se stai sperimentando problemi riguardanti la cache del browser sul tuo server Apache, assicurati che i moduli expire di Apache ( mod_expires) siano attivi. Puoi controllarlo contattando il tuo hosting provider. Vedi anche questa spiegazione circa il modo in cui abilitare i mod_expires - http://www.absolutelytech.com/2010/08/02/howto-enable-or-disable-modules-in-apache/

Nella linea di comando: 

$ sudo a2enmod expires

E poi riavvia Apache:

$ sudo /etc/init.d/apache2 restart

Su server Windows (IIS)

Se usi Windows server (IIS), non avrai un file .htaccess, che è il file su cui vengono definite le regole del browser caching. In quel caso, usa qualcosa del genere per creare le regole complete per il tuo file di configurazione:
http://www.htaccesstowebconfig.com/

Su Nginx

Se stai usando  Nginx, puoi fare quanto segue: 

location ~* \.(css|js|ico|gif|jpe?g|png|svg|eot|otf|woff|woff2|ttf|ogg)$ {
    expires max; 
}

Alla fine riavvia Nginx con questo comando:

$ service nginx restart