Siamo sempre alla ricerca di soluzioni innovative per ottimizzare e rendere più veloci i siti WordPress che ospitiamo. WP Rocket e Kinsta sono pienamente compatibili da tempo.
Qui di seguito c’è tutto quello che bisogna sapere su come utilizzare WP Rocket su Kinsta e perché può essere un ottimo abbinamento per i siti WordPress.
Usare WP Rocket su Kinsta
Per coloro che non conoscono WP Rocket, si tratta di un noto plugin premium all-in-one per WordPress che offre innanzitutto la cache. Di solito, non permettiamo ai plugin di caching di entrare nel nostro ambiente perché entrano in conflitto con la nostra soluzione di caching integrata.
Tuttavia, quando viene eseguita sui server di Kinsta, la funzionalità di caching delle pagine di WP Rocket viene automaticamente disabilitata. Di conseguenza, è possibile utilizzare WP Rocket sulla nostra piattaforma perché non ci sono incompatibilità.
Questo permette di utilizzare la soluzione di caching di Kinsta e di sfruttare le straordinarie funzioni di ottimizzazione di WP Rocket (le approfondiremo di seguito).
Perché la cache è importante? La cache consiste nella memorizzazione delle risorse di una richiesta e il loro riutilizzo per le richieste successive. In pratica, riduce la quantità di lavoro necessaria per generare una pagina e diminuisce il carico sul server web. È il modo principale per annullare il ritardo dovuto alla dipendenza di WordPress da PHP e da un database (leggi di più su WordPress vs HTML statico).
Caratteristiche di WP Rocket
WP Rocket è un ottimo plugin facile da usare: la sua interfaccia utente è bellissima e allo stesso tempo intuitiva e dalla facile navigabilità! Qui di seguito illustreremo alcune delle funzioni consigliate di WP Rocket per rendere più veloce un sito WordPress e come sincronizzarlo con l’ambiente di Kinsta.
Eseguiremo anche alcuni test di velocità per vedere quali sono le opzioni che hanno il maggiore impatto su un sito di produzione. Si ricordi che i risultati possono variare da sito a sito, quindi bisogna assicurarsi di eseguire i test sul proprio sito o su quello di staging.
Se si usa un sito di staging su Kinsta, WP Rocket ha inserito nella whitelist la nostra struttura URL (staging-sitename.kinsta.cloud), il che significa che non verrà conteggiato come sito nel calcolo complessivo delle licenze. Lo stesso vale per l’esecuzione su localhost.
Cancellare la cache
Anche se, quando funziona su Kinsta, la cache è automaticamente disabilitata in WP Rocket, l’opzione “Cancella e precarica la cache” nel menu di WP Rocket è sincronizzata con l’ambiente Kinsta. Se si cancella la cache di WP Rocket, viene cancellata anche la cache di Kinsta dell’intero sito. Ottimo! Come sempre, è possibile cancellare la cache di Kinsta dalla barra di amministrazione in alto a destra.
Quando si attiva o disattiva un plugin, WP Rocket chiede di cancellare la cache. Questa operazione è consigliabile solo se il plugin aggiunge contenuti al frontend, come ad esempio un plugin per i cookie banner.
Infine, cliccando sul pulsante “Cancella e precarica la cache” dalla dashboard di WP Rocket, viene cancellata anche la cache di Kinsta.
Cache
Come abbiamo detto in precedenza, la cache delle pagine di WP Rocket è automaticamente disabilitata per i siti ospitati su Kinsta. Pertanto, consigliamo di lasciare le impostazioni della cache di WP Rocket così come sono con “Abilita la cache per i dispositivi mobili”, che è l’opzione predefinita di WP Rocket 3.16.
Ottimizzazione dei file
Nel menu “Ottimizzazione dei file”, WP Rocket offre la possibilità di ottimizzare i file CSS e JavaScript. Approfondiamo questi aspetti.
File CSS
- Minimizza i file CSS rimuovendo gli spazi bianchi e i commenti per ridurre le dimensioni del file. Abbiamo attivato questa opzione e abbiamo eseguito dei test di velocità, riscontrando una riduzione dello 0,87% del tempo di caricamento. Per il modo in cui funzionano i CSS, questa operazione potrebbe danneggiare il sito, quindi bisogna assicurarsi di testarla. Anche in questo caso, in generale, meno spazi bianchi e meno codice sono una buona cosa.
- Ottimizza la distribuzione dei CSS elimina i CSS che bloccano il rendering sul sito web per ridurre i tempi di caricamento. Consigliamo di attivare la funzione Rimuovi i CSS inutilizzati.
Per saperne di più, si vedano i nostri articoli di approfondimento sui CSS che bloccano il rendering e sull’ottimizzazione del percorso di rendering critico. Abbiamo attivato questa opzione e abbiamo eseguito dei test di velocità, riscontrando una riduzione del 56,36% del tempo di caricamento. Si ricordi, però, che si tratta più del tempo di caricamento percepito che di quello effettivo.
File JavaScript
- Minify JavaScript rimuove gli spazi bianchi e i commenti per ridurre le dimensioni dei file. Nel test che abbiamo effettuato, questa funzione ha avuto un impatto ridotto, in quanto c’era ben poco che non fosse stato precedentemente minificato dagli sviluppatori del page builder. Tuttavia, a causa del funzionamento di JavaScript, questa funzione potrebbe interrompere la funzionalità dei plugin o del tema, quindi è opportuno eseguire dei test accurati.
- Caricare JavaScript in differita elimina i JS che bloccano il rendering sul sito e può migliorare i tempi di caricamento. Per saperne di più, si vedano i nostri articoli di approfondimento sui JavaScript che bloccano il rendering. Tuttavia, se non si fa attenzione, questa soluzione può anche bloccare il sito, quindi bisogna assicurarsi di effettuare dei test.
- Ritardare l’esecuzione di JavaScript migliora le prestazioni in quanto il caricamento dei file JavaScript viene ritardato fino alla prima interazione dell’utente, come ad esempio lo scorrimento e il clic. Abbiamo attivato questa opzione e abbiamo eseguito dei test di velocità riscontrando una riduzione del 33,33% del tempo di caricamento.
Come si sarà notato, l’impatto delle funzioni di minificazione sulle prestazioni è minimo. Ciò è dovuto al fatto che la maggior parte dei temi e dei plugin aggiunge CSS e JavaScript minificati e le funzioni correlate di solito non producono alcun cambiamento nelle prestazioni, a meno che il tema o il plugin non siano stati sviluppati in modo da ignorare completamente le prestazioni, il che è estremamente raro. Altre tecniche, come la rimozione dei CSS inutilizzati e il differimento di JavaScript, fanno la differenza nell’ottimizzazione del codice.
Media
Il menu “Media” permette di caricare in lazy loading le immagini, i video e i frame. C’è anche la possibilità di caricare in lazy loading le immagini di sfondo CSS e di aggiungere le dimensioni delle immagini mancanti.
Approfondiamo un po’ questi aspetti.
Lazy loading
Il lazy loading è una tecnica di ottimizzazione che carica i contenuti visibili ma ritarda il download e il rendering dei contenuti che appaiono sotto la piega (below the fold). L’attivazione dell’opzione di lazy loading può migliorare i tempi di caricamento effettivi e percepiti, in quanto le immagini, gli iframe e i video vengono caricati solo quando entrano (o stanno per entrare) nel viewport, riducendo il numero di richieste HTTP.
- Abilita per le immagini: Abbiamo abilitato questa opzione ed eseguito dei test di velocità riscontrando una riduzione dell’8,55% del tempo di caricamento. L’impatto di questa funzione è limitato perché il core di WordPress aggiunge il lazyload nativo a tutte le immagini. Il leggero miglioramento nei test è dovuto all’ottimizzazione delle immagini di sfondo CSS.
- Abilitazione per iframes e video: WP Rocket ha un’opzione per sostituire automaticamente un video di YouTube con la sua immagine di anteprima. Si tratta di un’opzione efficace per ridurre l’impatto dei file legati a YouTube e dello scripting pesante, che influisce sia sulla velocità di caricamento che sulle prestazioni della pagina web.
Si legga anche il nostro tutorial approfondito sul lazy loading in WordPress.
Preloading
Nel menu “Preload” è possibile attivare il preload della cache, il preload dei link, il prefetch DNS e il preload dei font. Non tutte queste opzioni funzionano su Kinsta. Ma analizziamo questi aspetti.
Precaricare la cache
Non consigliamo di attivare questa opzione per i siti ospitati su Kinsta perché può ridurre le prestazioni sovraccaricando i thread PHP.
Preconnessione a domini esterni
A partire da WP Rocket 3.19, la vecchia funzione Prefetch DNS Requests è stata rimossa e sostituita con la funzione automatica Preconnect to External Domains.
La preconnessione aiuta a rendere più veloce il caricamento consentendo ai browser di impostare le connessioni di rete (DNS, TLS, TCP) a domini di terze parti prima che siano effettivamente necessarie. Ciò è utile soprattutto per le risorse esterne che hanno un impatto sul Largest Contentful Paint (LCP), come gli script di analisi o i Google Font.
A differenza del precedente metodo manuale che utilizzava <link rel="dns-prefetch"> nell’<head> del sito, la nuova funzione è completamente automatica (non richiede alcuna configurazione o inserimento manuale). WP Rocket ora rileva quali domini esterni sono necessari in ogni pagina e inietta i suggerimenti di preconnessione di conseguenza.
Questa modifica rende l’ottimizzazione più precisa ed elimina il rischio di configurazioni inutili o errate. Non si vedrà più questa impostazione nell’interfaccia di WP Rocket, ma è attiva di default.
Precaricare i font
Se i font sono ospitati sul dominio e non su un servizio esterno come Google Fonts, consigliamo di aggiungerli all’elenco “Preload Fonts” di WP Rocket. Precaricando i font nell’elemento head, i browser web possono scaricare i font prima che vengano scoperti nel file CSS.
Regole avanzate
Dato che WP Rocket si sincronizza con la cache dell’ambiente di Kinsta, non è possibile usare le regole avanzate. Se si ha bisogno di escludere un URL o una directory dalla cache o di forzare la cache di una determinata query string, è possibile sempre contattare il team di supporto di Kinsta.
Database
Nel menu “Database”, WP Rocket permette di eseguire la pulizia di post, commenti, transient e tabelle.
In combinazione con le nostre ottimizzazioni automatiche settimanali del database, mantenere il database pulito rimuovendo le revisioni dei post e i transient non necessari garantirà che il database lavorari al massimo delle prestazioni.
Pulizia dei post
Non è raro che i siti più vecchi abbiano più di 100 revisioni nelle loro pagine principali. Ciò è dovuto semplicemente ad anni di modifiche e aggiornamenti dei contenuti. Supponiamo, ad esempio, che un sito abbia 700 pagine o post con 150 revisioni per ognuno. Si tratta di oltre 100.000 voci nel database. Questo occupa spazio di archiviazione e, anche con gli indici del database, a volte può danneggiare le prestazioni.
WP Rocket offre la possibilità di eliminare le seguenti voci:
- Revisioni
- Bozze automatiche
- Articoli cestinati
Leggi il nostro post di approfondimento su come ottimizzare le revisioni per ottenere prestazioni migliori.
Pulizia dei commenti
Analogamente alle revisioni, nel tempo i commenti spam e cestinati possono aumentare lo spazio sprecato. WP Rocket offre la possibilità di eliminare i seguenti elementi:
- Commenti spam
- Commenti cestinati
Se non si usano i commenti sul sito WordPress, consigliamo semplicemente di disabilitare i commenti per evitare che lo spam arrivi. Inoltre, non bisognerà preoccuparsi di installare un plugin antispam.
Pulizia dei transient
I transient di WordPress sono talvolta trascurati, ma sono molto importanti! Infatti, abbiamo visto che una cache transitoria danneggiata ha mandato completamente in tilt un sito WordPress. Questi sono destinati ad essere temporanei e quindi è sicuro rimuoverli e consigliamo di farlo. Se sono necessari per un plugin, verranno rigenerati automaticamente. WP Rocket offre la possibilità di eliminare tutti i transient.
Pulizia del database
L’opzione di pulizia del database riduce il sovraccarico delle tabelle del database. Tuttavia, in Kinsta utilizziamo InnoDB invece di MyISAM e quindi di solito non è necessaria. È stato dimostrato che InnoDB ha prestazioni migliori ed è più affidabile. Un’importante ragione per utilizzare InnoDB rispetto a MyISAM è quella di sfruttare il locking a livello di riga. Questo permette alle query del database di essere eseguite più velocemente. Se si migra il sito WordPress su Kinsta, questa è una delle tante ottimizzazioni che i nostri tecnici effettuano sul sito.
Pulizia automatica
WP Rocket offre anche la possibilità di programmare la pulizia automatica del database su base giornaliera, settimanale o mensile. Questa operazione viene programmata con un cron job dietro le quinte.
CDN
Nel menu “CDN” è possibile attivare una rete di distribuzione dei contenuti di terze parti. Si tratta di un’opzione davvero fondamentale per quanto riguarda le prestazioni. Questi network tolgono il carico al server web e accelerano la distribuzione dei contenuti ai visitatori, migliorando così la loro esperienza. Secondo noi ogni sito dovrebbe utilizzare un CDN.
Per i clienti di Kinsta, questo menu non sarà necessario perché il CDN di Kinsta viene distribuito automaticamente sul sito dietro le quinte.
Consigliamo di eseguire prima un test di velocità del sito WordPress per verificare che tutte le risorse (JS, CSS e immagini) vengano caricate dal CDN di Kinsta.
Heartbeat
Heartbeat è un’API del Core di WordPress per il server polling. Viene utilizzata da molti temi e plugin per mantenere un flusso di connessione con il server. Questo permette agli sviluppatori di WordPress di inserire aggiornamenti in tempo reale nei loro prodotti.
Di default, il codice Heartbeat lato client viene eseguito ogni 15-60 secondi. A seconda della configurazione del sito e del server, potrebbero non essere necessari ping frequenti del server Heartbeat.
Con WP Rocket, è possibile ridurre gli intervalli di ping Heartbeat a 2 minuti o disabilitare completamente i ping per il backend del sito (dashboard WP), il frontend e l’editor dei post.
Per la maggior parte dei siti, consigliamo di utilizzare l’opzione “Riduci attività”. Molti plugin e temi moderni garantiscono Heartbeat per le funzionalità principali, quindi disabilitarlo del tutto potrebbe danneggiare il sito.
Componenti aggiuntivi
Nella sezione “Componenti aggiuntivi”, WP Rocket offre la possibilità di aggiungere servizi aggiuntivi al sito come Cloudflare, Sucuri, Google Analytics e Facebook Pixel. Se si usa uno di questi servizi, consigliamo di configurarli tramite WP Rocket per garantirsi un’integrazione ottimale.
Se si stanno già utilizzando altri plugin per integrare questi servizi nel sito, è possibile tranquillamente rimuoverli dopo aver configurato il componente aggiuntivo in WP Rocket.
Ottimizzazione delle immagini
Gli sviluppatori di WP Rocket sono gli stessi che hanno creato Imagify, uno dei nostri servizi di ottimizzazione delle immagini preferiti. Se si sta cercando un plugin per WordPress per ottimizzare le immagini facile da usare, consigliamo di dare un’occhiata a Imagify. Scopri di più sull’ottimizzazione delle immagini e su altre soluzioni di ottimizzazione.
Test finali di velocità
Abbiamo quindi eseguito alcuni speed test finali con tutti gli elementi abilitati, in modo vedere il prima e il dopo. Nota: questo sito WordPress è ospitato su Kinsta.
Prima di WP Rocket
Abbiamo eseguito cinque test in PageSpeed Insights senza WP Rocket.
Dopo WP Rocket
Abbiamo eseguito un nuovo test in Google PageSpeed Insights con WP Rocket.
Abbiamo anche eseguito un test di PageSpeed Insights con l’edge cache attivata su Kinsta. Abbiamo notato che il tempo di risposta iniziale del server è migliorato da ~370ms senza edge cache a 30ms. È utile quando si serve un pubblico proveniente da più zone geografiche.
Ecco cosa emerge dai risultati dei test:
- WP Rocket va oltre le opzioni di cache e offre potenti funzioni per ottimizzare i file CSS e JS, le immagini e altro.
- Il sito che abbiamo utilizzato per il test è già abbastanza ottimizzato. Tuttavia, richiede ancora una messa a punto per garantire i risultati e la conformità con i Core Web Vitals.
- Se si usano i video di YouTube, si potrebbe vedere una riduzione dei tempi di caricamento fino al 50% o più. Questo è possibile grazie alla funzione di WP Rockets che sostituisce i video di YouTube con anteprime cliccabili. È davvero comodo!
- Nei nostri test di Google PageSpeed Insights, abbiamo registrato un aumento del punteggio da 69/100 a 100/100. Anche se i punteggi non sono importanti quanto i tempi di caricamento complessivi – ne parliamo nel nostro articolo su Google PageSpeed Insights -, i Core Web Vitals fanno parte dell’ultimo fattore di ranking SEO e abbiamo visto un grande miglioramento anche nei loro voti.
Come è possibile vedere qui sopra, WP Rocket rende incredibilmente facile rendere più veloce un sito WordPress con pochi semplici clic!
Riepilogo
Il team di WP Rocket rilascia costantemente nuove funzionalità che si allineano direttamente alle raccomandazioni sulle prestazioni web di Kinsta. Siamo felici che i nostri clienti possano ora utilizzare questo plugin senza particolari modifiche.
Brian ha una grande passione per WordPress, lo usa da più di dieci anni e sviluppa anche un paio di plugin premium. Brian ama i blog, i film e le escursioni. Entra in contatto con Brian su Twitter.
