Capire perchè WooCommerce è lento e renderlo più veloce

WooCommerce è senza dubbio il migliore plugin di WordPress per creare siti ecommerce, shop online multi vendor; puoi vendere di tutto con WooCommerce, c’è (quasi) un plugin per ogni esigenza.

In questo articolo voglio svelarmi aspetti tecnici che probabilmente nessuno vi ha mai detto, aspetti che utilizzo quando faccio l’ottimizzazione di WooCommerce per renderlo più performante, anche oltre il 60% in più; questi aspetti influiscono notevolmente le prestazione del vostro ecommerce con WooCommerce e lo rendono lento, anzi a volte talmente lento che l’utente scappa perchè è innavigabile, così vendete poco o niente.

La pulizia del database di WordPress / WooCommerce

Ogni volta che installiamo un plugins vengono scritte informazioni (record) nelle tabelle del database, che poi vengono utilizzate per fare funzionare i plugins; eliminando i plugins che non ci occorrono più, nel database rimangono comunque le tabelle relative al plugin eliminato, e dei record detti “orfani”, ossia informazioni che utilizzava il plugin che è stato eliminato; questo meccanismo “sporca” ed appesantisce il database, rallentando così il caricamento delle pagine del sito web; spesso non vengono eliminate tra l’altro alcune cartelle del plugin, questo comporta un rischio di sicurezza in quanto potrebbe essere attaccato da virus e hacker attraverso questi file oramai non più utili.

Il database può essere visto come una sorta di magazzino, più il magazzino è disordinato più tempo ci si impiegherà a cercare qualcosa, per questo il database va tenuto sempre ordinato.

Come per i server immagini e le CDN, anche il database possono essere distribuiti su uno o più server diversi a seconda del sito internet, del traffico ricevuto, dal geo traffico, dal tipo di ottimizzazione che si vuole ottenere.

WordPress ha anche un meccanismo molto utile che è il salvataggio automatico di quando stiamo scrivendo un articolo o una pagina, infatti ogni 2 minuti viene salvata una copia nel database, le copie sono accessibili poi attraverso la voce “Revisione articolo”; questo meccanismo automatico però è un’arma a doppio taglio perché riempie le tabelle del database di record, infatti poi una volta pubblicata la pagina o l’articolo in questione, i salvataggi automatici non vengono eliminati, questo aumenta le dimensioni del database e di conseguenza rallenta il caricamento delle pagine del sito internet.

Il database di WordPress va periodicamente ottimizzato ma pochi lo fanno per mancanza di informazioni ma soprattutto perché non saprebbero dove mettere le mani.

E’ possibile invece creare un automatismo per tenere sempre il database pulito ed ottimizzato.

Il caricamento delle immagini, quale formato devo scegliere ?

Esiste una diatriba perenne tra grafici, clienti e programmatori su questo discorso; infatti il grafico spesso per mancanza di informazioni a riguardo e per accontentare il cliente, carica immagini di dimensioni elevate ed ad alta risoluzione non ottimizzate per il web; causando così pagine di dimensioni consistenti e che quindi inevitabilmente vengono caricate in modo lento.

Esistono diversi modi per ottimizzare le immagini senza perderne minimamente la qualità, per esempio si posso utilizzare server appositi per ospitare sole le immagini, ed il sito invece su un altro server; esiste poi un formato che oramai è riconosciuto da tutti i browser (Chrome, Firefox, Safari, Edge, ecc..) ed è il formato web chiamato WebP, la soluzione migliore per il caricamento di immagini per il web.

Vi siete mai chiesti come fa il sito di Apple ad avere tante immagini incredibilmente nitide e quasi reali ma avere un sito così veloce e performante ? La risposta ve l’ho data, ha voi la scelta 🙂

Il codice del tema e dei plugins installati, va minificato!

Minificare il codice si può tradurre in parole molto semplici, eliminare gli spazi vuoti inutili all’interno del codice stesso; questa pratica riduce le dimensioni dei file e né permette il caricamento più veloce da parte del sito web.

Questo aspetto è uno dei più delicati durante la procedura di ottimizzazione WordPress, questo perché il codice per ovvi motivi non è scritto sempre dalla stessa persona, ognuno programma a proprio modo, si possono commettere degli errori e quindi questa strada non è sempre percorribile per tutti i file, può accadere infatti che il template “si rompa”, che alcune parti non funzioni più o addirittura come se fosse sparita la grafica; in questi casi va eseguita una profonda analisi per capire le soluzioni adottabili e capire i costi / benefici.

L’ottimizzazione invece prevede una priorità di caricamento dei file CSS e JS, in modo che il sito si veda correttamente e nello stesso tempo sia veloce nel caricamento.

Sono certo che abbiate già effettuato un test di performance del vostro sito con Google Page Speed, la voce che riguarda questa parte di ottimizzazione viene chiamata “Elimina il contenuto above the fold”; significa che prima viene caricato il codice e poi il testo del sito, quando invece dovrebbe essere il contrario.

Utilizzare le CDN (Content Delivery Network)

Le CDN (Content Delivery Network) si comportano un po’ come ho spiegato sopra per i server delle immagini, ossia sono server sparsi per il pianeta che ospitano a parte solo il codice del sito WordPress, di norma il CSS e JS; le CDN, quelle serie, utilizzano la modalità DNS Round Robin, cioè il codice viene servito dal server più vicino all’utente che sta navigando il sito, in questo modo verrà caricato più velocemente.

I servizi CDN più utilizzati sono CloudFlare che funziona bene ma solo con il servizio a pagamento e non free, MaxCDN o StackPath, Google Cloud CDN, ma è anche possibile farsi un server CDN per proprio conto per esempio con la tecnologia AWS di Amazon o di Google Cloud Platform.

