La guida definitiva per velocizzare il tuo sito web Divi

Divi non è solo un generatore di pagine. Divi porta il processo di progettazione a un livello completamente nuovo con un sistema di progettazione web completo che ti consente di progettare visivamente ogni parte del tuo sito web, senza dover dipendere così tanto da complicati software di progettazione di terze parti (come Photoshop o Sketch). Ciò significa che il tema Divi (e il plug-in Divi Builder) richiederanno più risorse rispetto, ad esempio, al tema di base di WordPress TwentyNineteen. Ma questo non significa che Divi debba essere lento.

In effetti, Divi ha molti miglioramenti delle prestazioni che sono stati aggiunti negli aggiornamenti precedenti che hanno reso i siti Divi (e Divi Builder) più veloci che mai. Inoltre, Divi è stato creato pensando all'ottimizzazione di terze parti. Molti dei plug-in di ottimizzazione delle prestazioni utilizzati per WordPress possono essere utilizzati anche per aumentare le prestazioni di velocità per il tuo sito Web Divi.

In questo post, esploreremo cosa è stato già fatto per velocizzare Divi e cosa possiamo fare per renderlo ancora più veloce. Ecco alcuni argomenti chiave che tratteremo:

• Come viene visualizzato un sito web
• Prestazioni di velocità Divi integrate
• Ottimizzazione del database
• Ottimizzazione DNS
• Buon hosting
• Ottimizzazione TTFB
• memorizzazione nella cache
• Minificazione e aggregazione
• Compressione Gzip
• CDN
• Ottimizzazione dell'immagine
• Ottimizzazione video
• Usa plugin di qualità
• Esecuzione di test di velocità
• Altri suggerimenti
• Come evitare possibili conflitti con plugin di terze parti
• Elenco rapido di pratiche e risorse suggerite

Vantaggi di un sito Web Divi veloce

È inutile fare di tutto per convincerti che hai bisogno di un sito web più veloce. Ma qui ci sono alcuni vantaggi evidenti che non puoi ignorare.

• Frequenza di rimbalzo ridotta: i visitatori non lasceranno molto il tuo sito.
• Aumento delle conversioni: far funzionare il tuo sito più rapidamente può portare a conversioni migliori.
• SEO: a Google piacciono i siti ottimizzati per la velocità.
• Credibilità: i siti Web lenti creano una brutta prima impressione per i tuoi visitatori.

Quanto è veloce abbastanza?

In generale, un buon obiettivo è caricare le tue pagine web in 3 secondi o meno. Anche se sembra che la maggior parte dei clienti si aspetti che siano 2 secondi o meno in questi giorni. Ma ovviamente, ogni sito Web e pagina Web è diverso.

Come viene visualizzato un sito Web Divi

Per capire come velocizzare il tuo sito Divi, può essere utile capire cosa comporta la visualizzazione di un sito web. Naturalmente, questo non è esclusivo di Divi. Questo si applica alla maggior parte dei siti Web WordPress.

Ecco cosa succede..

1. Immettere un URL (o fare clic su un collegamento) alla pagina Web che si desidera visitare.
2. Il tuo browser trova l'indirizzo IP per quell'URL attraverso il tuo DNS (Domain Name Server) e fa una richiesta per quell'indirizzo IP su un server web (dove ospiti il ​​tuo sito).
3. Il server web (di solito Apache) riceve la richiesta e quindi recupera la pagina web che ha memorizzato (quella che hai progettato in Divi e pubblicata in WordPress).
   • Ma poiché la pagina si basa su CSS e JavaScript esterni utilizzati da WordPress e dal tema Divi, anche questi devono essere scaricati dal server.
   • La pagina contiene anche PHP utilizzato per recuperare dati (come immagini) dal database MySQL.
4. Una volta che tutte le risorse necessarie sono state recuperate dal server e dal database, la pagina viene finalmente servita al browser del client.

Questo può sembrare un sacco di passaggi solo per visualizzare una pagina web, ma per un sito WordPress, questo è abbastanza standard indipendentemente dal tema che usi. E se ci pensi, l'intero processo è piuttosto miracoloso. Ma sfortunatamente, è qualcosa che noi utenti diamo per scontato. Oggi ci aspettiamo che tutto questo accada in meno di 3 secondi.

Quindi cosa possiamo fare per aiutare il processo? Innanzitutto, dobbiamo riconoscere che quando si tratta di velocizzare un sito Web, ci sono cose che sfuggono al nostro controllo. Ad esempio, non hai alcun controllo sul tipo di browser utilizzato da un visitatore o sulla velocità della sua connessione Internet. Ma, a parte queste cose, ci sono cose che possiamo e dovremmo fare per rendere il nostro sito web Divi più veloce.

Per prima cosa, diamo un'occhiata ad alcune delle ottimizzazioni di velocità integrate che Divi ha già.

Prestazioni di velocità Divi integrate

Generazione di file CSS statici

I primi miglioramenti delle prestazioni di velocità di Divi sono arrivati ​​con la generazione di file CSS statici.

Prima di questo aggiornamento, tutti i CSS generati da Divi Builder venivano forniti in linea a piè di pagina. Ma con questo miglioramento, Divi ora prenderà tutti i CSS creati da Divi Builder (e aggiunti a Theme Customizer e Theme Options) e li servirà come file CSS statico che è stato automaticamente minimizzato per te. Ciò riduce le dimensioni del documento di una pagina e consente al browser di fornire una versione cache del file CSS statico per un caricamento più rapido della pagina.

Puoi scegliere di abilitare o disabilitare questa opzione nelle opzioni del tema o nelle impostazioni della pagina.

Minificazione e aggregazione di file CSS e JavaScript e consegna ottimizzata dei caratteri di Google

