Divi vs Beaver Builder 2021 Performans 2021: Hangi WordPress Sayfa Maker daha hızlı?
Bir sonraki WordPress projeniz için bir sayfa üreticisi arıyorsanız, Divi ve Beaver Builder en iyi iki seçeneğinizdir. Web sitenizin en iyi performans gösterdiğinden emin olmak için, güçlü ve hızlı bir üreticiyi kullanmanız gerekir, çünkü web sitesinin hızı olumlu kullanıcı deneyimi için çok önemlidir. Bu yazıda, sizin için neyin doğru olduğuna karar vermenize yardımcı olmak için iki inşaatçının performansını göreceğiz. Ayrıca, her bir üreticinin hızının nasıl en üst düzeye çıkarılacağına dair ana özellikleri ve bazı ipuçlarını tartışacağız. Peki, hangi sayfa yapımcıları daha hızlı: divi mi yoksa kunduz üreticisi mi? Öğrenmek için okumaya devam edin!
Divi ve Beaver Builder’ın site hızını nasıl karşılaştırdığını anlamanıza yardımcı olmak için divi vs keaver üreticisini (tam hücresel yaklaşım) nasıl test ederiz, üç ayrı test yapacağız. Neden? Niye? Çünkü her bir araç, elma-elma oranı olabilmesi için çeşitli benzer senaryolarla karşılaştırılmalıdır. WordPress Sürümü: Tema: GeneratePress eklentisinin ücretsiz sürümü:
Divi Page Maker (V.4.9.3)
Beaver Builder Page Maker (Premium Versiyon V 2.5.1)
Not: Divi ve Beaver Builder temalar sunuyor, ancak karşılaştırmamızı adil tutmak için sadece Mandiri premium sayfalarının yapımcılarını karşılaştıracağız. Divi temalarının ne kadar hızlı olduğunu bilmek istiyorsanız, özel makalelerimizi okumanızı öneririz.
Araçlar ve hücresel KPI’lar:
Google PagePeed Insights (Hayati Web Çekirdeği, Hız Dizin, Toplam Engelleme Süresi, İlk İçerik Kedi ve Etkileşimli Zaman)
WebPagetest (Paris’te Mobil – iPhone X’de tam dolu zaman ve HTTP isteği sayısı)
Senaryo #Yalnızca bir metin satırına sahip eklentiler, herhangi bir içerik (widget ve diğer diğer tasarımlar) eklemeden önce her eklentinin dengeyi nasıl ağırladığını göreceğiz. Bunu yapmak için, Sitemizdeki Beaver Builder ve Divi eklentisini yalnızca bir satır metinle etkinleştireceğiz. Sonuçlar Google PagePeed Insights.skenario #2-bazı içerik için iyi olmalıdır.
Bir düğme – harekete geçme davetiyesi
Sayı sayma bölümü
Fiyat masası (iki paket)
Senaryo #3 – Son İçerik + WP roketinden bazıları, performans seviyesinin artıp artmadığını kontrol etmek için aynı test sitesindeki WP roket eklentisini etkinleştireceğiz. Divi vs Beaver Builder’ın hız performansı Bir hız testine başlamadan önce, WordPress sitesinin performansını test etme hakkındaki ayrıntılı yönergelerimizi okumanızı öneririz.
Şimdi performans karşılaştırmamıza daha fazla dalalım! Senaryo #Yalnızca 1 metin Bu ilk testte, her bir oluşturucunun metin modülünü kullanarak bir metin satırı ekliyoruz. t>
Bu bizim bulgularımız:
fcp
si
cls
/td>
1.1 saniye
1.3 saniye
lcp
0.680 saniye
1.4 saniye
tti
1.9 saniye
2.2 saniye
0 ms
0
0
Tam zamanlı doldurulur
1,339 saniye
0.944s
6
Çok fazla içerik olmadan, Divi Builder Beaver Builder'dan biraz daha iyidir. Denetimin birkaç içerikle nasıl çalıştığına bakalım. Skenario #2 - Bir hatırlatma olarak bazı içerikler, uygun modüle benzer iki sayfa yapıyoruz:
Sayı sayma bölümü
Fiyat masası (iki paket)
Genel olarak, iki test sitemiz yavaşlıyor (bu biraz içerik eklediğimiz için mantıklı). Google PagesPeed Insights, test sitelerimiz için divi'ye kıyasla biraz avantajla turuncu değer sağlar. > Beaver Builder'ın içerikli performansı
, 4 saniye
lcp
cls
0.025
0
/td>
18
15
Ana Sonuç: Divis'in tam yükleme süresi 2.3 saniyedir - 2.4 saniyede yüklenen Beaver Builder'dan biraz daha hızlı. Genel olarak, bu iki tema hızlıdır ve performans hedefleriniz için mükemmel bir seçimdir. Divi ayrıca çekirdek web canlıları açısından Beaver Builder'dan biraz daha iyi performans gösteriyor. Divi'nin en büyük içerikli boyası (LCP) 1 saniyenin altındadır ve bu yüzden PSI'da (89/100) Beaver Builder'a (85/100) kıyasla daha yüksek performans değeri elde etmesinin nedeni budur. Performans testimizi son senaryo ile tamamlayalım: güçlü bir önbellek eklentisi WP roketi yükleme.
İşte WP roketi olan ve olmayan iki temanın performansını gösteren bir karşılaştırma tablosu:
si
1.4 saniye
0.7 saniye
1.3 saniye
1.1 saniye
lcp
0.980 saniye
0.9 saniye
1.4 saniye
2.5 Saniyeler
cls
0.025
> 0.025
Tam zaman dolu
Performans: WP roketi sayesinde, Her iki tema için de iyileştirmeler:
Tüm temel web verilerim Yeşil Bölge'de (Divi ve Beaver Builder için). Tam zamanlı tamamen şarj edilir (ortalama% -75 daha az).
Tam zamanlı olarak, Beaver Builder şimdi Divi'den biraz daha hızlı.
Divi vs Beaver Builder arasında seçim: Beaver Builder ve Divi'nin ana özellikleri ve iyi fiyatları, WordPress için iyi bir sürükle ve bırak sayfasının yapımcılarıdır. Her şeyden önce, aralarında benzerliklerin bir listesini yapalım:
Birlikte sahip oldukları ana özellikler:
Ön Sayfa Yapımcısı - Gördüğünüz şey ne elde edersiniz (Wysiwyg) - Her ikisi de sezgisel ve kullanımı çok kolay ince ve ergonomik bir arayüze sahiptir.
</s
WordPress Gönderiniz ve Sayfanız İçin Gelişmiş Özel Düzen Tasarlama yeteneği - İnce Bir Arayüz ile
Divi Kütüphanesi
Beaver Kütüphanesi
Tam Tema Yapma Seçenekleri - Özel başlıklar, altbilgiler ve web sitenizin diğer bölümleri gibi sayfa içeriği etrafında her şeyi tasarlama yeteneği.
Global Modül - Tüm WordPress sitelerinizde kullanım için yeniden kullanılabilecek bir içerik kütüphanesi oluşturun. Gerçekten zaman kazandırır!
Şimdi farkı tartışalım:
Ayrı test özellikleri (özellikle Divi) - içeriğinizi daha yüksek dönüşüm oranları için analiz etmek ve optimize etmek için. Bu modüle divi kurşun olarak adlandırılır ve Divi Builder'a dahildir.
Beyaz etiketleme (özellikle Beaver Builder) - Beaver Builder'ın beyaz bir etiketleme seçeneği vardır, böylece kendi görünümünüzü yerleştirebilir ve WordPress kontrol paneline hissedebilirsiniz. Yapımcıya dahil olmayan Divi için eklenti "hayalet" a ihtiyacınız var.
Tam tema yapma seçenekleri ve dinamik içerik - Divi temaları (Divi Builder'a dahil) üstbilgiyi ve altbilgiyi ayarlamak ve dinamik içerik eklemek için ihtiyacınız olan tüm özelliklere sahiptir. Beaver Builder da çok güçlü, ancak başka bir eklenti indirmeniz gerekiyor: Beaver Builder Themer. Site bölümünüz üzerinde genellikle temalarla kontrol edilen (mağaza sayfaları veya WooCommerce ve Bigcommerce için kategoriler gibi) daha fazla tasarım esnekliği ve kontrolü alacaksınız. Kendi özel alanınızı ve koşullu mantığınızı da bağlayabilirsiniz. Fiyat zarif temalar (Divi) üyelik, ona eşlik eden diğer prim özellikleri nedeniyle daha fazla değer verir (temalar, sayfa yapımcıları, tema yapıcılar, wooCommerce yapımcıları, A/B test araçları, Şablon kitaplıkları, eklentiler, eklentiler içeriğinizi ve katılımcı e -posta araçlarını paylaşmak için sosyal medya). Erişim ve ömür boyu güncellemeler almak için yıllık bir paket seçebilir ve yılda 89 $ veya 1 kez 249 $ fiyat ödeyebilirsiniz. Beaver Builder'a benzer bir özellik açmak için temalar, sayfa yapımcıları ve temaları yüklemeniz gerekir. Pro paketleri Divi'ye en yakın olanıdır. Yılda 199 $ 'dır ve ömür boyu bir seçenek sunmaz.
Beaver Builder'ın Fiyatı Kunduz Builder ve Divi'yi nasıl hızlandırmak için WordPress sayfalarının üreticilerinden birini hızlandırmak için, Lighthouse esas olarak aşağıda gösterildiği gibi kodunuzu ve resminizi optimize etmek için güçlü bir önbellek eklentisi kullanmanızı önerir:
Lighthouse tarafından yapılan performans önerilerine örnekler - Kaynak: Şanslısınız çünkü WP Rocket, performansı iyileştirmek için yukarıdaki tüm kutuları kontrol ediyor. Yukarıdaki denetimimizde görüldüğü gibi, WP Roket test sitelerimizi önemli ölçüde hızlandırıyor (PSI'da Divi ve Beaver Builder ile 99/100 ve 98/100'e yükseldik). Aslında, hızlı web sitelerini garanti etmek için WP Rocket, web performansının en iyi uygulamalarının% 80'ini otomatik olarak uygular. WP roketini etkinleştirdiğimizde, esas olarak Divi/Beaver Builder ile oluşturulan WordPress sitemizde olan şeydir: önbellek ve GZIP - WP roket sıkıştırma, hücresel ziyaretçiler de dahil olmak üzere hızlı bir ekran için önbellekleme ile donatılmış eksiksiz bir önbellek eklentisidir. Ayrıca GZIP sıkıştırması sayesinde bant genişliği kullanımını azaltır.
Önbellekleme Özellikleri - Kaynak: WP Roket Eklentisi
Tembel Yükleme Görüntüler, yalnızca ziyaretçiler tarafından gerçekten görülen görüntüleri görüntülemek için bir teknik olan tembel yükleme uyguluyoruz.
Tembel Yükleme Özelliği - Kaynak: WP Roket Eklentisi Not: Görüntülerinizi sıkıştırma ile daha fazla optimize etmek ve WebP'ye dönüştürmek istiyorsanız, Imagify kullanabilirsiniz.
CSS azaltılır, birleştirilir ve sevkiyat optimize edilir - WP roketi ayrıca sayfa yapımcılarından kullanılmayan tüm CSS'yi siler.
CSS Optimizasyonu - Kaynak: WP Roket Eklentisi
JavaScript ayrıca azaltılır, askıya alınır ve ertelenir - bu, tüm oluşturma engelleme sorunlarını ortadan kaldırmayı ve yükleme süresini artırmayı amaçlamaktadır. JS'yi kullanıcı etkileşimine geciktirerek WP Rocket, önce görüntülenmesi gerekenleri önceliklendirir ve bazı kaynakları kaydeder.