Il web server, meglio Apache o NGINX

La maggiorparte dei servizi di hosting più comuni utilizzano come motore web il server Apache, è un buon sistema di configurazione ma non è il motore ottimimale per avere le migliori prestazioni.

NGINX è sicuramente il web server migliore per avere delle alte prestazioni su WordPressm, infatti nasce già “ottimizzato”; purtroppo non si trova sui servizi di hosting più comuni, ma è necessario fare una ricerca approfondita per trovare quello “giusto”; diversamente se pensiamo invece a servizi scalabili come i server cloud di AWS Amazon e Google Cloud Platform abbiamo la possibilità di decidere quale web server scegliere nel momento in cui configuriamo la macchina; per questo consiglio sempre su progetti mission critical o per chi vuole davvero il massimo, un servizio di hosting con web server NGINX; sicuramente il costo è diverso (ma comunque accessibile) ma si hanno veramente alte prestazioni; il mio sito per esempio è su un server che usa NGINX, veloce non è vero ?

Sistemi di cache lato server e lato WordPress

La cache è un contenitore dove vengono salvate le pagine del sito WordPress che gli utenti visitano, no non è uguale al database; ogni pagina di WordPress è composta da codice PHP, HTML, CSS e JS (Java, JavaScript o jQuery), l’indirizzo delle immagini ed il testo viene salvato all’interno delle tabelle del database; ecco quello che succede quando digitiamo per esempio l’indirizzo staging-alessioangeloroit.kinsta.cloud ; il server (hosting) fa una ricerca (query) all’interno del database, appena ha trovato quello che cerca inizia a comporre la pagina prelevando le immagini, il testo che gli servono e tutto il codice PHP, HTML, CSS e JS, tutto ciò comporta un dispendio di tempo ogni volta; invece con i sistemi di cache, le pagine vengono salvate già composte all’interno di una cartella; così quando un utente digita staging-alessioangeloroit.kinsta.cloud la pagina viene caricata dalla cache e non fa più tutto il laborioso giro di prima, ne consegue che la pagina sarà servita al browser dell’utente in modo molto ma molto più veloce.

Esistono diversi tipi di cache, uno lato server che viene installato direttamente dal vostro servizio di hosting, quelli più comuni sono Varnish Cache, Redis Cache e MemCached, è molto importante sapere decidere ma soprattutto configurare il sistema di cache più adatto a secondo del sito WordPress o WooCommerce.

L’altro tipo di cache è quello lato WordPress, che può, non sempre infatti, interfacciarsi con quello del server; i plugin di cache più famosi sono W3 Total Cache, WP Fasted Cache e WP Rocket.

La scelta del servizio di hosting provider

Scegliere il giusto hosting purtroppo è diventata una vera guerra se non si è del settore e non si hanno capacità tecniche di valutazione, infatti ci riempiono la testa di messaggi promozionali con super offerte e tutti millantano di essere i migliori; il punto è che è facile cascare in servizi pessimi, a volte anche costosi o dove si leggono migliaia di recensioni positive, spesso infatti sono solo sistemi di affiliazione.

In questi anni grazie al mio lavoro ho potuto valutare e provare parecchi servizi di hosting ed onestamente ne ho tenuti buoni solo 4 o 5 che utilizzo a seconda del progetto da sviluppare o dall’ottimizzazione WordPress o WooCommerce da effettuare; nulla deve essere lasciato al caso.

Ergonet, ServerPlan e KeliWeb sono dei buoni provider.

Scegliere il giusto template e i giusti plugin

Spesso quando faccio le ottimizzazioni di WooCommerce vedo che ci sono installati almeno 30 plugin, oppure siti WordPress con dozzine di plugin che sono veramente inutili, disattivati e li a fare solo numero o ancora peggio che fanno la stessa cosa.

L’installazione di troppi plugin, soprattutto se utilizzano librerie jQuery o Fonts, appesantiscono il sito WordPress; tante cose si possono fare magari facendo sviluppare un piccolo plugin da un professionista WordPress che sicuramente saprà valutare se utilizzare e come le librerie jQuery ed i vari codici.

La scelta di un template adatto spesso ricade su siti come themeforest, dove esistono centinaia di template WordPress e ci si fa prendere la mano dalla bellezza senza pensare a come sarà poi quando lo installeremo sul nostro sito.

Molti di questi template utilizzano builder visivi per semplificarvi la vita, tipo WP Backery Visual Composer, Avada, Divi ma fate attenzione perché quelli che ho elencato rallentano veramente di tanto il sito WordPress; se proprio volete usare un builder usate Elementor che è ottimo, ha un sacco di opzioni ed è leggerissimo.

Utilizzare DNS geo localizzati, ma cos’è il DNS ?

Il DNS (Domain Name System) in poche parole traduce un nome a dominio tipo www.miosito.com nel suo numero corrispettivo 192.2.34.89, tale numero è detto indirizzo IP, ora pare ovvio che è più facile ricordarsi il nome piuttosto che un numero, un pò come la rubrica del telefono.

Esistono diversi servizi DNS più, alcuni di questi risolvono il nome molto più velocemente rispetto ad altri, questo grazie alla loro infrastruttura e perchè risponde il server più vicino all’utente che ha richiesto la pagina del sito (www.miosito.com).

AMAZON ROUTE 53

Uno dei servizi più utilizzati per fare l’ottimizzazione di WordPress è sicuramente Amazon Route 53 in quanto ha server globali geo localizzati (sparsi per tutto il mondo), quindi per ovvi motivi utilizzando tale servizio il sito WordPress si aprirà più velocemente.