Comparația performanței Divi vs Avada (2021): care este mai rapid?

Încercați să alegeți între Divi și Avada pentru a vă construi site-ul WordPress?

Aceste două teme sunt două dintre cele mai populare teme premium WordPress din toate timpurile – Elegant Themes (dezvoltatorul Divi) susține că are peste 806.000 de clienți, iar Avada a fost achiziționat de peste 747.000 de ori de la ThemeForest. Acestea sunt atât numere incredibil de impresionante, cât și dovada că fiecare temă are mulți utilizatori fericiți.

Unul dintre cei mai mari factori din spatele succesului ambelor teme este grupul lor de constructori vizuali, drag-and-drop. Cu acești constructori, puteți crea site-uri WordPress personalizate frumoase - nu este necesar niciun cod.

Dar flexibilitatea designului nu este singurul lucru de luat în considerare într-o temă WordPress – trebuie, de asemenea, să cântăriți cât de repede acea temă va ajuta site-ul dvs. să se încarce, deoarece timpii de încărcare a site-ului joacă un rol în orice, de la experiența utilizatorului la SEO, ratele de conversie și multe altele. .

Acest lucru este și mai adevărat de la actualizarea Google Page Experience, în care Google a început să includă Core Web Vitals în clasamentele sale.

În acest scop, am decis să creăm o comparație Divi vs Avada concentrată pe o măsură specifică: performanța.

Adică, Divi sau Avada vă ajută să obțineți un site web cu încărcare mai rapidă? Pentru a răspunde la această întrebare, am efectuat câteva teste proprii – continuați să citiți pentru a vedea datele și analiza.

Notă – am publicat inițial această postare și am rulat aceste teste în iulie 2021. Cu toate acestea, Elegant Themes a lansat o actualizare cu actualizări majore de performanță pentru front-end în august 2021 (Divi 4.10) care face o diferență enormă pentru performanța Divi. Din acest motiv, am reluat complet aceste teste și am colectat toate datele și concluziile noi în noiembrie 2021.

Cum vom testa performanța temei Divi vs Avada

Înainte de a ajunge la date, să vorbim despre cum vom testa performanța Divi vs Avada, astfel încât să știți exact cum am configurat lucrurile.

În primul rând, vom testa două scenarii la nivel înalt:

• Testul #1 – vom testa doar temele. Adică, nu vom folosi constructorii lor vizuali. În schimb, vom testa doar „Pagină de probă” implicită construită cu editorul de blocuri.
• Testul #2 – vom testa o pagină simplă construită cu generatorul fiecărei teme, deoarece constructorii vizuali sunt o parte cheie a ceea ce face Divi și Avada atât de populare. Vom încerca să folosim module comparabile pentru a face comparația cât mai egală posibil.

Pentru fiecare scenariu de testare la nivel înalt, vom testa și două configurații diferite:

• Prima configurare este doar cu temele în sine și fără alte optimizări de performanță.
• A doua configurare este cu WP Rocket instalat și configurat, astfel încât să puteți vedea cum arată lucrurile dacă implementați cele mai bune practici de performanță WordPress.

Pe lângă stocarea în cache a paginii și alte bune practici de bază, WP Rocket oferă și câteva caracteristici unice care pot optimiza codul fiecărei teme și pot îmbunătăți valorile Core Web Vitals.

• Eliminați CSS neutilizat – acest lucru vă permite să eliminați CSS inutile de pe site-ul dvs., pagină cu pagină. Poate fi deosebit de grozav la reducerea dimensiunii paginii teme precum Divi și Avada.

• Întârzierea execuției JavaScript - aceasta vă permite să așteptați pentru a executa JavaScript până la o interacțiune cu utilizatorul, ceea ce face o treabă grozavă de a accelera timpul inițial de încărcare. Puteți oricând să excludeți manual anumite scripturi dacă aveți nevoie să se încarce imediat .

