Questa guida è per coloro che desiderano ottenere il miglior punteggio su WordPress con Google Page Speed e velocizzare quindi il caricamento di ogni pagina del sito web in modo semplice e veloce.

Oggi vi mostrerò come migliorare le prestazioni del sito facendo esattamente questi accorgimenti. Ovviamente non bisogna demoralizzarsi e cercare di seguire alla lettera tutti i vari passaggi che serviranno a migliorare la velocità del sito web.

Come tutti sapete, oggi un tema per WordPress non è più solo un abbellimento estetico del sito, ma un vero e proprio ricettacolo di funzioni particolari e soggettive. I migliori developer questo lo hanno imparato negli anni di sviluppo, infatti solo con l’esperienza si può riuscire a raggiungere un buon livello di codice.

Vediamo ora da dove cominciare.

La compressione

Per ottimizzare al meglio WordPress, la prima cosa da fare è prendere tutti i file JS e CSS, concatenarli, minimizzarli e richiamarli, ovviamente cercando di non creare 10 files diversi per ogni script o 10 files diversi per ogni style CSS, ma è buona regola creare un solo ed unico file che racchiuda assieme tutto il codice necessario. Per esempio nei miei temi la inclusione dei file avviene secondo gli standard di WordPress ovvero:

Come vedete questi sono tutti i files che potrebbero essere necessari alla creazione di un tema per WordPress, ma il nostro intento è creare a partire da essi un unico file e richiamarlo nel front-end. Se volete ottimizzare i file potete studiarvi il mio articolo su come utilizzare Gulp per concatenare, minimizzare e generare in un unico file tanti files. Supponiamo che abbiate ora i file minimizzati. Bene, ora non ci resta che richiamarli con questo codice (come sopra, ma in questo caso saranno solo 2 file):

Come noterete ho anche incluso in modo diverso il file CSS, questo per permettere il caricamento del suo contenuto “Above the fold”. Questo vi darà già un buon punteggio su Google Page Speed, perché il file CSS viene caricato nel footer e non come di solito nella Header del tema. In questo modo il codice HTML generato da WordPress, verrà richiamato senza interruzioni per primo e, solo in un secondo momento, il browser procederà al caricamento dello stile CSS e successivamente al caricamento dei files JavaScript.

Problema con Google Analytics

Google Page Speed è un giusto strumento di valutazione per la velocità del proprio sito web, ma potrei scommettere che sul vostro sito avete anche le famose Google Analytics, che si, sono utili, ma ci potrebbero impedire di arrivare al risultato migliore in Google Page Speed. Questo perché il codice di Google Analytics viene caricato in modo asincrono via JavaScript e purtroppo non è possibile effettuare la cache del file se non integrando direttamente il file dentro al tema di WordPress. Per “fregare” Google Page Speed (ovviamente ciò non risolverà il problema, ma come si dice… occhio non vede, cuore non duole…) vi basterà inserire il vostro script di Google Analytics in questo modo:

Il cuore della Ottimizzazione .htaccess

Ora veniamo alla ultima parte, ovvero quella che darà al nostro sito una vera spinta a tutto il grosso lavoro che abbiamo fatto fino ad ora. La maggior parte degli hosting è su server Apache, quindi dobbiamo dare qualche direttiva al server affinché faccia lo sporco lavoro al posto nostro. Per fare questo ho già preparato tutte quelle regole che sono necessarie alla ottimizzazione del file .htaccess di WordPress.

Potete prendere tutto il codice che trovate dopo # END WordPress e metterlo nel vostro file .htaccess nella cartella di WordPress.

Conclusioni

Ora il nostro sito è veramente ottimizzato e diciamo che può girare bene anche su un hosting condiviso. In questo caso tutti i test sono stati fatti su questo stesso sito e tutti implementati come nella guida ed il risultato è appunto questo:

Ovviamente se volessi ottenere con sicurezza un punteggio migliore le cose sicuramente da fare sarebbero esattamente 2, ovvero:

1. Spostare il sito su un server dedicato
2. Creare una CDN esterna per richiamare i files JS, CSS e tutte le immagini o files

Tutto questo avrebbe un impatto notevole sulla velocità del sito, ma con costi decisamente fuori dalla portata comune.