| Migliorare la velocità di caricamento di Joomla 1.5 |
|
scritto da Federico Capoano La performance di un sito web è un fattore importante che in alcuni casi, se trascurato, può rallentare sensibilmente la crescita di un sito o un attività sul web. Chiunque abbia un pò di dimestichezza con PHP e MySQL sa che un CMS come Joomla può peccare se si parla di velocità di caricamento o performance. Inoltre tutti i web designer esperti di xHTML, CSS, Javascript e grafica sanno che moltissimi template per Joomla non tengono sufficientemente in considerazione le best practices volte ad ottenere delle performance decenti.
Snail Vector by ekamanganese on Devian Art Dato che l'ottimizzazione delle performance richiede conoscenze tecniche approfondite ed elevata attenzione per i dettagli è una pratica di rifinitura che può essere eseguita solo da quei pochi eletti che, armati di pazienza e buona volontà , vogliono ottenere il massimo dal proprio sito web. Contenuti presenti in questo articolo
Dinamica del caricamento di un sito JoomlaJoomla effettua diverse query complesse al database ad ogni caricamento di pagina, questo significa che quante più sono le estensioni attive tanto più il numero delle query aumenterà . Spieghiamo questo concetto con uno schema.
Visitatore ->
richiesta http ->
Joomla - il codice php fa al database le seguenti domande:
quali sono i plugin attivi per questa pagina?
forniscimi le informazioni dei plugin attivi.
qual'è il contenuto di questa pagina?
nel caso il contenuto fosse quello di un componente, forniscimi le informazioni sul componente.
quali sono i moduli attivi per questa pagina?
forniscimi le informazioni di ogni modulo attivo.
qual'è il template attivo per questa pagina?
l'utente è loggato? Se sì, forniscimi il suo username.
<- MySQL elabora le richieste e restituisce i dati
<- Joomla elabora i dati forniti da MySQL e restituisce i dati all'utente sotto forma di pagina HTML
L'utente scarica la pagina HTML, il css, le immagini e le eventuali istruzioni javascript
Questo schema è una semplificazione delle richieste più importanti che avvengono durante il caricamento. Ipotizziamo di avere una situazione in cui il discorso performance sia stato perso di vista, immaginiamo quindi un sito in cui vengano caricate molte estensioni diverse che recuperano informazioni dal database. Immaginiamo che il template del sito non sia ottimizzato e di avere qualcosa come 50 utenti attivi nello stesso momento. Ciò significherebbe la ripetizione di quello schema, moltiplicato per 50 volte, eseguito ad ogni caricamento di pagina. Il risultato? Il numero delle query al database MySQL non è solo l'unico fattore che gioca un ruolo importante nella determinazione delle performance generali di un sito realizzato con Joomla, ci sono molti altri fattori da tenere in considerazione. Vediamo quali sono i fattori più importanti su cui concentrarsi per migliorare sensibilmente la velocità di caricamento di un sito basato su Joomla 1.5. Molti dei consigli di seguito descritti sono adatti a qualsiasi altro CMS o metodo di sviluppo di siti web. Ottimizzare il templateIl template è la base di partenza dell'ottimizzazione, questo vale universalmente per ogni sito web, a prescindere che si utilizzi Joomla, Drupal, altri CMS, framework o altri metodi. Qualità del codice (x)HTMLI template scritti con codice snello, pulito, semplice e chiaro dal punto di vista semantico permettono di tenere basso il peso delle pagine HTML generate da Joomla. Ridurre al minimo le richieste HTTP per le immagini caricate via cssOgni immagine contenuta in un template viene scaricata singolarmente tramite una richiesta HTTP. Ogni richiesta HTTP viene inviata al server, quest'ultimo impiega un certo numero di millisecondi per rispondere ad ogni richiesta. Una soluzione tecnica d'aiuto: gli Sprite CSSLa celebre tecnica degli Sprite consiste nel raggruppare il maggior numero possibile di immagini in un solo file, JPEG o PNG.
Solitamente un design complesso non permette di raggruppare tutte le immagini in una sola JPEG o una sola PNG a causa di esigenze diverse dei formati. Il risultato finale dipende dalla complessità del design ma in genere cercando di raggruppare il maggior numero possibile di immagini nel minor numero di file si ottengono degli ottimi risultati. Peso delle immaginiTenere d'occhio il peso delle immagini è un'altra buona abitudine da considerare per ottenere un tempo di caricamento decente. Questo non riguarda solamente le immagini del template, ma tutte le immagini presenti sul nostro sito. Segnalo alcuni strumenti e risorse esterne per approfondire il tema:
Ridurre il numero delle richieste HTTP per css e javascriptLo stesso discorso fatto per le immagini vale per qualsiasi altro file esterno, css e javascript. Purtroppo il discorso può farsi complicato, vediamone i motivi:
In alcuni casi intervenire manualmente per raggruppare i file css e javascript non è una cattiva idea, ma fortunatamente esistono delle estensioni che fanno questo automaticamente per noi e che vedremo più avanti nell'articolo. Peso del file cssSe sviluppate i vostri template personalmente, potete utilizzare alcuni accorgimenti in fase di sviluppo per risparmiare bytes nel css grazie all'uso di CSS shorthands, ovvero scorciatoie CSS. Ad esempio, il seguente snippet: .elemento{ margin-top: 5px; margin-right: 10px; margin-bottom: 5px; margin-left: 10px; } .sfondo{ background-color: #FFFFFF; background-image: url(../images/immagine.png) background-repeat: no-repeat background-position: 0 0; background-attachment: scroll } può essere riassunto in due sole righe: .elemento { margin: 5px 10px } .sfondo { background: #FFF url(../images/immagine.png) no-repeat scroll 0 0 }
Potremmo risparmiare ulteriore spazio comprimendo il file, eliminando spazi superflui, punti e virgola finali e tenendo tutto il codice su una riga, ma così facendo il codice diverrebbe illegibile e renderemmo il nostro lavoro di manutenzione un incubo. Peso e complessità dei file JavascriptL'uso di javascript per il miglioramento della "user experience" sul nostro sito è un'ottima pratica, ma l'esagerazione porta sempre a degli squilibri. Utilizzare strumenti come Javascript compressor per ridurre il peso dei vostri file javascript è una buona idea. Spostare i file Javascript in fondo al codice htmlÈ risaputo che durante il caricamento del codice javascript, il browser non esegue altri download e non prosegue con il rendering della pagina. Questo significa che nel caso il codice javascript inserito nel tag <head> abbia una peso non indifferente (ad esempio la libreria mootools o lo script di Google Analytics) il browser non procederà nel caricamento del resto della pagina finchè il codice javascript non sarà scaricato completamente. Per approfondire questo argomento consiglio la lettura dell'articolo: High Performance Web Sites: Rule 6 – Move Scripts to the Bottom Disabilitare mootools.js e caption.js laddove non servono
Caricare la libreria mootools e lo script caption.js in tutte le pagine del sito è un inutile spreco di risorse e perdita di tempo. Nell'articolo "Disabilitare Mootools e caption.js dal frontend di Joomla 1.5" ho illustrato due semplici tecniche che permettono di disattivare questi due script dove non servono. Accorgimenti nella configurazione di JoomlaLavorando sulla configurazione di Joomla e dei singole estensioni base si possono ottenere dei miglioramenti nella velocità di caricamento notevoli. Attivare la compressione GZIPGZip è un metodo di compressione open source molto efficace supportato dalla maggior parte dei piani di hosting linux. Utilizzando Gzip possiamo ridurre drasticamente (in media tra il 70% e il 90%) il peso delle pagine HTML generate da Joomla. Attivare la compressione GZip in Joomla è semplicissimo, basta aprire la "Configurazione globale" del nostro sito alla scheda "Server" e settare la voce "Compressione Pagine GZip" a "Sì" e salvere le modifiche.
Dopo aver salvato le modifiche testate il vostro sito per controllare che la compressione GZIP sia correttamente supportata e tutto funzioni correttamente. Nel caso riceviate un errore di codifica è molto probabile che il "mod_deflate" o il "mod_gzip" non siano attivi sul vostro server. Se il vostro sito è ospitato su uno shared hosting contattate il vostro fornitore chiedendo spiegazioni. Per testare velocemente e senza sforzo l'efficacia della compressione Gzip sul vostro sito potete utilizzare Gzip Test Tool: non dovrete fare altro che inserire l'URL del vostro sito e far partire il test. Rimarrete stupiti dal rapporto di compressione, osservate il risultato del test fatto su Joomlashow:
L'utilizzo della compressione Gzip determinerà un uso maggiore di risorse da parte del processore del server. Sui piani d'hosting non particolarmente performanti l'uso di questa funzionalità potrebbe risultare controproducente in quanto i server potrebbero non sopportare l'uso extra di risorse. Attivare la cache di JoomlaL'attivazione della cache di Joomla è un'operazione facile e permette di ridurre drasticamente l'uso di risorse del server. Per attivare la cache di Joomla aprite la "Configurazione Globale" del vostro sito e alla cartella "Sistema" impostate la voce "Cache" a "Sì". La voce "Tempo cache" indica la validità della cache e solitamente può essere settata tra i 15 e i 60 minuti, questo fattore dipende anche dalla frequenza con cui i contenuti del vostro sito cambiano. Maggiore è la frequenza di aggiornamento e cambiamento dei contenuti e minore dovrà essere il tempo di validità della cache.
A livello tecnico, la Cache di Joomla agisce effettuando il caching degli oggetti recuperati dal database, che possono essere moduli, contenuti, risultati di funzioni e così via. Questo concetto è utile per capire la differenza tra questo tipo di cache ed il plugin "Page Cache" spiegato di seguito. Il plugin "Page Cache", cos'è e come attivarloIl plugin "Page Cache" o anche solo "Cache" è presente in tutte le installazioni default di Joomla 1.5 e agisce effettuando il caching delle pagine generate da Joomla.
Se i file statici del vostro sito non cambiano con molta frequenza potete attivare l'opzione "Utilizza Browser Caching" e settare la "Durata vita Cache" tra i 15 e i 60 minuti.
La funzionalità di questo plugin è molto potente, ma attualmente in Joomla 1.5 è abbastanza limitata in quanto non c'è modo di specificare quali pagine devono essere cachate e quali no. Qualora vi accorgiate di non aver bisogno che un particolare modulo venga cachato da "Page Cache" provate ad aprire la sua configurazione in "Estensioni > Gestione moduli" e cercate un opzione che permetta di disabilitare il caching, solitamente il parametro è chiamato "Caching" o "Cache" e il valore da settare è "Never" o "Mai".
L'utilizzo di questo plugin in combinazione con la Cache globale di Joomla può fare una differenza notevole nel miglioramento della velocità di caricamento di Joomla 1.5. Limitare moduli e plugin attiviConsiderando che Joomla impiega del tempo (seppur minimo) per determinare quali plugin / moduli sono attivi in ogni pagina e che per recuperare i loro parametri, disattivare i moduli ed i plugin che non sono strettamente necessari è un'ottima pratica. Controllate le pagine "Gestione Moduli" e "Gestione Plugin" nel backend del vostro sito e disattivate i plugin che non sono strettamente necessari. Fate seguire queste operazioni da un testing adeguato, potrebbe sempre succedere di disabilitare plugin che svolgono ruoli importanti che dovranno essere riabilitati. Accorgimenti riguardanti estensioni di terze partiDopo aver lavorato sulla configurazione e le impostazioni di base di Joomla è bene analizzare l'impatto sulle performance di estensioni di terze parti installate (o eventualmente da installare) sui vostri siti. Scegliere con parsimonia le estensioni da utilizzareDevo rivelare un dettaglio spinoso riguardo le estensioni di terze parti per Joomla: dopo un analisi al codice della maggior parte delle estensioni che ho utilizzato sono rimasto deluso dalla loro scarsa qualità e la loro scarsa (se non nulla) considerazione di principi quali accessibilità , performance, pulizia del codice e aderenza al modello MVC di Joomla 1.5. Purtroppo la maggior parte delle estensioni vengono disegnate per soddisfare determinate necessità funzionali, per essere facili da installare ed utilizzare, dimenticando spesso tutto il resto. Questo a mio avviso è un problema gravissimo ed è il motivo per cui moltissimi sviluppatori e web designer passano poi ad altri CMS e altri metodi per realizzare siti web. "Non è tutto oro ciò che brilla", "l'apparenza inganna" e sebbene un'estensione possa sembrare perfettamente funzionante al momento dell'installazione, della configurazione e del testing iniziale, le aspettative dei perfezionisti sono destinate a rimanere deluse in moltissimi casi. A mio avviso, i problemi più gravi che si possono incontrare sono i seguenti:
Per tutti questi motivi vi consiglio di scegliere con cura le estensioni che volete utilizzare. Installatele, testatele ed analizzatene il codice prima di cominciarle ad usare in ambiente di produzione. Evitare Bridge tra Joomla e altri CMSSolitamente gli script o i CMS che vengono integrati tramite bridge in Joomla sono sistemi indipendenti dotati di un framework, un database, una gestione degli utenti ed un template proprio. Nella maggior parte dei casi l'utilizzo di un bridge determina una penalizzazione nelle performance rispetto ad una soluzione integrata con Joomla. Evitare sistemi di statistiche in PHP e MYSQLI sistemi di statistiche in PHP e MySQL possono aumentare spropositatamente l'uso di risorse della CPU del server e il numero delle query al database MySQL. L'utilizzo di sistemi di statistiche che analizzano il log del server sono meno invasivi e più indicati per chi non ha esigenze di monitorazione troppo impegnative. SEF: testing e caching necessariLa riscrittura delle URL o SEF URL è una funzionalità essenziale per migliorare l'accessibilità ed il ranking SEO di un sito Joomla. Il SEF di base di Joomla è notevole, impostando il parametro "Utilizza mod_rewrite" su "No" si possono ottenere dei buoni risultati con un gran risparmio di risorse del Server, ma per molti (me compreso) le URL generate non sono abbastanza belle e non si ha un controllo sufficiente su di esse. I componenti di terze parti come sh404SEF o Artio JoomSEF sono dotati di caching interno che permette di ridurre sensibilmente il numero delle query al database MySQL e l'uso di risorse del server. Inoltre le configurazioni di questi componenti contengono delle spiegazioni su alcune funzionalità che se attive possono rallentare il caricamento del sito. Vi consiglio di analizzare attentamente la configurazione del vostro componente, testarla insistentemente e ricercare la miglior combinazione che faccia al caso vostro. Estensioni aggiuntive che aiutano a migliorare le performanceAlcune estensioni aggiuntive possono aiutarci nell'ottimizzare la velocità di caricamento di Joomla 1.5. CssJsCompress (e alternative)Il plugin CssJsCompress è abbastanza semplice da usare e dispone di alcune funzionalità molto interessanti:
Un uso corretto di questo plugin può avere come risultato una drastica diminuzione della banda utilizzata dal server e una diminuzione del tempo necessario al caricamento delle pagine dovuto ad una diminuzione notevole del peso di file CSS e Javascript. Per ottenere un buon risultato è necesario testare il plugin escludendo eventuali file javascript o css che non devono essere aggregati, ad esempio potreste non volere che la libreria di Google Analytics venga aggregata con il file javascript del vostro template. Esistono anche diverse alternative, a mio parere, al momento in cui sto scrivendo questo articolo, le due migliori sono:
Query CacheQuery Cache è un componente sviluppato da Anthony Ferrara, uno dei coordinatori del team di sviluppo di Joomla, particolarmente esperto in materia di ottimizzazione delle performance di Joomla. Questo componente effettua il caching delle query che vengono fatte al database MySQL contribuendo a diminuire l'uso di risorse della CPU e del database MySQL. IL COMPONENTE QUERY CACHE NON FUNZIONA CON IL LEGACY MODE ATTIVO. SE INSTALLATE IL COMPONENTE CON IL LEGACY MODE ATTIVATO IL VOSTRO SITO SARÀ DANNEGGIATO. Per installare e configurare correttamente il componente seguite queste istruzioni:
Dopo aver seguito queste istruzioni ed aver testato il sito dovreste notare la comparsa di diversi file nella cartella "components/com_qcache/cache". OptimizeTables: ottimizzare le tabelle MySQLOttimizzare le tabelle MySQL periodicamente può aiutare a migliorare le performance per i siti contenenti un gran numero di contenuti e record nel database. L'operazione può essere effettuata manualmente via phpMyAdmin, oppure può essere svolta automaticamente dal plugin OptimizeTables. Magie con .htaccessE' possibile ottimizzare le performance di Joomla 1.5 (e di qualsiasi altro sito web ospitato su un server linux / apache che permetta l'uso di file .htaccess) attraverso alcune semplici istruzioni da inserire nel vostro file .htaccess. Queste istruzioni potrebbero non funzionare sui server dove i moduli "mod_expires" e "mod_header" di apache non sono installati o attivati. # Prevenire Image Hot Linking # Cambiare ilvostrosito\.com con la vostra URL reale, mantenendo il backslash \, ad esempio !joomlashow\.it RewriteCond %{REQUEST_FILENAME} .(gif|jpe?g|png)$ [NC] RewriteCond %{HTTP_REFERER} !^$ RewriteCond %{HTTP_REFERER} !ilvostrosito.com [NC] RewriteCond %{HTTP_REFERER} !bloglines.com [NC] RewriteCond %{HTTP_REFERER} !google. [NC] RewriteCond %{HTTP_REFERER} !yahoo. [NC] RewriteCond %{HTTP_REFERER} !search?q=cache [NC] RewriteRule (.*) http://127.0.0.1 [R,NC,L] # Settare gli Expires headers e cache control <IfModule mod_expires.c> ExpiresActive On ExpiresDefault A600 ExpiresByType image/x-icon A2592000 ExpiresByType application/x-javascript A604800 ExpiresByType text/css A604800 ExpiresByType image/gif A2592000 ExpiresByType image/png A2592000 ExpiresByType image/x-icon A2592000 ExpiresByType image/jpeg A2592000 ExpiresByType image/jpg A2592000 ExpiresByType image/jpeg A2592000 ExpiresByType text/plain A86400 ExpiresByType application/x-shockwave-flash A2592000 ExpiresByType video/x-flv A2592000 ExpiresByType application/pdf A2592000 ExpiresByType text/html A600 <filesMatch "\\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$"> Header set Cache-Control "max-age=2592000, public" Header unset Last-Modified </filesMatch> <filesMatch "\\.(css)$"> Header set Cache-Control "max-age=604800, public" Header unset Last-Modified </filesMatch> <filesMatch "\\.(js)$"> Header set Cache-Control "max-age=216000, private" Header unset Last-Modified </filesMatch> <filesMatch "\\.(xml|txt)$"> Header set Cache-Control "max-age=216000, public, must-revalidate" </filesMatch> <filesMatch "\\.(html|htm|php)$"> Header set Cache-Control "max-age=1, private, must-revalidate" </filesMatch> # Disattivare ETags Header unset ETag </IfModule> # Disattivare gli ETags FileETag none Vediamo velocemente e sinteticamente il significato di queste righe di codice. Prevenire l' "image hotlinking"Queste istruzioni fanno in modo che le immagini risiedenti sul vostro sito non possano essere caricate da altri siti attraverso il tag html <img>, proteggendo così la banda del vostro server da inutili sprechi. Le istruzioni ammettono qualche eccezione in caso di alcuni motori di ricerca. Per far funzionare correttamente queste istruzioni dovete cambiare la stringa "ilvostrosito\.com" con la vostra URL reale, mantenendo il backslash \, ad esempio !joomlashow\.it nel caso di www.joomlashow.it. Per approfondire questo tema consiglio la lettura dell'articolo Preventing image hotlinking: an improved tutorial Settare "Expires Header", "Cache-control"Queste istruzioni aiutano a rendere la comunicazione tra il server e la cache del browser più esplicita ed efficace per cui un visitatore che ha già visualizzato e scaricato i file del sito (css, javascript, immagini, ecc.) non invierà nessuna richiesta http al server ma recupererà i file direttamente dalla cache del browser. Per approfondire questo tema consiglio la lettura dell'articolo Speed up sites with htaccess caching. Disattivare gli ETagsGli ETags sono stati disegnati per controllare se i file nella cache del browser coincidono con quelli presenti sul server. Secondo Yahoo gli ETags non funzionano come dovrebbero a causa di differenze di implementazione tra i server e perciò ne consiglia la disattivazione. Per approfondire questo tema consiglio la lettura dell'articolo Best Practices for Speeding Up Your Web Site: Configure ETags e Speed Tips: Turn Off ETags Analizzare i risultati dell'ottimizzazioneNonostante mettendo in pratica i suggerimenti illustrati in questo articolo si dovrebbero notare ad occhio dei netti miglioramenti nella velocità di caricamento di Joomla, esistono diversi strumenti di misura delle performance che possono aiutarvi ad effettuare un'analisi tecnica più dettagliata. I due strumenti più celebri sono YSlow e Google Page Speed, entrambi disponibili come estensioni aggiuntive di Firefox. ConclusioneBisogna ammettere che dopo un lavoro di rifinitura così impegnativo, ricevere come premio una "A" da YSlow è una bella ricompensa.
Hai trovato questo articolo utile o interessante? Non perdere i nostri prossimi post, iscriviti ai nostri Feeds RSS Aiutaci a spargere la voce segnalando l'articolo su altri Social Networks!
|
| Pros. > |
|---|