La seconda ondata di miglioramenti delle prestazioni della velocità Divi ha migliorato ulteriormente la velocità di caricamento della pagina ottimizzando la consegna di CSS, JavaScript e Google Fonts.

L'aggiornamento includeva quanto segue:

• Minimizzazione di file CSS e JavaScript : Divi minimizzerà automaticamente tutti i file CSS e JavaScript del tema, riducendo le dimensioni della pagina e migliorando i tempi di caricamento.
• Combinazione di file CSS e JavaScript : ora Divi aggregherà (o combinerà) automaticamente tutte le risorse CSS e JavaScript in un unico file. Ciò riduce le richieste totali sulla pagina e accelera i tempi di caricamento per i tuoi visitatori.
• Ottimizzazione della richiesta di caratteri di Google : Divi ottimizza la consegna dei caratteri di Google combinando le richieste di caratteri e rimuovendo i file di caratteri duplicati. Per le pagine che utilizzano vari caratteri personalizzati, questo aggiornamento consentirà di accelerare i tempi di caricamento.

Puoi anche abilitare o disabilitare queste opzioni nelle opzioni del tema.

Un tema Divi più veloce e un generatore visivo

Sebbene la maggior parte si preoccupi della velocità di caricamento del proprio sito Divi per i visitatori sul front-end, aiuta anche ad avere un back-end più veloce. Anche gli sviluppatori (e i clienti) vogliono essere in grado di modificare e progettare il proprio sito Web Divi con velocità.

Ecco perché la terza ondata di miglioramenti della velocità e delle prestazioni Divi includeva aggiornamenti sia al tema Divi che al Divi Builder. Utilizzando meccanismi di memorizzazione nella cache creativi e altre ottimizzazioni delle prestazioni, le velocità di caricamento delle pagine sono state migliorate nelle installazioni Divi standard. Inoltre, WordPress Admin e Divi Builder funzionano molto più velocemente, rendendo il processo di modifica e progettazione molto più rapido.

La memorizzazione nella cache è dietro le quinte e ha più a che fare con il modo in cui viene generato Divi HTML/CSS e non con il modo in cui le pagine vengono servite ai visitatori. Questo vale per i file dei temi Divi. Divi non tenta di memorizzare nella cache, minimizzare o combinare file di terze parti. Quindi c'è ancora spazio per ulteriori miglioramenti utilizzando la memorizzazione nella cache di terze parti e plug-in di prestazioni che minimizzeranno e combineranno CSS o JavaScript aggiuntivi utilizzati dal tuo sito (come quelli inclusi nel tuo tema Divi Child o altri plug-in di terze parti) e forniranno la cache pagine HTML statiche per i visitatori.

Stato del sistema Divi

Sebbene non sia tecnicamente un miglioramento della velocità, l'aggiornamento di Divi per includere un rapporto sullo stato del sistema integrato aiuterà sicuramente a identificare eventuali problemi con l'ambiente del tuo sito Web che potrebbero causare tempi di caricamento della pagina più lenti.

Ad esempio, lo stato del tuo sistema potrebbe mostrare che stai utilizzando una versione precedente di PHP che potrebbe rallentare il tuo sito. Si consiglia di utilizzare l'ultima versione stabile di PHP. Ciò non solo garantirà la compatibilità con WordPress e Divi, ma accelererà anche il tuo sito Web portando a meno memoria e problemi relativi alla CPU. Per ulteriori informazioni, consulta il nostro post su come aggiornare la tua versione PHP.

Rendi il tuo sito Divi ancora più veloce

Rendere più veloce il tuo sito Divi richiede molti degli stessi miglioramenti delle prestazioni necessari per la maggior parte dei siti Web WordPress. Quelli di voi che hanno utilizzato WordPress potrebbero aver già fatto alcune o tutte queste ottimizzazioni. Si spera che questi suggerimenti ti aiutino a portare la velocità del tuo sito Web Divi al livello successivo.

Ottimizzazione e pulizia del database

A differenza dei siti HTML statici, WordPress è un CMS dinamico che utilizza PHP per recuperare i dati archiviati in un database MySQL al fine di visualizzare tali dati su una pagina web. Ciò semplifica la gestione del tuo sito, ma lo svantaggio è che impiega più tempo a caricare le pagine perché deve individuare i dati nel database prima di caricare la pagina. In generale, i siti Web HTML statici saranno più veloci dei siti Web WordPress per questo motivo.

Un modo per mantenere un sito Divi il più veloce possibile è assicurarsi di avere un database pulito. I file del sito WordPress sono organizzati nel tuo database per tabelle e ogni volta che aggiungi nuovi dati al tuo sito (come temi e plugin), crei nuove tabelle e più dati. Come ci si aspetterebbe, più disordinato è il database, più difficile sarà trovare i dati. Questo porta a un sito web più lento.

Quindi, se hai aggiunto il tema Divi al tuo sito Web dopo anni di tentativi di altri temi e innumerevoli plug-in, è probabile che tu abbia archiviato alcuni dati che non ti servono più. Anche se disinstalli un plugin, non significa che tutti i dati siano andati nel database. I plug-in amano lasciare alcuni dati lì nel caso in cui reinstalli il plug-in. Non è bello, lo so. Questi dati rimasti possono portare a un disordine inutile e rallentare il tuo sito.

Proprio come ogni organizzazione umana ha bisogno di lavorare in modo più efficiente, ogni sito WordPress (Divi o meno) ha bisogno di un database pulito per caricare le pagine più velocemente. Quindi, se hai il tuo sito web da un po', pulirlo può velocizzare notevolmente le cose.

Suggerirei di utilizzare un plugin per questo. WP Optimize sembra essere un'opzione credibile. Ma ci sono altri plugin per database di WordPress da considerare.

Oppure, se sai cosa stai facendo, puoi sempre farlo manualmente in MySQL.

