Velocizzare il tuo sito: Cache e Compressione della pagina web con Apache.

Terzo appuntamento della serie “Velocizzare il tuo sito”, in questo post andremo a trattare gli argomenti cache e compressione in relazione sopratutto al server Apache in quanto uno dei più utilizzati, queste due tecniche possono influire con grandi percenutali, oltre il 50% sulla velocità di caricamento e risparmio di banda di un pagine web.

Web Cache

Metodo per archiviare temporaneamente e memorizzare documenti HTML e file come immagini, in maniera da poterli richiamare per le successive volte più velocemente sfruttando i dati in memoria, questo permette di ottimizzare i tempi di caricamento fino al 50% rispetto al file di partenza.

La maggiorparte dei browser moderni utilizzano già una cache interna che aiuta la velocità di navigazione su siti web, ma esistono altri metodi per sfruttare al massimo questo tipo di archiviazione.

Cosa inserire nella cache?

Prima di iniziare a realizzare tecnicamente una cache tramite il file .htaccess o chi per esso, è fondamentale pianificare cosa sia utile inserirci e per quanto tempo, questo eviterà di rilasciare al visitatore versioni non aggiornate della propria pagina web cosa che trasformerebbe il buon intento della cache in qualcosa di dannoso, per iniziare si possono fare due distinzioni:

Sito statico: Se il sito da inserire nella cache sarà statico e non si prospettano per questo grossi cambiamenti nel tempo, allora si può pensare di inserire nella cache praticamente tutto il contenuto della pagina web per un discreto tempo prima che questa venga rinfrescata.

Sito Dinamico: Se il sito è dinamico, per esempio un blog basato su WordPress, è molto probabile che all’interno delle pagina web ci siano contenuti che potrebbero cambiare con un ritmo molto frequente, quindi sarebbe opportuno inserirli nella cache per un tempo molto breve o addirittura non inserirli, mentre altri contenuti come icone o plugin che sappiamo che rimarranno invariati per un discreto periodo si potrebbero inserire.

Gestire la cache su Apache con il modulo Mod_expire

Se le pagine web del vostro sito sono ospitate su server Apache potrete utilizzare il modulo mod_expires per gestire al meglio la cache.

Questo modulo è composto da tre comandi principali, ExpiresActive che determina se attivare o meno il modulo, ExpiresDefault che imposta il tempo in cui l’intero documento web ed ogni suo elemento deve essere inserito nella cache ed infine il comando ExpiresByType che svolge lo stesso compito del comando precedente ma con la possibilità di specificare il tempo di cache per ogni elemento della pagina web.

Per determinare il tempo di durata della cache si può usare l’istruzione A+numero dove il numero è espresso in secondi, guarda l’esempio sotto:

<ifmodule mod_expires.c>

# Questo comando decide se attivare o disattivare il modulo e quindi la cache
ExpiresActive On

# Il comando ExpiresDefault se presente imposta un tempo di cache che vale per l'intero
# documento e tutto ciò che si trova al suo interno
ExpiresDefault A300

# Volendo puoi usare il comando ExpiresByType per specificare diversi tipi per quanto tempo
# devono essere inseriti nella cache.
ExpiresByType application/x-javascript A3600  #3600 secondi corrispondono ad 1 ora.
ExpiresByType text/css A3600
ExpiresByType image/gif A604800
ExpiresByType video/x-flv A604800
ExpiresByType application/pdf A604800
ExpiresByType text/html A300
</ifmodule>

per uno studio più approfondito di come e cosa impostare nella cache vi rimando alla guida di Google “Optimizing cache”

Compressione delle pagine web

La compressione dei dati di una pagina web tramite algoritmi o piccoli software di compressione può portare alla diminuizione del documento anche del70%, i vantaggi sono essenzialmente due:

• Risparmo di banda da parte del server.
• Aumento velocità caricamento della pagina web in quanto compressa.

Esistono diversi modi per eseguire una compressione Bzip, 7zip etc. oltre al famoso Gzip che andremo ad analizzare in specifico.

Usare Gzip

Piccolo software gratuito con lo scopo di di comprimere dati, esiste la possiblità di applicarlo alla compressione di pagine web.

Perchè la modalità Gzip venga attivata per documenti web devono coesistere due variabili fondamentali:

• Supporto del browser, ormai tutti i browser moderni
• Supporto del server, un esempio di connubio perfetto con Gzip è Apache.

Come agisce un contenuto compresso con Gzip.

• 1 Il browser avvisa il server che accetta la compressione Gzip.
• 2 Il server risponde positivamente e avvisa il browser che sta per mandare un contenuto compresso.
• 3 Il contenuto compresso viene mandato al browser e renderizzato.

Ecco come spiegano in maniera più intuitiva questo processo quelli di Google.

Per testare il corretto svolgimento di questo processo potete poi testare la pagina web in questione con il tool Gzip test

Attivare Gzip su Apache

Per attivare la compressione delle pagine web tramite su Apache dobbiamo prima verificare quale versione del server ospita le nostre pagine web e sapere se accetta la compressione tramite Gzip o tramite altri metodi, per venire a conoscenza di ciò vi consiglio di domandare al vostro provider (per esempio Aruba).

Venuti a conoscenza di queste informazioni dobbiamo attivare il modulo mod_gizp per le versioni del server da 1.3 fino a 1.9, ormai obsoltete, e invece il module mod_deflate dalle versioni 2.0 in poi (Attualmente a Dicembre 2011 l’ultima versione è la 2.2 ed in fase beta la 2.3), una volta scoperta la versione possiamo attivare la compressione dal file .htaccess con questo codice:

# INIZIO Gzip
<ifmodule mod_deflate.c>

      # Per selezionare quali file si vogliono comprimere tramite G-zip
      # Puoi usare il comando AddOutputFilterByType impostando poi il tipo di file

      AddOutputFilterByType DEFLATE text/plain
      AddOutputFilterByType DEFLATE text/html
      AddOutputFilterByType DEFLATE text/xml
      AddOutputFilterByType DEFLATE text/css
      AddOutputFilterByType DEFLATE application/xml
      AddOutputFilterByType DEFLATE application/xhtml+xml
      AddOutputFilterByType DEFLATE application/rss+xml
      AddOutputFilterByType DEFLATE application/javascript
      AddOutputFilterByType DEFLATE application/x-javascript

      # Il livello di compressione dei file deve essere un valore tra 1 e 9
      # dove 9 è il massimo della compressione.
      DeflateCompressionLevel 9

      # Alcuni browser hanno dei problemi con la compressione degli elementi
      # quindi è consigliabile esentarli dalla istruzione cache
      # tramite l'uso dell'istruzione BrowserMatch
      BrowserMatch ^Mozilla/4 gzip-only-text/html
      BrowserMatch ^Mozilla/4\.0[678] no-gzip
      BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

      DeflateFilterNote Input instream
      DeflateFilterNote Output outstream
      DeflateFilterNote Ratio ratio
      LogFormat '"%r" %{outstream}n/%{instream}n (%{ratio}n%%)' deflate

</ifmodule>
# FINE Gzip

Leggi gli altri articoli della serie:

1. Introduzione e Strumenti utili.
2. CSS e Javascript.
3. Cache e Compressione delle pagine.
4. Lavorare con le immagini.
5. Articoli e risorse utili.

Condividi questo articolo:

• Tweet

Info sull' autore:

Nato a Bologna, mi occupo della realizzazione grafica e dello sviluppo front-end di siti web e sono il fondatore di questo blog. Se vuoi segnalare qualche problema o hai qualche richiesta particolare invia una mail tramite il modulo contatti.
Leggi gli altri articoli di Francesco