Ci siamo: il sito è finalmente pronto per andare online, abbiamo scelto un buon server, ridotto il numero di plugin, utilizzato buone pratiche, insomma abbiamo fatto tutto il necessario eppure il sito non sembra affatto veloce come vorremmo!
I motivi possono essere molti, tra cui:
- una grande quantità di contenuti da mostrare tutti insieme (per esempio tanti articoli da mostrare in una home page del sito di un giornale);
- tante immagini da caricare nella pagina;
- una ricerca particolarmente avanzata.
Qui comincia un lavoro più di fino, un’ottimizzazione che guarda non sono alla velocità “reale” ma anche a quella “percepita”: poco importa se in fondo alla pagina le immagini non si caricano immediatamente, ma se il contenuto subito visibile (il cosiddetto above the fold) viene visualizzato immediatamente avremo la percezione di un sito molto veloce, viceversa, se non ci viene mostrato nulla, ci stancheremo subito.
Frontend: ciò che l’utente vede
Per l’utente, veloce significa che la pagina appare subito, per fare questo ci sono alcune strategie:
- Critical CSS: carica subito gli stili indispensabili, rimanda il resto;
- Script deferiti: tutto ciò che non è vitale al rendering iniziale può aspettare:
- Lazy load delle immagini: carico le immagini man mano che vengono visualizzate, in questo modo ne posso caricare solo alcune anziché tutte quelle presenti nella pagina.
Sono piccoli interventi, ma sommati fanno la differenza tra “sito pesante” e “sito fluido”.
Caching: la prima arma del backend
WordPress è dinamico per natura, ma questo non significa che ogni pagina vada generata da zero ad ogni visita.
- Full-page cache: salva versioni statiche delle pagine più richieste;
- Object cache (Redis/Memcached): evita che le stesse query al database vengano eseguite mille volte.
Senza caching, un sito ad alto traffico è destinato a implodere. Con il caching, diventa un sito reattivo, perchè ogni elaborazione viene fatta soltanto la prima volta: ogni visita successiva utilizzerà il risultato salvato nella cache.
Come funziona la cache?
Può sembrare qualcosa di oscuro ma il funzionamento della cache è molto semplice e si può spiegare con un esempio: supponiamo di voler sapere il risultato della moltiplicazione 37 x 58. A seconda delle nostre capacità matematiche o della disponibilità di una calcolatrice, in pochi secondi scopriremmo che il risultato è 2146. Se però ti chiedessi nuovamente quanto fa 37 x 58 la vostra risposta sarebbe immediata: 2146. Ecco come funziona la cache! Nessuna magia ma solo buon senso.
Come tutti gli strumenti, la cache sa essere buona quando velocizza i nostri siti web ma anche cattiva: succede quando salva il risultato di un errore, per esempio un typo o l’immagine di copertina errata. È lì che bisogna predisporre strumenti per invalidare la cache e ripetere l’operazione, ma questo è compito nostro, non ti preoccupare!
Se vuoi conoscere altri tips&tricks per migliorare le performance del tuo sito continua a leggere le nostre storie o contattaci per una consulenza!