Oltre a ripulire il database di WordPress, potresti voler rendere WordPress ancora più leggero riducendo i dati che memorizza. Ad esempio, WordPress conserverà automaticamente gli elementi eliminati nel cestino per 30 giorni. Potresti voler ridurre quel periodo di tempo a 7.

Ottimizzazione DNS

La prima cosa che deve accadere quando un utente visita l'URL di una delle tue pagine web è chiamata ricerca DNS. Non appena l'URL viene inserito (o cliccato), l'ISP del visitatore invia una query DNS ai nameserver per trovare l'indirizzo IP associato al tuo dominio (ogni dominio/sito web ha un indirizzo IP specifico). In sostanza, una ricerca DNS è come cercare il tuo nome di dominio in una rubrica per trovare l'indirizzo IP per quel dominio.

Ma quando un utente visita una pagina del tuo sito, la pagina potrebbe avere più domini a cui è necessario accedere per richiamare la pagina. Quindi potresti fare 3 o 4 ricerche di dominio su un singolo caricamento di pagina (forse di più).

In generale, la maggior parte dei provider DNS gratuiti come Godaddy e Namecheap saranno generalmente più lenti di quanto probabilmente vorrai.

La migliore opzione gratuita disponibile per aumentare la velocità di ricerca DNS è probabilmente Cloudflare. Hanno le prestazioni DNS più veloci registrate su DNSPerf.com. Questo sarà significativamente più veloce di GoDaddy e Namecheap. E puoi persino ottimizzare cloudflare da utilizzare per DNS senza i loro altri servizi (come CDN o WAF) se lo desideri.

Ad esempio, potresti voler utilizzare Cloudflare per DNS e sicurezza (rilevamento DDOS) e KeyCDN (o MaxCDN) per la tua CDN. Sembra che sarebbe un'ottima combinazione.

Configurazione di CloudFlare

Cloudflare è davvero facile da configurare. Non devi preoccuparti di cambiare il tuo hosting o altro in anticipo. Tutto quello che devi fare è seguire la loro configurazione di 5 minuti che inizia con l'inserimento del tuo dominio.

Recupereranno automaticamente i tuoi record DNS correnti.

La cosa principale che dovrai fare per completare la configurazione è cambiare i server dei nomi predefiniti sul tuo attuale provider DNS (come GoDaddy) con i server dei nomi di Cloudflare.

Quindi puoi gestire facilmente i tuoi DNS dalla loro Dashboard.

E così hai un aumento della velocità di ricerca DNS, più sicurezza e un CDN per il tuo sito web (e altro ancora).

Buon hosting

Se prendi sul serio la velocità (e le prestazioni) del tuo sito web, inizia con la scelta di un buon provider di hosting. In effetti, puoi fare tutto bene per ottimizzare il tuo sito Web per la velocità e avere ancora un sito lento a causa del tuo host. E i provider di hosting davvero validi faranno molte di queste ottimizzazioni della velocità per te, quindi non devi preoccupartene.

Tipi di hosting

Hosting tradizionale (condiviso)

Questo è di gran lunga il tipo di hosting più popolare per gli utenti di WordPress/Divi. Ma sfortunatamente, è l'opzione peggiore per l'ottimizzazione della velocità. Con l'hosting condiviso tradizionale, condividerai tutte le risorse disponibili di un server con altri. Poiché stai condividendo, il costo per questo tipo di hosting è basso. Ma il rovescio della medaglia è che non puoi controllare la quantità di traffico che gli altri siti stanno ricevendo sul tuo server condiviso. Quindi puoi facilmente cadere preda di periodi di tempi di caricamento estremamente lenti e persino momenti in cui il tuo sito è completamente inattivo. Quindi è meglio avere una buona idea di quanto traffico può gestire il tuo hosting condiviso.

Hosting dedicato

Con l'hosting dedicato, hai il tuo server dedicato solo per te. Non c'è bisogno di condividere alcuna risorsa con nessun altro. Ciò significa che avrai tempi di caricamento rapidi più prevedibili e coerenti per il tuo sito web. Questo è solitamente offerto come opzione di livello superiore per le grandi aziende a un costo premium elevato.

Hosting VPS

L'hosting Virtual Private Server (VPS) è fondamentalmente una via di mezzo tra hosting condiviso e dedicato. Il tuo spazio sul server è "privato", il che significa che è completamente separato da tutti gli altri (una specie di gated community per i file del tuo sito). Quindi i file del tuo sito non sono esposti ad altri sul server. A differenza dell'hosting condiviso, un VPS ha una quantità dedicata di risorse di sistema (o energia) a tua disposizione per garantire che il tuo sito ottenga sempre ciò di cui ha bisogno per fornire tempi di caricamento rapidi in modo coerente. Quindi non dovrai preoccuparti dei picchi di traffico di altri siti Web che influiscono sulla velocità del tuo sito.

Ma, a meno che tu non abbia un VPS gestito, questo tipo di hosting è principalmente per quei tipi fai-da-te che sono abbastanza esperti di tecnologia da gestire le cose da soli. Per maggiori informazioni, ecco un confronto delle prestazioni tra l'hosting VPS e l'hosting condiviso.

Hosting cloud

Con il cloud hosting, hai accesso a una rete di server (nel cloud) anziché a un singolo server fisico. Ciò ti consente di estrarre tutte le risorse di cui hai bisogno da questa rete di server secondo necessità. In sostanza, si dispone di una partizione virtuale dello spazio del server supportata dalla potenza e dalle risorse dell'intera rete. Quindi non devi preoccuparti dei picchi di traffico come faresti nell'hosting condiviso. Il cloud hosting è estremamente flessibile e scalabile in base alle tue esigenze.

