Guida semplice alle prestazioni di un sito web Joomla: come migliorarle

Prestazioni e ottimizzazione per i siti web sono importantissimi e vanno considerati quando andiamo a realizzare un sito web o a fare un restyling e dobbiamo tenere conto che circa un 20% dei visitatori provengono da mobile. Visitatori mobili spesso utilizzano connessioni più lente di quanto richiesto dal tuo sito web per caricare velocemente.

Una volta che un nuovo sito web è finito, distribuito e tutto funziona correttamente, può rallentare sempre di più con l'aumento di traffico dei visitatori.

Cosa si può fare in questi casi?
Come è possibile migliorare le prestazioni e ottimizzare il sito web Apache?
Vediamo se riusciamo a trovare le giuste risposte.


Gli strumenti
Ci sono alcuni strumenti che rendono il nostro lavoro molto più semplice e sistematico. È possibile visualizzare l'output di questi strumenti per i vostri siti web e di ricevere avvisi immediati.

Google page speed
Lo strumento di Google per analizzare le prestazioni del sito web è il più user-friendly. Vi è una estensione di Firefox e Chrome che permette di usare in modo molto semplice questo strumento.

Yahoo YSlow
Lo strumento di Yahoo per lo stesso scopo, è più appropriato per gli utenti avanzati. Come per il Google page speed è disponibile un’estensione per Firefox e Chrome.

Le regole semplici
Gli strumenti di cui sopra permettono di analizzare il sito web e controllare una serie di semplici regole. Ecco le regole di base e come si possono fare i miglioramenti e le dovute ottimizzazioni.

Come sempre, è molto importante fare un backup prima di apportare modifiche, soprattutto se si lavora su un sito web di produzione.

Gzip
GZip è un metodo per comprimere le pagine inviate al client dal server. La compressione rende il lavoro lato server più duro, ma la compressione è efficace, e rende le pagine molto più piccole. Questa opzione nella configurazione globale nella scheda server dell’amministrazione di Joomla. Se l'opzione non è abilitata, il server Apache deve sostenerlo. Consultare il servizio di hosting.

Cache
Cache è un altro approccio semplice ma è davvero efficace per migliorare le prestazioni. La cache può essere eseguita sul server o lato client.

Lato server
Per abilitare la cache sul lato server, si può fare facilmente in Joomla. Andate in estensioni-> plugins. Ricerca di Sistema - cache, e assicurarsi che questo plugin sia abilitato. Poi si va nella scheda di configurazione-> sistema globale, e contrassegnare la cache come ON e conservatore. Conservatore è sufficiente per la maggior parte dei siti web. Si consiglia di utilizzare una cache aggressiva solo se abbiamo brutte prestazioni. Il tempo della cache dipende dalla frequenza degli aggiornamenti dei contenuti del sito. Ad esempio, se il contenuto del sito web viene aggiornato meno di una volta al giorno, si può mettere questo valore per un paio d'ore, altrimenti lasciare il valore predefinito.

Lato client
Nel ottimizzazione lato client si parla principalmente di immagini, file CSS e JavaScript, che vengono scaricati ogni volta che si visita una pagina web. Poiché la maggior parte di questi file vengono modificati solo ogni tanto, siamo in grado di indicare al client di memorizzare nella cache i file. Per abilitare la cache lato client, dobbiamo avvalerci del file htaccess (che si trova nella directory root di Joomla). Questo dichiarerà come il client deve memorizzare i file nella cache, invece di scaricarli su ogni visita.

Andiamo ad aggiungere il contenuto magia al file htaccess:
# 1 YEAR
<FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$">
Header set Cache-Control "max-age=29030400, public"
</FilesMatch>
# 1 WEEK
<FilesMatch "\.(jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
# 3 HOUR
<FilesMatch "\.(txt|xml|js|css)$">
Header set Cache-Control "max-age=10800"
</FilesMatch>
# NEVER CACHE
<FilesMatch "\.(html|htm|php|cgi|pl)$">
Header set Cache-Control "max-age=0, private, no-store, no-cache, must-revalidate"
</FilesMatch>

Ogni direttiva indica al client di memorizzare tipi di file in un arco di tempo diverso.
La dichiarazione di cui sopra utilizza un'estensione Apache chiamato mod_header. In alternativa, è possibile utilizzare un altro interno, chiamato mod_expires e contiene altre direttive:

ExpiresActive On
ExpiresDefault A0
# 1 YEAR
<FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$">
ExpiresDefault A29030400
</FilesMatch>
# 1 WEEK
<FilesMatch "\.(jpg|jpeg|png|gif|swf)$">
ExpiresDefault A604800
</FilesMatch>
# 3 HOUR
<FilesMatch "\.(txt|xml|js|css)$">
ExpiresDefault A10800"
</FilesMatch>

Se non si sa quale estensione viene installato sul vostro host, chiedete al vostro fornitore di servizi di hosting.

Compressione
Oltre alla compressione Gzip abbiamo visto in precedenza, possiamo aggiungere la compressione dei file di testo, come ad esempio javascript e css. Basta aggiungere le prossime direttive allo stesso file htaccess:

  # Compressione dei 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

C’è da considerare che questo metodo utilizza l'estensione mod_deflate di Apache. Assicurarsi di avere installato questa estensione.

Minify & Merge
L'ultimo metodo che useremo è la riduzione del file CSS e Javascript. Probabilmente vi chiederete, cosa sta per Minify & Merge?
I file CSS e JS sono comunemente indicati linea per linea, il che rende più facile la vita del programmatore e rende più efficace la costruzione di siti web. Tuttavia, il browser, che è “stupido”, è possibile utilizzare lo stesso file con una sola linea, mentre concatenando tutte le linee in una sola linea e senza commenti (che sono utili solo per gli esseri umani). Questa riduzione salva i file in dimensioni più piccole e rende il download molto più veloce. Probabilmente si parlerà di pochi KB da risparmiare, ma, se si inizia ad avere 10.000 utenti simultanei consente di risparmiare centinaia di megabyte di download per il vostro server.

Rispetto al minify, il merge permette di unificare tutti i file js in un unico file js, e fa lo stesso per i css. L'azione di unione consente di risparmiare risorse.