Siamo sempre alla ricerca di modi innovativi per velocizzare e ottimizzare ulteriormente i vostri siti. Negli ultimi due mesi, il nostro team ha lavorato dietro le quinte con il team di sviluppo di WP Rocket per coordinare alcune modifiche della nuova versione 3.0 del loro plugin (rilasciata il 3 aprile 2018). Siamo felici di annunciare che WP Rocket 3.0 e Kinsta sono ora completamente compatibili e lo saranno da qui in avanti.
Scoprite qui di seguito tutto quello che c’è da sapere sull’utilizzo di WP Rocket con Kinsta e su come può rivelarsi un’accoppiata vincente per il vostro business.
Usare WP Rocket su Kinsta
Per coloro che non conoscono WP Rocket, si tratta di un popolare plugin premium all-in-one per il caching e l’ottimizzazione di WordPress. Normalmente non permettiamo l’utilizzo di plugin di caching nel nostro ambiente perché entrano in conflitto con la nostra soluzione di caching integrata. Tuttavia, a partire da WP Rocket 3.0, la sua funzionalità di caching delle pagine verrà automaticamente disabilitata se eseguita sui server Kinsta. Di conseguenza, permetteremo l’uso di WP Rocket sulla nostra piattaforma perché non ci sarà, di fatto, più alcuna incompatibilità.
Questo vi permetterà di usare la soluzione di caching di Kinsta e di sfruttare le straordinarie funzioni di ottimizzazione che WP Rocket ha da offrire (ne parleremo più avanti).
Perché la cache è importante? La cache è il processo di 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 i ritardi dovuti alla dipendenza di WordPress da PHP e da un database (leggete di più su WordPress vs HTML statico).
Caratteristiche di WP Rocket 3.0
Se non avete ancora dato un’occhiata alla nuova versione 3.0 di WP Rocket, l’interfaccia utente è bellissima e allo stesso tempo facile da usare e da navigare! Di seguito vi illustreremo alcune delle funzioni consigliate di WP Rocket per velocizzare il vostro sito WordPress, oltre alla sincronizzazione con l’ambiente Kinsta.
Eseguiremo anche alcuni test di velocità per vedere quali sono le opzioni che hanno il maggior impatto su un sito live. Ricordate però che i risultati possono variare da un sito all’altro, quindi assicuratevi di eseguire i test sul vostro sito o su un sito di staging.
Se state usando 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 conteggio complessivo delle licenze. Lo stesso vale per l’esecuzione su localhost.
Cancellare la cache
Anche se la cache è automaticamente disabilitata in WP Rocket quando funziona su Kinsta, l’opzione “Cancella cache” nel menu di WP Rocket è sincronizzata con l’ambiente di Kinsta. Se cancellate la cache di WP Rocket, viene eliminata anche la cache di Kinsta dell’intero sito. Fantastico, no? E come sempre, potete cancellare la cache di Kinsta dalla barra di amministrazione in alto a destra.
Anche l’opzione “Cancella questo URL” funziona allo stesso modo, ma invece di cancellare l’intera cache del sito, cancella la cache dell’URL in cui vi trovate. È un’ottima soluzione se avete effettuato un aggiornamento manuale di una pagina o di un post.
Per ragioni di performance, non consigliamo di cancellare costantemente l’intera cache del sito, perché poi dovrà essere ricostruita. È molto meglio cancellare i singoli URL.
Se cambiate qualcosa sul vostro sito WordPress, come un plugin o un tema, potreste vedere un avviso da parte di WP Rocket. Il pulsante Cancella cache qui cancella anche la cache di Kinsta.
Infine, se fate clic sul pulsante “Cancella cache” dal cruscotto di WP Rocket, cancellate anche la cache di Kinsta.
Cache
Come abbiamo detto in precedenza, la memorizzazione della cache delle pagine di WP Rocket è automaticamente disabilitata per i siti ospitati su Kinsta. Pertanto, vi consigliamo di lasciare le impostazioni della cache di WP Rocket così come sono, selezionando la voce “Abilita la cache per i dispositivi mobili”.
Ottimizzazione dei file
Nel menu “Ottimizzazione dei file” avete la possibilità di ottimizzare i vostri file CSS e JavaScript. Approfondiamo un po’ ognuno di questi aspetti.
Impostazioni di base
- Minificazione HTML: la minificazione dell’HTML rimuove gli spazi bianchi e i commenti per ridurre le dimensioni. Abbiamo eseguito dei test di velocità e abbiamo riscontrato una diminuzione dello 0,84% del tempo di caricamento con questa opzione attivata. non è detto che questa funzione porti a dei miglioramenti eclatanti, ma in generale una riduzione degli spazi bianchi e del codice è una cosa positiva.
- Combinare i file di Google Fonts: la combinazione dei Google Fonts riduce il numero di richieste HTTP. Se usate un host con HTTP/2 abilitato, non è più consigliabile combinare i file a causa dei miglioramenti apportati alla parallelizzazione. Kinsta supporta pienamente HTTP/2. Anche il caricamento dei font dal vostro CDN può talvolta migliorare le prestazioni. Consultate la nostra guida su come ospitare i font locali.
- Rimuovere le stringhe di query dalle risorse statiche: i vostri file CSS e JavaScript di solito hanno la versione del file alla fine dei loro URL, come per esempio
domain.com/style.css?ver=4.6. Alcuni server e proxy server non sono in grado di memorizzare nella cache le stringhe di query, anche se è presente l’intestazionecache-control:public. Per questo motivo, rimuovendole, a volte è possibile migliorare la cache. Abbiamo eseguito dei test di velocità e abbiamo riscontrato una diminuzione del tempo di caricamento dell’1,86% con questa opzione attivata. Nota: non è possibile usare questa opzione insieme a quella di minificare i CSS o i JavaScript.
File CSS
- Minificare i file CSS rimuove gli spazi bianchi e i commenti per ridurre le dimensioni del file. Abbiamo eseguito dei test di velocità e abbiamo riscontrato una riduzione dell’1,69% del tempo di caricamento con questa opzione attivata. A causa del funzionamento dei CSS, questa operazione potrebbe danneggiare il vostro sito, quindi assicuratevi di testarla. Anche in questo caso, in generale, meno spazi bianchi e meno codice sono una buona cosa.
- Unire i file CSS unisce tutti i vostri file in uno solo, riducendo le richieste HTTP. Se usate un host con HTTP/2 abilitato, non è più consigliabile combinare i file perché ora possono essere caricati in parallelo su un’unica connessione. Kinsta supporta pienamente HTTP/2. Per saperne di più sulla combinazione di CSS esterni leggete qui.
- Ottimizzare la distribuzione dei CSS elimina i CSS che bloccano il rendering sul vostro sito web per velocizzare i tempi di caricamento. Per saperne di più, leggete i nostri articoli di approfondimento sui CSS che bloccano il rendering e sull’ottimizzazione del percorso di rendering critico. Abbiamo eseguito dei test di velocità e abbiamo riscontrato una diminuzione dello 0,17% del tempo di caricamento con questa opzione attivata. Ricordate però che si tratta più di un tempo di caricamento percepito che di un tempo di caricamento effettivo.
File JavaScript
- Minificare JavaScript rimuove gli spazi bianchi e i commenti per ridurre le dimensioni del file. Abbiamo eseguito dei test di velocità e abbiamo riscontrato una diminuzione dello 0,84% del tempo di caricamento con questa opzione attivata. A causa del modo in cui funziona JavaScript, questa operazione potrebbe interrompere la funzionalità dei vostri plugin o del tema, quindi assicuratevi di testarla.
- Combinare i file JavaScript combina le informazioni JS del vostro sito in un numero minore di file, riducendo le richieste HTTP. Se usate un host con HTTP/2 abilitato, non è più consigliabile combinare i file perché ora possono essere caricati in parallelo su un’unica connessione. Kinsta supporta pienamente HTTP/2.
- Caricare JavaScript in differita elimina i JS che bloccano il rendering sul vostro sito e può migliorare i tempi di caricamento. Per saperne di più, leggete i nostri articoli di approfondimento sui JavaScript che bloccano il rendering. Se non fate attenzione, questa soluzione può anche distruggere il vostro sito, quindi fate prima dei test. Abbiamo eseguito dei test di velocità e abbiamo riscontrato una riduzione dell’1,35% del tempo di caricamento con questa opzione attivata.
Se siete clienti di Kinsta e usate la funzione di minificazione del codice integrata nel cruscotto di MyKinsta, verificate con il supporto se entrambe le opzioni sono valide.
Media
Nel menu “Media” avete la possibilità di caricare con lazy loading le immagini e i video, oltre a disabilitare il caricamento di script aggiuntivi come le Emoji e gli Embed. Approfondiamo un po’ ognuna di queste opzioni.
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 “below the fold”. Attivando l’opzione di lazy loading è possibile migliorare il tempo di caricamento effettivo e percepito, poiché le immagini, gli iframe e i video vengono caricati solo quando entrano (o stanno per entrare) nel viewport e riducono il numero di richieste HTTP.
- Lazy loading per le immagini: abbiamo eseguito dei test di velocità e abbiamo riscontrato una riduzione del 3,89% del tempo di caricamento con questa opzione attivata.
- Lazy loading per iframes e video: abbiamo inserito otto video di YouTube in una pagina e abbiamo notato una riduzione del 74,43% del tempo di caricamento con questa opzione attivata. WP Rocket ha un’opzione per sostituire automaticamente un video di YouTube con la sua immagine di anteprima. Questo è un modo incredibilmente efficace per velocizzare i video sul vostro sito WordPress.
Date un’occhiata al nostro tutorial approfondito sul lazy loading in WordPress.
Emoji
Con il rilascio di WordPress 4.2 è arrivata l’integrazione delle emoji nel core per i browser più vecchi. Il problema principale è che genera un’ulteriore richiesta HTTP sul vostro sito WordPress per caricare il file wp-emoji-release.min.js. E questo viene caricato su ogni singola pagina.
Disabilitare le emoji: l’opzione di disabilitazione delle emoji riduce il numero di richieste HTTP. Non le interromperà, ma semplicemente tornerà alla versione emoji del browser dell’utente. Abbiamo eseguito dei test di velocità e abbiamo riscontrato una diminuzione del 2,2% del tempo di caricamento con questa opzione attivata.
Consultate il nostro articolo di approfondimento sulla disattivazione delle emoji.
Embed
Con il rilascio di WordPress 4.4 è stata introdotta la funzione oEmbed nel core. Probabilmente l’avete già vista o usata. Questa funzione consente agli utenti di incorporare video di YouTube, tweet e molte altre risorse nei loro siti semplicemente incollando un URL, che WordPress converte automaticamente in un embed e fornisce un’anteprima dal vivo nell’editor visuale. Se avete un embed di Facebook nel vostro sito, scoprite come il nuovo aggiornamento di Facebook lo influenzerà e come risolverlo.
Tuttavia, ciò significa che ora il vostro sito WordPress genera una richiesta HTTP aggiuntiva per caricare il file wp-embed.min.js. E questo viene caricato su ogni singola pagina.
Disabilitare gli embed di WordPress: L’opzione di disabilitazione degli embed riduce il numero di richieste HTTP. Abbiamo eseguito dei test di velocità e abbiamo riscontrato una diminuzione del 4,9% del tempo di caricamento con questa opzione attivata. Date un’occhiata al nostro articolo di approfondimento sulla disattivazione degli embed.
Precaricamento
Nel menu “Precaricamento” è possibile attivare il preload della cache, il prefetch DNS e il preload dei font. Non tutte queste opzioni funzionano su Kinsta. Ma analizziamo un po’ ciascuno di questi aspetti.
Precaricamento della cache
Non raccomandiamo questa opzione per i siti ospitati su Kinsta perché può effettivamente ridurre le prestazioni sovraccaricando i PHP worker.
Prefetching delle richieste DNS
Il prefetching DNS vi permette di risolvere i nomi di dominio (eseguendo una ricerca DNS in background) prima che l’utente faccia clic su un link, il che può contribuire a migliorare le prestazioni. Questo avviene aggiungendo un tag rel="dns-prefetch" nell’intestazione del vostro sito WordPress. Vi consigliamo di aggiungere il prefetch alle richieste esterne provenienti da CDN, Google Fonts e Google Analytics. Ecco un esempio:
<link rel="dns-prefetch" href="//cdn.domain.com/">
<link rel="dns-prefetch" href="//fonts.googleapis.com/">
<link rel="dns-prefetch" href="//www.google-analytics.com">È più difficile fare un test di velocità, ma potete essere certi che aiuterà a velocizzare il vostro sito.
Precaricare i font
Se i font sono ospitati sul vostro dominio e non su un servizio esterno come Google Fonts, vi consigliamo di aggiungerli all’elenco “Precarica Font” di WP Rocket. Precaricando i font nell’elemento <head> del vostro HTML, i browser web possono iniziare a scaricare i font prima che vengano scoperti nel vostro file CSS.
Impostazioni avanzate
Dato che WP Rocket si sincronizza con la cache dell’ambiente Kinsta, non potete usare le impostazioni avanzate. Se avete bisogno di escludere un URL o una directory dalla cache o di forzare la cache di una determinata stringa di query, potete sempre contattare il team di supporto di Kinsta.
Database
Nel menu “Database” WP Rocket vi offre la possibilità di eseguire la pulizia di post, commenti, transienti e tabelle.
In combinazione con le nostre ottimizzazioni automatiche settimanali del database, mantenere il database pulito rimuovendo le revisioni dei post e i transienti non necessari garantirà al vostro database di lavorare al massimo delle prestazioni.
Pulizia dei post
Non è raro che i siti più vecchi abbiano più di 100 revisioni sulle loro pagine principali. Questo è dovuto semplicemente ad anni di modifiche e aggiornamenti dei contenuti. Supponiamo, per esempio, che un sito abbia 700 pagine o post con 150 revisioni per ciascuno, il che equivale a 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 vi offre la possibilità di eliminare le seguenti voci:
- Revisioni
- Bozze automatici
- Articoli cestinati
Date un’occhiata al nostro articolo di approfondimento su come ottimizzare le revisioni per ottenere prestazioni più veloci.
Pulizia dei commenti
Come per le revisioni, anche i commenti spam e quelli cestinati possono semplicemente aggiungere spazio sprecato nel corso del tempo. WP Rocket vi offre la possibilità di eliminare i seguenti commenti:
- Commenti di spam
- Commenti cestinati
Se non usate i commenti sul vostro sito WordPress, vi consigliamo di disabilitare i commenti per evitare che lo spam arrivi. Inoltre, non dovrete preoccuparvi di installare i plugin antispam.
Pulizia dei transienti
I transienti in WordPress a volte vengono trascurati, ma sono molto importanti! Abbiamo visto per esempio una cache di transienti danneggiata che ha mandato in tilt un sito WordPress. Questi dati sono destinati a essere temporanei e quindi rimuoverli è sicuro, e lo consigliamo. Se necessari per un plugin, verranno rigenerati automaticamente. WP Rocket vi offre la possibilità di eliminare i seguenti elementi:
- Transienti scaduti
- Tutti i transienti
Pulizia del database
L’opzione di pulizia del database riduce l’overhead delle tabelle del database. Tuttavia, in Kinsta usiamo InnoDB invece di MyISAM e quindi di solito non è necessaria. InnoDB ha dimostrato di avere prestazioni migliori e di essere più affidabile. Un’importante ragione per usare InnoDB rispetto a MyISAM è quella di sfruttare il locking a livello di riga. Questo permette alle query del database di essere elaborate più velocemente. Se migrate il vostro sito WordPress su Kinsta, questa è una delle tante ottimizzazioni che i nostri ingegneri effettuano sul vostro sito.
Pulizia automatica
WP Rocket vi 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” potete 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 vostro server web e accelerano la distribuzione dei contenuti ai vostri visitatori, migliorando così la loro esperienza. Scoprite perché secondo noi ogni sito dovrebbe usare un CDN.
Se siete clienti Kinsta, questo menu non sarà necessario perché il CDN di Kinsta viene distribuito automaticamente sul vostro sito dietro le quinte.
Vi 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 monitoraggio dei server. Viene usato 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.
Per impostazione predefinita, il codice Heartbeat lato client viene eseguito ogni 15-60 secondi. A seconda della configurazione del vostro sito e del server, potrebbero non essere necessari frequenti ping del server Heartbeat.
Con WP Rocket, potete ridurre gli intervalli di ping Heartbeat a 2 minuti o disabilitare completamente i ping per il backend del vostro sito (bacheca WP), il frontend e l’editor degli articoli.
Per la maggior parte dei siti, consigliamo di usare l’opzione “Riduci attività”. Molti plugin e temi moderni fanno uso di Heartbeat per le funzionalità principali, quindi disabilitarlo completamente potrebbe potenzialmente danneggiare il vostro sito.
Add-on
Nella sezione “Add-On” WP Rocket vi dà la possibilità di aggiungere servizi aggiuntivi al vostro sito come Cloudflare, Sucuri, Google Analytics e Facebook Pixel. Se usate uno di questi servizi sul vostro sito, vi consigliamo di configurarli tramite WP Rocket per assicurarvi di beneficiare di un’integrazione ottimale di questi servizi.
Se state già usando altri plugin per integrare questi servizi nel vostro sito, potete 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 state cercando un plugin per WordPress facile da usare per ottimizzare le immagini, date un’occhiata a Imagify. E fate clic per saperne di più sull’ottimizzazione delle immagini e su altri plugin e soluzioni di ottimizzazione.
Test finali di velocità
Abbiamo quindi eseguito alcuni test di velocità finali con tutti gli elementi abilitati, in modo da poter vedere il prima e il dopo. Nota: questo sito WordPress è ospitato da Kinsta.
Prima di WP Rocket
Abbiamo eseguito 5 test in Pingdom senza WP Rocket e abbiamo fatto una media.
Abbiamo poi eseguito un test in Google PageSpeed Insights senza WP Rocket.
Dopo WP Rocket
Abbiamo poi eseguito 5 test in Pingdom con WP Rocket e le opzioni attivate e abbiamo fatto una media.
Abbiamo poi eseguito un test in Google PageSpeed Insights con WP Rocket.
Ecco i risultati ottenuti:
- Nei nostri test Pingdom, abbiamo riscontrato una diminuzione del 9,12% del tempo di caricamento totale con WP Rocket. Sebbene non sembri un valore elevato, questo risultato è stato ottenuto in pochi minuti e con meno di 10 clic.
- Ricordate che WP Rocket si basa sulla sua soluzione di caching. Ma noi di Kinsta usiamo già la nostra cache integrata, quindi condividiamo solo i risultati delle altre funzioni di ottimizzazione. In realtà si tratta di un miglioramento del 9% rispetto alla velocissima cache di Kinsta.
- Il sito che abbiamo utilizzato per il test è già abbastanza ottimizzato. I siti più grandi e quelli che non sono così ottimizzati vedranno facilmente risultati ancora maggiori.
- Siete curiosi di sapere perché ci sono richieste aggiuntive nella versione finale? Di solito ciò è dovuto al lazy loading delle immagini che crea richieste vuote a
data:image/gif;base64. Ma non preoccupatevi, sarà comunque più veloce. - Se ospitate dei video, potreste vedere una riduzione del tempo di caricamento fino al 50% o più. Questo è possibile grazie alla funzione WP Rockets che sostituisce i video di YouTube con anteprime cliccabili. È davvero comodo!
- Nei nostri test di Google PageSpeed Insights, abbiamo visto un aumento del punteggio da 88/100 a 98/100. Tuttavia, i punteggi non sono importanti quanto i tempi di caricamento complessivi, quindi prendeteli con le molle. Ne parliamo nel nostro articolo su Google PageSpeed Insights.
Come potete vedere qui sopra, WP Rocket rende incredibilmente facile velocizzare il vostro sito WordPress con pochi semplici clic!
Riepilogo
Il team di WP Rocket propone costantemente nuove funzionalità che si allineano direttamente con le raccomandazioni sulle prestazioni web che condividiamo su Kinsta. Nei prossimi mesi potrete vedere un’integrazione ancora più stretta con il loro plugin! Siamo entusiasti che i nostri clienti possano finalmente usare questo plugin senza dover apportare ulteriori modifiche.
Ci piacerebbe sapere cosa ne pensate. Usate WP Rocket? Fatecelo sapere qui sotto nei commenti.
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.
Lascia un commento