Una delle principali differenze tra l'hosting cloud e l'hosting VPS è che l'hosting VPS ha una quantità dedicata (o limitata) di risorse da cui estrarre che può o meno esaurirsi. Il Cloud Hosting, invece, è in grado di tenere a disposizione le tue risorse senza esaurirle perché può sempre prelevare dagli altri server nel cloud. In teoria, il cloud hosting offre alte velocità più coerenti e affidabili. Quindi, se prendi sul serio la velocità, il cloud hosting è un'ottima opzione (forse anche la migliore).

Hosting WordPress gestito

Hosting WordPress gestito di solito si riferisce all'hosting condiviso gestito da esperti di WordPress. Non è "privato" come un VPS o potente come un ambiente di hosting dedicato. Ma aiuta a massimizzare la velocità del tuo ambiente condiviso facendo lavorare gli esperti di WordPress. Lo fanno bene perché adattano i loro servizi e configurano i loro server esclusivamente per i siti WordPress. E molti di loro sono dotati di molte funzionalità integrate interessanti e convenienti come ambienti di staging con un clic, memorizzazione nella cache del sito, distribuzione CDN con un clic, backup automatici, SSL e altro ancora. Sono perfetti per quelli di noi che non vogliono fare affidamento su (o gestire) una serie di plug-in per l'ottimizzazione, la sicurezza e la gestione di base della velocità.

Società di hosting da considerare

Ci sono molte società di hosting WordPress là fuori. E se possibile, vorrai evitare l'hosting condiviso tradizionale (non gestito) se sei seriamente interessato all'ottimizzazione della velocità. Ma se hai un sito semplice e non sei disposto a pagare soldi extra per la gestione, Siteground sembra essere uno dei migliori per l'hosting condiviso.

Per ora, ecco un rapido elenco di host da considerare per un sito Web Divi più veloce.

• SiteGround : offre hosting condiviso, hosting WP gestito, hosting dedicato e cloud (visita SiteGround / la nostra recensione)
• Cloudways - è specializzato in hosting cloud gestito basato su SSD e ha anche gestito WP Hosting (visita Cloudways / la nostra recensione)
• Kinsta – è specializzato in hosting WP gestito (visita Kinsta / la nostra recensione)
• WPEngine – è specializzato in hosting WP gestito (visita WPEngine / la nostra recensione)
• Flywheel – è specializzato in hosting WP gestito (visita Flywheel / la nostra recensione)

Quella lista è la punta dell'iceberg. Sono sicuro che ce ne sono altri che funzioneranno alla grande per il tuo sito Divi/WordPress. Se stai cercando un sito di recensioni di hosting credibile, dai un'occhiata a Review Signal.

Puoi anche fare riferimento a questa guida per aiutarti a fare la tua scelta.

Ottimizzazione del tempo al primo byte (TTFB)

Il Time to First Byte (TTFB) è la quantità di tempo impiegata dall'utente per ricevere il primo byte di dati del sito Web dal tuo host/server. Quindi, quando un utente effettua una richiesta HTTP (carica la tua pagina web), il TTFB sarà essenzialmente quel periodo di attesa prima che i dati vengano ricevuti.

Pensalo come prendere un fast food. Il ristorante può essere ottimizzato per consegnare il cibo velocemente. In effetti potrebbero avere già un hamburger che ti aspetta. Ma devi ancora aspettare in fila per ordinare. Quel periodo di attesa è quello che puoi pensare come il momento del primo morso (vedi cosa ho fatto lì).

Il TTFB dovrebbe essere di circa 200 ms (secondo Google). Ma per i siti che hanno un hosting scadente e non sono stati ottimizzati, il TTFB può essere facilmente di 2 secondi o più.

Il ritardo TTFB sul tuo sito Divi è solitamente causato da quanto segue:

• La quantità di contenuto dinamico che deve essere ricevuto. Questo può essere ridotto con la memorizzazione nella cache, l'ottimizzazione del database e un CDN.
• La quantità di traffico che il tuo server sta vivendo in quel momento. I provider di hosting tradizionali (o condivisi) rendono difficile disattivare quel TTFB perché condividi risorse con altri sullo stesso server. I picchi nel loro traffico ridurranno la velocità di elaborazione del tuo server.
• La configurazione del tuo server web . Un buon provider di hosting WordPress può aiutarti con il TTFB del tuo sito fornendo una solida infrastruttura di backend e ottimizzando la configurazione del tuo server web (cose praticamente fuori dal tuo controllo).

In breve, se desideri un rapido aumento di TTFB, migliora l'hosting e segui il resto dei passaggi seguenti.

memorizzazione nella cache

Esistono quattro tipi principali di memorizzazione nella cache che possono essere implementati per velocizzare il tuo sito.

• Cache della pagina : questo processo memorizza le versioni HTML statiche memorizzate nella cache della tua pagina per una consegna rapida.
• Caching del browser : questo ti dà un maggiore controllo su quale contenuto può essere memorizzato nella cache dal browser e per quanto tempo. Solo alcuni plugin possono farlo, quindi potrebbe essere meglio farlo manualmente per un maggiore controllo. Ciò ti aiuterà a gestire la metrica "Sfrutta la memorizzazione nella cache del browser" durante lo svolgimento dei test di velocità.
• Caching CDN : serve pagine/file di siti Web memorizzati nella cache da un CDN più vicino ai tuoi utenti.
• Caching degli oggetti: la memorizzazione nella cache degli oggetti memorizza nella cache i risultati delle query ripetute che PHP avvia per recuperare i dati dal database e servirli all'utente. Questo è diverso dalla memorizzazione nella cache del bytecode che memorizza una versione cache del codice PHP compilato utilizzato per visualizzare il tuo sito web.

Divi esegue la memorizzazione nella cache per servire i file JS e CSS statici di Divi dietro le quinte. Ma questo è principalmente per i file del tema Divi per una migliore funzionalità di Divi Builder.

