Velocizzare WordPress con CloudFlare CDN e W3 Total Cache del 76%, case study
Visto che la velocità è sempre più importante nel web, mi sono chiesto: qual è il metodo più semplice, rapido ed economico per velocizzare il caricamento del proprio blog?
Sicuramente la distribuzione dei contenuti tramite una simil CDN, nello specifico CloudFlare, porta ad avere un netto miglioramento con il minimo sforzo, almeno fin quando si parla di server condivisi. Ah dimenticavo, senza spendere nulla!
L’idea
Il mio blog risiede attualmente su hosting condiviso BlueHost, con server in America. Il numero medio di visitatori unici giornalieri su tutto il dominio robertoiacono.it è di 1700, e (mannaggia a me :)) è anche bello pieno di immagini, quindi non proprio leggero per un server condiviso.
Il tempo di caricamento misurato con Pingdom (ovviamente i risultati sono molto variabili, quindi ho cercato di prendere un valore medio) sulla homepage il giorno 14 Febbraio 2013 è di 4.23 secondi. Sono tanti?
Sicuramente non sono pochi! Un buon valore si dovrebbe aggirare attorno ai 2 secondi.
Cosa posso fare per far diminuire questo tempo?
- Se il server deve gestire tutto il traffico da solo, quindi con una buona dose di stress, sarà meno performante rispetto ad un server uguale ma poco stressato. E allora, perchè non far distribuire i contenuti statici (immagini, JS, CSS) da altri server alleggerendo il mio? Con CloudFlare, si può 🙂
- Visto che il blog è in italiano, il target di riferimento sono gli italiani… e siccome il server è in America, ogni volta che un lettore vuole leggere una pagina del mio blog, parte una richiesta dall’Italia, attraversa (a nuoto) l’oceano, arriva in America, prende i contenuti, riattraversa l’oceano (sempre a nuoto) e ritorna in Italia. Questo, pur parlando di millisecondi, introduce un leggero aumento del tempo di caricamento rispetto ad avere un server in Italia. E allora, perchè non far distribuire i contenuti statici da un server che sia il più vicino possibile al lettore? Con CloudFlare, si può 🙂
- Siamo sicuri che tutti gli utenti che navigano sul blog, e che quindi richiedono delle risorse al server, siano utenti reali? Oppure ci potrebbero essere anche degli utenti malintenzionati (quindi inutili, oltre che pericolosi)?
Sicuramente ci saranno anche questo tipo di utenti. Rubano delle risorse preziose agli altri utenti, per cui si può agire anche qui. Come? Filtrando gli utenti malintenzionati. Con CloudFlare, si può 🙂
Per cui, cosa ho fatto?
Il giorno 14 Febbraio ho semplicemente utilizzato il servizio gratuito offerto da CloudFlare. sia per la sicurezza che per li distribuzione dei contenuti simil CDN, come ho scritto nella sezione Come usufruire del servizio di CloudFlare.
Le aspettative
Che risultati mi aspetto di avere?
Da quello che ha detto Matthew Prince, CEO di CloudFlare, mi aspetto:
- diminuzione del tempo di caricamento, pari a circa il 50% di quello attuale.
- risparmio di banda del 60%.
- risparmio delle richieste del 65%.
Poi mi aspetto anche che diminuisca il Tempo trascorso per il download di una pagina (lo trovi dal Google Webmaster Tools), tempo medio impiegato dallo spider di Google per scaricare una pagina (tiene conto anche del tempo di risposta del server).
Infine, mi aspetto anche di ricevere più traffico dai motori di ricerca (direttamente o indirettamente) se è vero che Google ne tiene conto, e comunque dovrei avere una minor frequenza di rimbalzo nei primi secondi.
Dati reali
Ecco cosa è successo realmente analizzando l’homepage del blog con Pingdom Tools:
Prima di utilizzare CloudFlare, ciò che rallentava il caricamento della home erano le immagini (1), causato principalmente al tempo di connessione (in blu) del browser al server (che nel frattempo stava inviando altre immagini).
Con CloudFlare le immagini vengono caricate immediatamente (2), con il ritardo di connessione del browser al server davvero modesto. In questa situazione, ciò che rallenta il tempo di caricamento del blog sono i pulsanti social (3).
In breve:
Il tempo di caricamento è migliorato del 56%, passando da 4.23 secondi a 1.86 secondi, solamente utilizzando CloudFlare! Strepitoso!
Mentre la dimensione della pagina è aumentata di circa 0.2 MB (probabilmente dovuta ai servizi utilizzati da CloudFlare, come Rocket Loader, che permette il caricamento asincrono degli scripts).
Nel dettaglio:
Il tempo speso per caricare le immagini è diminuito, dall’84% iniziale al 58% con CloudFlare, un risparmio del 26% solo per le immagini!
Il tempo speso per caricare i contenuti del blog (dominio + immagini + CSS + JS) è passato da 89% a 57%! (essendo un valore percentuale, la differenza verrà ovviamente spalmata sui plugin sociali, che avranno un maggior impatto sul tempo di caricamento globale).
Il numero di script è diminuito utilizzando CloudFlare, probabilmente dovuto alla minificazione e fusione di più file in uno unico.
Dai dati di Google Analytics, ottengo questi risultati calcolati su 5 giorni:
Metto in evidenza alcuni risultati:
- Computer – Visite: -6.86%, ci può stare. Probabilmente dovuti all’esclusione degli utenti malintenzionati.
- Smartphone – Pagine/Visita: +6.51%, da 1.64 a 1.75, buon valore, vuol dire che il lettore riesce a navigare in maniera più agile rispetto a prima.
- Smartphone – Durata media visita: +48.19%, da 2.04 min a 3.03 min, questo è un valore che fa riflettere sull’importanza della velocità sui mondo mobile. Evidentemente prima l’utente appena accedeva al blog, non riusciva a vedere i contenuti in un tempo ragionevole e se ne andava. Una durata maggiore non vuol dire necessariamente che l’utente visiti solo quella pagina prima di uscire dal sito.
- Frequenza di rimbalzo: è leggermente negativa per entrambi, mi sarei aspettato qualcosa meglio, sicuramente un guadagno. Evidentemente, la mia frequenza di rimbalzo è dovuta ad uno scarso sistema di linking interno dei contenuti piuttosto che alla velocità del blog, infatti è molto alta, attorno al 65%.
Ed ecco il risultato che non mi aspetto: -4.60% da Google! È possibile che sia dovuto agli utenti malintenzionati? Sì, ma non pensavo arrivassero da Google…
Mentre ottimi i risultati ottenuti da Google Analytics per quanto riguarda i vari tempi percepiti dagli utenti (quindi non dagli spider di Google).
Non posso dire lo stesso per il Tempo trascorso per il download di una pagina, quindi rilevato dallo spider di Google:
Infatti il tempo medio (da Google Webmaster Tools) è passato da 0.891 sec a 1.490 sec! (questo non va bene, meno è, meglio è). Penso sia proprio questo il dato utilizzato da Google per il posizionamento, ma preferirei attendere il parere di persone più esperte di me in questo campo.
A cosa può essere dovuto? Penso alla risposta del server più lenta (in disaccordo con quanto riportato con Analytics, ma è l’unica cosa che trovo sensata). Hai idee in merito?
Un valore simile è stato riscontrato analizzando il blog con il servizio My Pingdom (che tiene sotto osservazione le performance del proprio blog), passando da una media di 0.981 sec a 1.672 sec, un peggioramento del 70%!
Infine ecco le statistiche di CloudFlare nei primi 5 giorni di utilizzo:
Da notare:
- 339 utenti malintenzionati rilevati e bloccati, ovvero il 4% degli utenti unici globali, guarda caso è quasi uguale al traffico che ho perso da Google.
- 7 GB di banda risparmiata (il 58%)!
- 186.451 richieste al server risparmiate (il 66%)!
Che numeri!
CloudFlare + W3 Total Cache
Di default CloudFlare non gestisce la cache del contenuto HTML (pagine, post, widget, ecc), ma solamente delle immagini, CSS e JS e altri file statici. Da qui, si può capire che conviene gestire la cache del contenuto HTML. Per far ciò, consiglio di utilizzare il plugin W3 Total Cache, come ho descritto nell’articolo W3 Total Cache + CloudFlare.
Dati reali
Ho introdotto W3TC il 20 Febbraio. Il numero di richieste sono aumentate, ma la cosa interessante, molto interessante, è che il tempo di caricamento è diminuito del 43%, da 1.72 secondi a 0.984 secondi.
A quanto pare ora sono più veloce degli altri 89% siti testati tramite pingdom 🙂
Con W3TC + CF, il tempo tempo trascorso per il download di una pagina si è assestato attorno a 1.36 secondi, un guadagno del 9% rispetto ai 1.49 secondi di prima, ma comunque un peggioramento del 52% rispetto al valore iniziale di 0.891 secondi.
Invece, ho notato tramite il servizio My Pingdom che il tempo di download della pagina (che prima era simile a quello fornito da Google) è sceso notevolmente:
Ora il tempo di download della pagina medio è migliorato del 65% rispetto al caso con CloudFlare, passando da 1.672 secondi a 0.579 secondi. Ottimo! 🙂
Dati finali
In conclusione ecco i dati che ritengo più interessanti tra il caso di un blog classico (pre-CloudFlare) ed il caso con W3 Total Cache + CloudFlare.
Il tempo di caricamento è diminuito del 76%, passando da 4.23 secondi a 0.984 secondi!
Le richieste sono aumentate a causa dell’introduzione di W3TC, di CloudFlare e ad un plugin aggiunto per la gestione dei banner (quindi che rallenta un pochino, altrimenti il risultato sarebbe stato ancora migliore ;)).
Mentre il tempo di download di una pagina, dai dati del Google Webmaster Tools, è peggiorato del 52%, passando da 0.891 secondi a 1.36 secondi.
Conclusioni
Queste sono le mie aspettative iniziali che sono state soddisfatte:
- il tempo di caricamento è diminuito di più del 50% previsto, toccando il 56% solo con CloudFlare ed arrivando grazie a W3 Total Cache al 76% in meno :).
- il risparmio di banda previsto era del 60%; io ho ottenuto un risparmio del 58%.
- il numero delle richieste risparmiate era previsto del 65%; ho ottenuto un risparmio del 66%.
Queste sono le mie aspettative iniziali che non sono state soddisfatte:
- il tempo trascorso per il download di una pagina è peggiorato del 52% anzichè migliorare.
- il traffico proveniente dai motori di ricerca. Questo valore è diminuito del 4.60% (a quanto pare dovuto all’esclusione dal blog degli utenti malintenzionati), mentre mi aspettavo un aumento, anzi, un bell’aumento. Peccato 🙁
Nonostante il netto miglioramento del caricamento del blog, ho una preoccupazione: il peggioramento del tempo trascorso per il download di una pagina, può influenzare il posizionamento (in negativo)? Penso di sì, ma attendo un tuo parere. Attualmente, non ho riscontrato nessun peggioramento di posizionamento in SERP.
Che dire, questi sono i miei dati e, come puoi vedere, ho migliorato notevolmente le prestazioni del mio blog, senza spendere né tempo né tantomeno denaro. Non capita tutti i giorni 🙂
Probabilmente questo articolo sarà l’articolo che consiglierò come primo step a chi ha bisogno di velocizzare il proprio blog o sito web (e spero che lo farai anche te 😉 ).
Che ne pensi? Hai avuto esperienze in merito? I tuoi dati sono migliori o peggiori? Commenta qui sotto…
25/02/2013 alle 12:05
Come compatibilità con gli altri plugin hai avuto qualche problema?
25/02/2013 alle 12:34
Ciao Ottomasi,
al momento nessun problema di compatibilità.
25/02/2013 alle 15:00
Salve Roberto,
qualche precisazione, se posso.
a) Le statistiche che visualizzi per il download di una pagina, sono.. come dire, relative. Vengono effettuate da differenti data center sparsi nel mondo, ma effettivamente, non si sa dove siano. Cosa vuol dire questo?
Che il tuo sito potrebbe essere il più veloce in Italia, ma se Google effettua il test da un data center in Texas (USA), sicuramente i suoi risultati non saranno cosi eccellenti. Di conseguenza, ti mostrerà un tempo per il download di una pagina…non cosi veloce.
b) Pingdoom Tools è un utile tool in certi casi, ma non sempre è affidabile e veritiero come appare. Offre anche la possibilità di effettuare test da diverse locazioni. Nel tuo caso, quale località hai impostato?
Concludendo, penso che il miglior metodo per verificare i tuoi risultati, sia quello di monitorare attentamente statistiche, riferite soprattutto a visite, page views e frequenza di rimbalzo; e vedere con i tuoi lettori, in Italia o altri in Europa, come il sito appare ai loro occhi.
Nel tuo caso, Bluehost ha i dc negli Usa, Utah, pertanto è molto facile che il tuo sito da CloudFlare e W3TC, possa avere solo miglioramenti. Ed attualmente, mi sembra molto veloce.
Per chi ha un buon Hosting in Italia o Europa, allora i risultati, potrebbero essere un pò differenti.
Saluti! 😉
25/02/2013 alle 17:56
Ti ringrazio Alessandro, certo che puoi, siamo qui apposta per parlare 🙂
a) Ok, ovviamente i test vengono fatti da data center random, ma penso che venga preso un valore medio. Quindi se al tempo T1 vale 0.8 secondi, al tempo T2, se non si modifica niente, varrà più o meno sempre 0.8 sec (altrimenti non avrebbe proprio senso tenere conto diquesti valori). Invece qui la variazione è davvero notevole, dovuta senz’altro all’introduzione di CloudFlare.
b) I test sono effettuati dal data center di Amsterdam per essere il più vicino possibile alla realtà.
Concordo con te anche il finale (ho scritto queste considerazioni nell’articolo di spiegazione di CF), se il target è l’Italia e se si usa un server condiviso americano, molto probabilmente si avrà un buon miglioramento. Se invece il server è condiviso (con stesse prestazioni di quello americano) ma in Italia, allora può non portare a benefici di velocità, ma solo di riduzione del carico e miglior sicurezza.
Ciao 🙂
28/02/2013 alle 16:07
Ciao Roberto,
c’è un altro aspetto contrastante però. CloudFlare funge da reverse proxy con funzioni simili a quelle di un CDN, pertanto, una volta attivato, permette la distribuzione dei contenuti di un sito, in numerosi nodi sparsi nel mondo (europa, asia, usa).
Tutto ciò, a differenza di un Hosting che ha solo un data center (come nel tuo, Bluehost).
Conseguenze?
Ammettiamo anche che, come detto prima, nella regione, nazione, dove sono presenti i DC del tuo Hosting, questo continui sempre a funzionare più velocemente rispetto a CloudFlare. Ma, nelle restanti parti del mondo, dove ci sono nodi di CloudFlare (23 DC) (e non di Bluehost), i valori medi di accesso ai siti non dovrebbero diminuire? La velocità dei tuoi siti, non dovrebbe subire miglioramenti?
Statistiche Webmaster Tool
Dicono l’esatto opposto.
Ma a rigor di logica, tutti i valori riguardanti la velocità del tuo sito in numerose parti del globo, dovrebbero diminuire grazie a CloudFlare, non aumentare.
Pertanto, il valore medio mostrato in GTW, dovrebbe diminuire notevolmente.
Se ci fossero solo uno o due valori che fanno media, presi dall’Asia e l’Australia (dove sono presenti nodi di Cloudflare), dovrebbe giocare proprio a favore di CloudFlare, non contro.
La conclusione è che ho seri dubbi sull’attendibilità dello strumento in GWT, viste anche le poche informazioni disponibili. O come alternativa, che Cloudflare performi talmente male, da far aumentare i valori medi e non diminuirli. (bisognare chiedere a qualche utente dall’altra parte del mondo)
Una domanda per curiosità, la frequenza di rimbalzo del tuo sito, è diminuita molto dopo l’attivazione di CloudFlare?
Ciao 🙂
01/03/2013 alle 09:23
Ciao Alessandro,
penso anche io che le statistiche di GWT siano un po’ troppo traballanti.
Il valore medio mostrato in GTW, dovrebbe diminuire notevolmente?
Dipende da dove vengono rilevate le statistiche del Googlebot e dalle prestazioni del server di CF. Ma, anche io mi sarei aspettato un tempo di download inferiore, proprio seguendo il tuo ragionamento logico. Ho chiesto in assistenza, vediamo che mi rispondono, sono curioso 🙂
La frequenza di rimbalzo è aumentata del 2.5%, da 66.5% a 69%. Altro risultato che non mi sarei aspettato, ma evidentemente, in questo caso, è un valore dovuto alla tipologia del sito piuttosto che al tempo di caricamento.
25/02/2013 alle 16:05
Gentile Roberto,
innanzitutto grazie infinite per l’azione divulgativa e per gli stupendi contenuti che veicoli col tuo blog.
Volevo chiederti se la soluzione da te evidenziata poteva avere problemi con gli rss feed perchè quando attivai cloudflare l’ultima volta è come se mi si fossero “congelati” gli rss feed (con conseguente blocco della newsletter etc)
Ti ringrazio per la risposta a presto!
25/02/2013 alle 19:10
Ciao Alfonso,
ti ringrazio! Ho avuto questo problema ma la causa è da ricondursi al plugin W3TC (hanno creato qualche casino con una delle ultime versioni), anche senza CloudFlare.
Vai su Performance > Page Cache > e disattiva Cache feeds: site, categories, tags, comments. Svuota la cache e dovrebbe andare tutto a posto.
26/02/2013 alle 20:52
Ciao Roberto,
questa piccola serie sulla velocizzazione del tuo blog mi ha interessato molto e devo dire che inizierò ben presto a fare qualche esperimento anche con il mio nuovo sito, anche se non mi devo lamentare poi molto dato che, secondo il PageSpeed di Google sto ottenendo degli ottimi risultati.
Più che altro volevo aggiungere questo mio commento per dirti che, purtroppo, Google tiene in considerazione il tempo di download di una pagina (anche per questo motivo hanno aggiunto la relativa sezione all’interno di Analytics) ma, come fu per il PageRank a suo tempo, non è l’unico fattore. Se vuoi un consiglio spassionato, ultimamente sto “boicottando” W3 in favore di altri piccoli plugin che fanno il suo stesso lavoro, ma che sono meno complicati: WP Minify e HeadJS in primis.
Con questi sono riuscito ad ottenere un valore di 94/100 sul PageSpeed di Google, come puoi vedere da questo link, anche attivando lo stesso PageSpeed che tu stesso hai consigliato.
Per concludere, sicuramente andrò ad utilizzare CloudFlare, servizio gratutito che già potenzia alcuni miei siti, ma non sono molto sicuro per quanto concerne W3 (anche perché un mio amico sistemista me lo sconsiglia vivamente…).
Non so se andrai a fare anche dei tuoi test personali, ma spero comunque di averti fatto conoscere vie alternative all’ormai famoso W3 Total Cache che, con gli ultimi aggiornamenti, ha reso la vita un pò difficile…
A presto e ancora complimenti per i contenuti presenti nel blog!
27/02/2013 alle 14:42
Ciao Andrea!
È sicuramente vero che Google tenga conto del tempo di download, ma quale dei due ha più valore? Quello rilevato dal Googlebot o quello rilevato da Analytics (quindi dagli utenti)? Secondo me è il secondo che dovrebbe avere più peso, se Google effettivamente mette davanti ogni cosa la soddisfazione dell’utente.
Il fatto è che un buona cache aiuta molto su questo argomento, quindi si potrebbe implementare a mano (un lavorone lunghissimo e su cui mi dovrei documentare per bene) oppure utilizzare questo plugin, che secondo me è il più valido per queste operazioni.
Minify e HeadJS + mod_pagespeed può essere un’alternativa? Certamente, ti ringrazio per la segnalazione! Purtroppo non tutti possono utilizzare mod_pagespeed.
Posto un link interessante in inglese sull’argomento w3TC e mod_pagespeed: http://wordpress.org/support/topic/plugin-w3-total-cache-googles-mod_pagespeed-and-w3 .
Penso che farò dei test al riguardo, ti ringrazio Andrea! Il bello (o il brutto) dell’ottimizzazione è che non finisce mai 🙂
27/02/2013 alle 16:21
Io con W3 e Coudflare sono passato da 7 a 4 secondi per la first view e 1 secondo per la repeat view. Posso ancora migliorare ma già così mi pare un ottimo risultato, grazie!
28/02/2013 alle 21:57
E di che? 😉
09/03/2013 alle 16:10
sto utilizzando maxcdn ma se devo essere onesto credevo facesse qualcosa in più
09/04/2013 alle 21:43
Ciao Roberto, articolo eccellente. Una cosa non mi è chiara, volendo utilizzare uno dei pacchetti a pagamento di Cloudflare, come faccio con le immagini già presenti presso il mio ftp? Mi spiego meglio ho un sito con oltre 2000 immagini molto pesanti, non mi è chiaro come queste vengano trasferite presso Cloudflare.
In secondo luogo, hai qualche dato anche su Google immagini che a me interessa particolarmente?
Grazie ancora per l’articolo che mi è stato utilissimo!
10/04/2013 alle 13:05
Ciao Enrico,
mi dispiace ma ho testato solo la versione free, non ti so dire come funziona quella a pagamento. Se è come la free, basta che giri i DNS e fa tutto lui (si crea da solo le copie dei file statici).
Non ho dati su Google immagini…
01/05/2013 alle 07:56
Ciao Roberto,
hai scritto una serie di articoli molto interessanti e ben fatti sull’ottimizzazione!
Volevo chiederti se da quando sei partito hai notato peggioramenti per la serp in funzione dei tempi di caricamento delle pagine.
buon lavoro
Francesco
03/05/2013 alle 13:55
No, anzi, qualche lieve miglioramento… ma probabilmente non dipende solamente da questo, ho fatto un po’ di modifiche nel frattempo… Quindi non ti posso confermare niente…
16/05/2013 alle 17:18
Ciao Roberto,
posso registrare anche un dominio che fa redirect? Io sto usando un dominio .com su cui in realtà non vi è spazio e si appoggia infatti al .it (una sorta di alias) dove ci sono tutti i file wordpress installati come .com (ho dovuto fare un trasferimento e questa è stata la soluzione finale). Ho registrato il .com su cloudfare ma ora mi sto cheidendo se i dns li cambio al .com (che è un redirect) o al .it dove in realtà ci sono i file fisici (anche se, però, come uno clicca qualsiasi link sul .it viene reindirizzato sul .com). Che fare?
Grazie!
17/05/2013 alle 13:44
Chiedi per sicurezza all’assistenza di CloudFlare, ma penso che dovresti cambiare anche quelli del .com…
17/05/2013 alle 15:48
ciao
da quando uso w3+cloudflare la frequenza di rimbalzo mi è scesa al 2%.
e non penso sia reale.. ne sai qualcosa?
Dei miglioramenti mi sembra ci siano stati ma secondo me il sito ha qualche problema che non riesco a capire…
tant’è che pensavo di esportare i post, e reimportarli su un altro db nuovo. mal che vada avrò esluso l’eventualità che sia colpa del db.
23/05/2013 alle 14:54
Problemi del tipo?
17/07/2013 alle 08:14
ciao Roberto, ho testato cloudflare (assieme W3 TC) per un mesetto, tra maggio e giugno.
Pure io sono su blue host e ho seguito la procedura automaticaindicata dagli americani per settare CloudFlare.
Francamente ho notato un generale rallentamento, non so la sensazione, pure sula backend, è che ci fosse un “tappo”. Ed infatti ora che ho disattivato tutto viaggia discretamente veloce.
Puo’ essere che in questi mesi CF abbia avuto problemi? Ho letto molti commenti di persone che denunciavano rallentamenti e mini down di servizio (con la classica schermata di cloudflare che invita a riprovare).
Poi, dicevo la velocità di accesso al sito che in effetti su Pingdom era attorno al 1.5sec, ma poi dalle tool di Goole: http://goo.gl/BNKMU la montagna in mezzo è il periodo in cui ho provato CF, come vedi una volta disattivato l’accesso è decisamente più veloce. E’ come se agli spider proprio non piaccia sto CloudFlare…
Comunque , sto monitorando il sito con sitemonitor.net e a grandi linee la velocità di risposta del sito è sotto i 1000msec normalmente 500msec con cloud flare attivo decisamente più alta con 3 fino a 10 failure giornaliere.
E’ capitato pure a te?
17/07/2013 alle 13:20
Ciao Giacomo,
sì, ho notato anche io rallentamenti ma solo nel backend, per il resto mi pare molto veloce. Confermo anche io la schermata di CF della cache. Anche il googlebot è più lento a recuperare le pagine, ma questo era stato preventivato 🙂 Ti ringrazio per il tuo contributo.
Penso che prima di passare ad un VPS o semidedicato, proverò a disabilitare CF, ti farò sapere 🙂