Site-urile noastre de testare sunt găzduite pe o picătură DigitalOcean ieftină de 5 USD pe lună, alimentată de RunCloud și un stack complet Nginx. Nu am adus nicio îmbunătățire a performanței în afară de adăugarea WP Rocket la unele dintre teste, așa cum s-a menționat mai sus.

Pentru a testa și măsura datele de performanță WordPress, vom folosi WebPageTest pentru a colecta date de performanță concentrate pe dispozitive mobile:

• Dispozitiv de testare – iPhone 8. Dispozitivele mai moderne vor avea procesoare mai puternice pentru a procesa JavaScript mai rapid, ceea ce ar putea duce la timpi de încărcare puțin mai rapid. Ar putea fi opusul cu dispozitivele mai vechi/cu putere redusă.
• Viteza de conectare – conexiune LTE accelerată (12 Mbps, 70 ms RTT). Timpul de încărcare din lumea reală ar fi mai rapid dacă un vizitator navighează pe Wifi sau mai lent dacă utilizatorul are ceva de genul unei conexiuni 3G.

Pentru fiecare test, vom face ca WebPageTest să execute nouă teste separate și să ia valoarea mediană. Acest lucru ne ajută să evităm variabilitatea unui singur test și să obținem rezultate mai consistente.

Iată cele patru valori pe care ne vom concentra:

1. Cea mai mare vopsea de conținut (LCP) – parte a noilor valori Google Core Web Vitals și un factor de clasare SEO în actualizarea Page Experience.
2. Time to first byte (TTFB) – aceasta măsoară cât de repede este capabil serverul să răspundă cu primul octet de date după procesarea PHP-ului site-ului/temei (sau livrarea din cache, în cazul testului nostru WP Rocket).
3. Dimensiunea paginii – toate celelalte sunt egale, o dimensiune mai mică a paginii este întotdeauna mai bună.
4. Solicitări HTTP – toate celelalte sunt egale, mai puține solicitări HTTP sunt întotdeauna mai bune.

În cele din urmă, iată numerele de versiune pentru tot ceea ce testăm:

• Tema Avada – 7.5
• Avada Builder – 3.5
• Tema Divi – 4.13.1
• WP Rocket – 3.10.3.

Teste de viteză Divi vs Avada

Acum, să trecem la testele noastre practice de performanță Divi vs Avada.

Testul #1: Doar temele

În acest prim test, testăm doar temele fără a folosi constructorii vizuali:

• Divi – doar tema Divi, deoarece Divi este deja inclusă în Divi Builder.
• Avada – am instalat și pluginurile Avada Core și Avada Builder, deoarece acestea sunt pluginuri necesare de bază. Totuși, nu am instalat niciun plugin opțional.

Conținutul real este „Pagină de probă” care vine cu o nouă instalare WordPress. Este construit cu editorul de blocuri nativ.

Iată datele pentru teme în sine:

Puteți vedea că Divi este câștigătorul destul de clar aici când vine vorba de cea mai mare perioadă de vopsea de conținut, deoarece timpul lui Avada este cu 50% mai mare.

De ce diferența?

Ei bine, vom ghici că o mare parte din performanța mai rapidă a Divi este faptul că dimensiunea paginii Avada este de 544 KB, în timp ce Divi este de doar 201 KB. Rețineți că aceasta este pentru o pagină care nu este construită folosind generatorul vizual - aceasta este doar pagina de exemplu implicită creată cu editorul de blocuri.

Acum, să ne uităm la datele după adăugarea WP Rocket:

Puteți vedea că, cu optimizările WP Rocket, ambele teme sunt mult mai rapide și există o diferență foarte mică în timpul cel mai mare de vopsea de conținut între Divi și Avada. Divi este încă puțin mai rapid, dar diferența este suficient de mică încât ar putea fi doar o variabilitate normală a testului.

În plus, WP Rocket a reușit să reducă considerabil dimensiunea paginii ambelor teme datorită caracteristicilor de eliminare a CSS neutilizate și de a întârzia execuția JavaScript. Puteți vedea că dimensiunea paginii Divi a scăzut cu mai mult de jumătate, în timp ce dimensiunea paginii Avada a fost redusă cu mai mult de 200 KB.