È ancora necessario utilizzare la memorizzazione nella cache per il tuo sito WordPress nel suo insieme. La maggior parte dei siti ha più plug-in forniti con i propri file CSS che potrebbero dover essere combinati, minimizzati e memorizzati nella cache. Quindi puoi sicuramente sfruttare un plug-in di terze parti per servire versioni html statiche memorizzate nella cache di tutte le tue pagine.

I plugin di memorizzazione nella cache più diffusi includono:

• WP Rocket
• Abilitatore cache (leggi la nostra recensione)
• W3 Total Cache (leggi la nostra recensione)
• W3 Super Cache (leggi la nostra recensione)
• Comet Cache (leggi la nostra recensione)
• WP Cache più veloce

Suggerimento: ogni volta che hai abilitato la memorizzazione nella cache delle pagine sul tuo sito utilizzando un plug-in, assicurati di eliminare (o cancellare) la cache ogni volta che apporti modifiche al tuo sito Web per assicurarti che a te e ai tuoi visitatori venga offerta l'ultima versione del tuo posto.

Minificazione e aggregazione

La minimizzazione rende i file del tuo sito più piccoli. Minimizzare i file del tuo sito (CSS, JavaScript, HTML) rimuove tutti quei caratteri non necessari (come spazi e interruzioni di pagina) in modo che le dimensioni del file si riducano. Ciò riduce il tempo necessario al browser per caricare il contenuto di una pagina.

L'aggregazione comporta la combinazione dei file del sito per ridurre le richieste totali sulla pagina e velocizza i tempi di caricamento per i tuoi visitatori.

Come accennato in precedenza, Divi minimizza e combina file Javascript e CSS utilizzati dal tema Divi per impostazione predefinita. Quindi tecnicamente non devi preoccuparti di utilizzare plug-in di terze parti per minimizzare e combinare ulteriormente i file Javascript e CSS di Divi. Tuttavia, Divi non minimizza l'output HTML. Quindi puoi beneficiare di un plug-in di terze parti per minimizzare (e memorizzare nella cache) l'intero HTML di una pagina.

Inoltre, quasi tutti i siti Divi dipenderanno da file al di fuori del tema Divi (come plug-in o altri file aggiunti al tema figlio) che trarranno vantaggio dalla minimizzazione e dalla combinazione dei file CSS e JS. Questo può essere facilmente gestito da un plugin.

Alcuni plugin credibili che minimizzeranno i file del tuo sito includono:

• Ottimizzazione automatica
• W3 Total Cache (leggi la nostra recensione)
• W3 Super Cache (leggi la nostra recensione)
• WP Rocket (a pagamento)

Questi plugin dovrebbero funzionare con Divi. Ma non c'è modo di valutare tutte le sfumature di un sito Web per dire che funzionerà meglio per tutti. A volte, i plug-in di terze parti minimizzeranno automaticamente i file JavaScript in un modo che potrebbe causare errori/problemi, quindi assicurati di testare accuratamente il tuo sito web. In generale, è sempre sicuro minimizzare i file CSS. Ma fai attenzione con quei file JavaScript.

E se c'è un conflitto, potrebbe essere necessario disabilitare le opzioni integrate di Divi e lasciare che il plug-in di terze parti gestisca le cose.

E se non vuoi fare affidamento su un plugin per questo, puoi sempre farlo manualmente. Per ulteriori informazioni su come eseguire questa operazione, dai un'occhiata a questo post completo su come minimizzare CSS, HTML e JavaScript del tuo sito web.

Compressione Gzip

La compressione Gzip è più importante della minimizzazione perché può ridurre le dimensioni della pagina fino al 70%.

L'abilitazione della compressione Gzip sul tuo sito Divi può darti una grande spinta in termini di velocità. Se hai familiarità con la creazione di file compressi (o zippati) sul tuo computer, hai già una conoscenza di base di come funziona la compressione Gzip. Creiamo file zip (o cartelle) per ridurre il contenuto del file (o cartella). Come mai? Quindi possiamo caricare e scaricare il file molto più velocemente! La compressione Gzip fa la stessa cosa per il tuo sito web. Dice al server di comprimere tutti i file che può in versioni più piccole in modo che possa essere servito al client molto più velocemente. Questo può davvero aumentare la velocità di caricamento della pagina.

Questa è una di quelle aree in cui puoi migliorare la velocità di Divi anche su una nuova installazione del tema. Poiché Divi minimizza comunque i file del tema principale, la compressione Gzip renderà quei file ancora più piccoli. La compressione Gzip renderà i tuoi file molto più piccoli di quanto potrebbe mai fare la minificazione.

Molti dei plug-in per le prestazioni di WordPress (come W3 Total Cache e WP Super Cache) includeranno la compressione Gzip come opzione.

Ecco alcuni plugin che supportano la compressione Gzip:

• WP Rocket
• W3 Total Cache (leggi la nostra recensione)
• WP Cache più veloce

E alcuni provider di hosting abiliteranno automaticamente la compressione gzip perché è un gioco da ragazzi per le prestazioni del sito. Sentiti libero di controllare se la compressione Gzip è abilitata sul tuo sito.

Il modo più comune per abilitare la compressione Gzip (su server Apache) è farlo manualmente utilizzando mod_deflate. E tutto ciò che devi fare è accedere al tuo sito Web (la radice) tramite FTP (assicurati di mostrare i file nascosti). Quindi copia e incolla il seguente blocco di codice in fondo al tuo file .htaccess.

Ecco il codice:

<IfModule mod_deflate.c>
  # Compress HTML, CSS, JavaScript, Text, XML and fonts
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE application/rss+xml
  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
  AddOutputFilterByType DEFLATE application/x-font
  AddOutputFilterByType DEFLATE application/x-font-opentype
  AddOutputFilterByType DEFLATE application/x-font-otf
  AddOutputFilterByType DEFLATE application/x-font-truetype
  AddOutputFilterByType DEFLATE application/x-font-ttf
  AddOutputFilterByType DEFLATE application/x-javascript
  AddOutputFilterByType DEFLATE application/xhtml+xml
  AddOutputFilterByType DEFLATE application/xml
  AddOutputFilterByType DEFLATE font/opentype
  AddOutputFilterByType DEFLATE font/otf
  AddOutputFilterByType DEFLATE font/ttf
  AddOutputFilterByType DEFLATE image/svg+xml
  AddOutputFilterByType DEFLATE image/x-icon
  AddOutputFilterByType DEFLATE text/css
  AddOutputFilterByType DEFLATE text/html
  AddOutputFilterByType DEFLATE text/javascript
  AddOutputFilterByType DEFLATE text/plain
  AddOutputFilterByType DEFLATE text/xml

  # Remove browser bugs (only needed for really old browsers)
  BrowserMatch ^Mozilla/4 gzip-only-text/html
  BrowserMatch ^Mozilla/4\.0[678] no-gzip
  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
  Header append Vary User-Agent
</IfModule>

CDN

StackPath CDN PoP

Una rete di distribuzione dei contenuti (CDN) porta la velocità del sito a un altro livello. Come suggerisce il nome, un CDN è una rete per la distribuzione di contenuti. La rete è composta da server in tutto il mondo che archiviano file statici memorizzati nella cache (immagini, video, script, ecc.) Dei contenuti del tuo sito web. Quindi, quando una persona invia una richiesta per quel contenuto (visitando il tuo sito Web), il server (o PoP) più vicino alla persona consegnerà il contenuto. Senza un CDN, i file del tuo sito web sono accessibili da una posizione del server (ovunque il tuo host stia memorizzando quei file), quindi più sei lontano da quel server, più lento sarà fornire quel contenuto del sito web al tuo browser.

Pensaci, quando vuoi che una pizza venga consegnata a casa tua, non scegli la pizzeria a 30 miglia di distanza. Scegli quello a 5 miglia di distanza perché vuoi che venga consegnato il prima possibile (se sei un normale umano che ama la pizza quanto me). Un CDN funziona in modo simile. Poiché desideri che il sito Web appaia nel tuo browser il prima possibile, un CDN avrà i file del tuo sito pronti per essere consegnati dal server più vicino alla tua posizione. Quindi, se i file del tuo sito sono archiviati su un server a San Francisco e qualcuno a Londra richiama il tuo sito, potrebbero volerci 1 o 2 secondi per ricevere quei dati da un server a migliaia di chilometri di distanza. Ma con un CDN, puoi fornire gli stessi dati da un server a Londra in metà del tempo. Questa è una grande differenza!

Quindi, anche se non vedi l'intera portata dei risultati a casa, stai accelerando la consegna del tuo sito web in tutto il mondo.

Ci sono molti modi per ottenere un CDN per il tuo sito. Molte società di hosting includeranno un'opzione per l'implementazione di un CDN con il loro servizio. E ci sono piattaforme di rete come Cloudflare e MaxCDN (ora StackPath) che offrono funzionalità CDN insieme ad altre prestazioni e funzionalità di sicurezza.

Ecco alcune piattaforme CDN credibili da considerare:

• KeyCDN (puoi anche utilizzare con il plug-in WordPress CDN Enabler per integrare KeyCDN; questa configurazione funzionerebbe bene anche con Cache Enabler)
• MaxCDN (ora StackPath)
• Amazon Cloudfront
• Sucuri

Esistono alcuni plug-in di memorizzazione nella cache come WP Total Cache o CDN Enabler che includono un'opzione per l'integrazione automatica di più provider CDN, il che è abbastanza conveniente.

Ecco alcuni plugin con supporto CDN:

• WP Cache più veloce
• WP Rocket
• Ottimizzazione automatica
• Cache totale W3
• WP Super Cache
• Abilitatore CDN

Ottimizzazione dell'immagine

L'ottimizzazione delle immagini è uno dei maggiori colpevoli della lenta velocità di caricamento della pagina. Ciò è probabilmente dovuto a quanto sia facile ignorarlo. Dopotutto, quanti danni può fare un'immagine di sfondo a una pagina web? Beh, potresti essere sorpreso. Solo poche immagini di grandi dimensioni che non sono state ottimizzate per il Web potrebbero avere conseguenze catastrofiche sulla velocità di caricamento della pagina. E ammettiamolo, il tuo sito avrà probabilmente molte immagini.

Non c'è davvero bisogno di sottolineare abbastanza la necessità essenziale per l'ottimizzazione dell'immagine. Ogni sito web dovrebbe farlo. La sola compressione delle immagini può rendere il tuo sito notevolmente più veloce e le dimensioni dell'immagine più piccole faranno risparmiare spazio di archiviazione e larghezza di banda (win-win!). Ma ci sono anche altre importanti ottimizzazioni delle immagini a cui dovresti pensare.

In breve, durante l'ottimizzazione dell'immagine per il Web, ti consigliamo di eseguire le seguenti operazioni:

Usa il tipo di file giusto

Quando si tratta di immagini sul Web, dovresti davvero attenerti ai seguenti tipi di file di immagine:

• JPG – Questo dovrebbe essere il tipo di file che preferisci per la maggior parte delle immagini/fotografie che usi sul tuo sito perché puoi ottenere immagini di bell'aspetto con una dimensione del file più piccola rispetto a PNG o GIF. Evita di usare il formato PNG per cose come immagini di sfondo o fotografie, a meno che tu non abbia bisogno di uno sfondo trasparente.
• PNG: usa i PNG per le immagini che richiedono uno sfondo trasparente. JPG non supporta la trasparenza.
• SVG: questo è un formato vettoriale che offre dettagli estremamente nitidi utilizzando il codice HTML. Gli SVG sono ottimi per loghi, icone e altre animazioni vettoriali.