Aceste îmbunătățiri, împreună cu memorarea în cache și alte ajustări, sunt cele care au cauzat timpii LCP îmbunătățiți.

Testul #2: Cu constructori

În acest al doilea test, am folosit generatorul vizual al fiecărei teme pentru a crea o pagină comparabilă folosind aproximativ aceleași module. Designul este foarte simplu – am adăugat doar trei elemente pentru a menține lucrurile cât mai egale posibil:

• Editor de text cu conținut lorem ipsum identic
• Buton
• Contracerc

Ideea aici este în principal să vedem ce „greutate” suplimentară se adaugă paginii atunci când activați generatorul fiecărei teme.

Iată datele doar pentru temele/constructorii în sine:

În general, puteți vedea că rezultatele sunt aproape aceleași ca mai sus. Divi este considerabil mai mic în ceea ce privește dimensiunea paginii și, prin urmare, are un timp mai mare de vopsire cu conținut mai mare.

În plus, nicio temă nu adaugă nicio greutate în plus paginii doar pentru că ați activat generatorul vizual, ceea ce înseamnă că nu există cu adevărat nicio penalizare pentru utilizarea generatorului față de editorul nativ ( cel puțin pentru pagini simple ).

Iată datele după adăugarea WP Rocket:

Cu WP Rocket, puteți vedea același rezultat ca și primul test. Acum, cei mai mari timpi de vopsea satisfăcătoare de la Divi și Avada sunt mult mai rapidi și similari ca performanță, deși Divi este din nou puțin mai rapid. Pe lângă reducerea semnificativă a duratei de vopsire cu cea mai mare cantitate de conținut, WP Rocket a reușit să obțină, de asemenea, reduceri similare ale dimensiunii fișierului ca în primul test.

Gânduri finale despre Divi vs Avada Performance

Divi și Avada sunt similare prin aceea că ambele vă oferă puterea de a crea un site web personalizat folosind constructorii lor vizuali drag-and-drop.

Cu toate acestea, în timp ce amândoi vă oferă acest control, Divi este acum considerabil mai rapid în ceea ce privește performanța ieșită din cutie.

Diferența a fost mică când am rulat pentru prima dată testele noastre de performanță Divi vs Avada. Cu toate acestea, după actualizarea de performanță Divi 4.10 din august 2021, Divi este acum mult mai mic decât Avada în mod implicit, ceea ce face ca timpii de vopsea cu conținut mai mare de la Divi să fie de aproximativ două treimi din cei de la Avada.

Cu toate acestea, dacă utilizați WP Rocket cu memorarea în cache și noile funcții pentru a elimina CSS neutilizat și a întârzia execuția JavaScript, puteți aduce îmbunătățiri majore ambelor teme.

În timp ce Divi a fost încă puțin mai rapid cu WP Rocket activat, diferența a fost mult mai minimă și Avada a funcționat încă bine.

Acest lucru sugerează că, deși Divi este puțin mai rapid, puteți crea în continuare un site de încărcare rapidă cu Avada, atâta timp cât implementați cele mai bune practici de performanță WordPress cu un instrument precum WP Rocket.

Desigur, aceste două teme nu sunt singurele tale două opțiuni. Dacă vă concentrați pe viteză și performanță, poate doriți să verificați colecțiile noastre cu cele mai rapide teme WordPress gratuite sau cele mai rapide teme WooCommerce dacă construiți un magazin de comerț electronic.

Puteți găsi teme și mai rapide decât acestea două, inclusiv tema Astra, care a funcționat bine în comparația noastră de performanță Divi vs Astra ( deși diferența nu este la fel de mare datorită noilor îmbunătățiri ale performanței Divi ).

Mai aveți întrebări despre Divi vs Avada când vine vorba de viteză și performanță? Întrebați-ne în comentarii!