Ridimensiona e ritaglia le tue immagini

Non vuoi mai che la tua immagine sia più grande di quanto dovrebbe essere. Ad esempio, se stai aggiungendo un logo nelle opzioni del tema di Divi, nella maggior parte dei casi è sufficiente che abbia una larghezza di 100 px. Quindi non caricare un logo con una larghezza di 5000 px e forzare Divi a ridimensionare quell'immagine per te. Il risultato potrebbe sembrare simile sul front-end, ma quelle grandi dimensioni stanno uccidendo il tempo di caricamento della pagina.

Quando carichi immagini sulla tua pagina utilizzando Divi, è utile sapere quanto devono essere grandi quelle immagini all'interno della struttura a colonne di Divi. Questa guida definitiva può aiutarti a indirizzarti nella giusta direzione. (Tuttavia, ci sono nuove strutture di colonne che sono state aggiunte da quel post, quindi cercheremo di aggiornarle presto).

Comprimi le dimensioni del file

Ti consigliamo di ridurre le dimensioni del file di immagine fino al punto prima di notare un calo di qualità. Questo viene fatto attraverso la compressione delle immagini. La maggior parte degli editor di foto, dei plug-in e dei siti come tinypng.com comprimono le immagini utilizzando la compressione senza perdita di dati (che riduce il file di immagine senza perdere la qualità dell'immagine) e la compressione intelligente con perdita di dati (che riduce le dimensioni del file di immagine riducendo i metadati e la qualità dell'immagine in un modo che non è realmente percepibile dall'utente).

Approfitta degli strumenti di ottimizzazione delle immagini

Se puoi, ti suggerirei di ottimizzare le tue immagini per Internet prima di caricarle sul tuo sito Divi. Questo può essere fatto tramite editor di foto come Photoshop che includono un'opzione "Salva per Web". Inoltre, puoi utilizzare un sito di terze parti gratuito come TinyPNG.com o Compressor.io per comprimere l'immagine prima di caricarla sul tuo sito.

Ci sono alcuni ottimi plugin che condurranno la compressione delle immagini per te. Alcuni plugin (come Imagify) comprimeranno le immagini già utilizzate sul tuo sito e comprimeranno automaticamente le immagini mentre le carichi nella tua libreria multimediale di WordPress. Tieni presente che l'utilizzo di un plug-in per questo può essere oneroso per il tuo sito durante la compressione di tali immagini, quindi è consigliabile eseguire l'ottimizzazione delle immagini in anticipo, se possibile.

Ecco alcuni ottimi strumenti e plugin per l'ottimizzazione delle immagini che puoi utilizzare:

• Siti web:
  • Compressor.io
  • Tinypng.com
• Plugin:
  • Immaginare
  • Smush Compressione e ottimizzazione delle immagini
  • razzo WP

Per maggiori informazioni, controlla un confronto su 6 plugin di ottimizzazione delle immagini di qualità.

Supporto SRCSET integrato di Divi

Anche le immagini reattive con supporto SRCSET nativo sono integrate in Divi. Ciò migliora ulteriormente l'ottimizzazione delle immagini utilizzate in Divi offrendo immagini ridimensionate della dimensione giusta per diversi display reattivi (come tablet e telefono).

Ottimizzazione video

L'ottimizzazione del video è un po' più difficile dell'ottimizzazione delle immagini, ma sicuramente non per questo meno importante. I file video possono essere di grandi dimensioni e quindi estremamente onerosi per la velocità di caricamento della pagina. E se stai ospitando molti video sul tuo server (ad esempio nella Galleria multimediale di WordPress), incontrerai il problema aggiuntivo dello spazio su disco. Ecco perché spesso si consiglia di utilizzare servizi di terze parti (come YouTube o Vimeo) per ospitare i tuoi video. In alternativa, potresti considerare di scaricare i tuoi contenuti multimediali video su una piattaforma di archiviazione come Amazon S3. Ciò ti consentirà di collegarti a quei video dall'interno del modulo video di Divi senza che debbano rallentare il tuo server.

Se hai intenzione di ospitare autonomamente i tuoi video, dovrai sicuramente ridurre le dimensioni del video per un caricamento più rapido. Puoi ridurre facilmente i file video usando uno strumento gratuito come Handbrake (che è facile da usare).

Per ulteriori informazioni su come utilizzare i video in Divi (come l'aggiunta di un URL video ospitato da terze parti a un modulo video), consulta questa guida definitiva.

Usa plugin di qualità

Ovviamente, meno file deve caricare un sito Web, più veloce sarà. Quindi devi essere consapevole della quantità di plugin che usi. If you have plugins (or Themes) that you aren't using, make sure you delete them. They can be harmful to your website performance and a serious security risk. But quality is the more important factor when it comes to plugins. In fact you can have 20 to 30 quality plugins that won't slow down your site as much as one bad one will. In general, make sure you choose plugins that have stood the test of time and have great reviews. And always test how a plugin affects your website performance with before and after speed tests to be sure.

Conducting Speed Tests

You probably wouldn't be reading this article if you haven't done at least one speed test on your website. And rightly so, it is important to know how fast your pages are loading for visitors. Conducting a speed test is one of the easiest things you can do. There are tons of websites that will do this for you for free. And the metrics they provide will be invaluable for identifying ways you can further optimize your site for better performance.

Here are a few great places to start:

• GTMetrics
• Pingdom
• Google Page Insights

The results of these tests are what drive many of us to start optimizing our Divi site for faster load times. They provide a helpful breakdown of how your web page performs in a variety of areas. Then you can use their recommendations as a checklist to work through as you optimize your site.

The best way to use these online speed testing tools for you Divi WordPress site is to run a test on a page first before you do any optimizations. Then you can use this as a base to compare future tests as you make changes. After each optimization you make, you can see if your score improves.

For example, you may notice that using one caching plugin will work better than another. Don't be afraid to test multiple plugins for best performance.

Here is a helpful WordPress optimization guide by GTMetrix that will be helpful.

As you implement the speed optimizations to your site, you should see improvements in the following areas:

• Fully loaded time/Onload time (this is the most important metric you are trying to knock down)
• Total Page Size (things like minification, image optimization with help with this)
• Requests
• PageSpeed/YSlow scores
• Serve scaled images
• Optimize images
• Leverage browser caching
• Minify CSS/HTML
• Enable gzip compression
• Make fewer HTTP requests
• Add Expires Headers

For more info, check out our post on how to improve your google page speed score.

The Goal is Speed, Not Perfection

It can be easy to get bogged down with testing your website and optimizing it to perfection. But no website will be perfect. You may even find that improving certain speed test performance grades may actually slow down your page load time. That's because even those speed tests aren't perfect either. Like this article, they are merely a guide to help improve your website performance and speed.

How to Avoid Possible Conflict with Divi's Built-in Performance Optimizations and Third Party Plugins

Whenever you deploy a third party plugin for minification and caching, you may encounter certain conflicts. For example, you may find that a Divi module doesn't display correctly or that certain JavaScript files aren't rendering properly.

To avoid these types of conflicts, you can disable Divi's built-in optimizations and let the third party plugin handle it for you. The three option you will want to disable are:

• Static CSS File Generation
• Minify and Combine Javascript Files
• Minify and Combine CSS Files

You can disable the options to minify and combine Javascript and CSS files by going to Theme Options > General tab.

You can disable the option for static CSS file generation under Theme Options > Builder > Advanced.

Other Tips

We've pretty much covered all the major factors that contribute to faster Divi/WordPress websites. But there are a lot more things to consider that could improve your speed even more.

• Having a correct Divi child theme setup
• Changing your WordPress Login URL to keep those bots from overloading your server. This would be a good chance to create a custom login page with Divi.
• Avoiding unnecessary calls to external Services. Some plugins and embeds require that you use files that are hosted on their servers. These additional calls will slow down page load.
• Incorporate lazy loading for images and videos for better page load speed.

Quick Overview of Suggested Practices and Resources for Faster Divi Websites

Here is a quick overview of the suggested practices and resources included in this article for easy reference.

Get Latest PHP version

• check with Divi System Status
• Update your PHP version

Database Optimization

You can use these plugins to optimize and cleanup your Database for a faster site.

• Ottimizzazione WP
• Optimize Database after Deleting Revisions

DNS Lookup and DDOS Detection

• You can use CloudFlare for this for free

Good Hosting

A quick list of hosts to consider for a faster Divi website.

• SiteGround – offers shared hosting, managed WP Hosting, dedicated, and cloud hosting (visit SiteGround / our review)
• Cloudways – specializes in SSD-Based managed cloud hosting and also has managed WP Hosting (visit Cloudways / our review)
• Kinsta – specializes in managed WP hosting (visit Kinsta / our review)
• WPEngine – specializes in managed WP hosting (visit WPEngine / our review)
• Flywheel – specializes in managed WP hosting (visit Flywheel / our review)

If you are looking for a credible hosting review site, check out Review Signal.

You can also refer to this guide to help you make your choice.

Time to First Byte (TTFB) Optimization

• Get Better Hosting with proper web server configuration.
• Optimize the site for speed

Caching (Page, Object, Browser)

Popular caching plugins include:

• WP Rocket
• Cache Enabler (read our review)
• W3 Total Cache (read our review)
• W3 Super Cache (read our review)
• Comet Cache (read our review)
• WP Fastest Cache

If your plugin doesn't support browser caching, you will want to enable browser caching manually.

Minify/Combine Site Files

Some credible plugins that will minify your site files include:

• Ottimizzazione automatica
• W3 Total Cache (read our review)
• W3 Super Cache (read our review)
• WP Rocket (paid)

Our you can do it manually.

Gzip Compression

• Check to see if Gzip compression is enabled
• Add manually using mod_deflate model
• Plugins that support Gzip compression:
  • WP Rocket
  • W3 Total Cache (read our review)
  • WP Fastest Cache

CDN

Here are some credible CDN platforms to consider:

• MaxCDN (now StackPath)
• KeyCDN (you can even use with CDN Enabler WordPress plugin to integrate KeyCDN; This setup would also work well with Cache Enabler as well)
• Amazon Cloudfront
• Sucuri

Here are some plugins with CDN support:

• WP Fastest Cache
• WP Rocket
• Ottimizzazione automatica
• W3 Total Cache
• WP Super Cache
• CDN Enabler

Ottimizzazione dell'immagine

• Photoshop “save for web”
• Websites:
  • Compressor.io
  • Tinypng.com
• Plugins:
  • Imagify
  • Smush Image Compression and Optimizaton
  • WP rocket
• Choose the right size images for Divi's grid layout using this ultimate guide.

Pensieri finali

Divi is faster than ever before. With built-in performance upgrades, your standard Divi installs have faster page loads on the front end, a faster WordPress admin on the backend, and a faster Divi Builder to edit and design your site. This is a great start, but there is much more to do to make sure your Divi site is running as fast as possible. The speed and performance optimizations included in this article will definitely boost your site speed. For the most part, these optimizations would apply to any WordPress site/theme, not just Divi. And it is surprising how many simple things you can do for free!

I'm sure there are tons of suggestions and resources out there that weren't mentioned, so feel free to share those with us in the comments.

Aspetto tue notizie.

Saluti!

Immagine in primo piano tramite Sammby / shutterstock.com