pagebuilder-speedvergleich

WordPress Pagebuilder sind mittlerweile fester Bestandteil des WordPress Universums und seit 2019 ist mit dem Gutenberg eine entsprechende Funktionalität in den WordPress Core implementiert worden.

Um das Thema Pagebuilder gibt es überall im Netz hitzige Diskussionen. Gegner äußern sich kritisch über die massiven Auswirkungen auf die Ladezeiten und die Performance sowie über die „Verunstaltung“ von Code durch exzessiven Einsatz von Shortcodes, DIV`s etc. Immer wieder 

Auf der anderen Seite genießen die Befürworter die Freiheit auch ohne tiefgreifende html/css Kenntnisse professionelle Webseiten bauen zu können. Theoretisch sind selbst blutige Anfänger in der Lage sich entsprechende Themes zu kaufen die in 99% aller Fälle auf einem Pagebuilder basieren, sich ein Demo installieren, Farben, Schriften und Inhalte anpassen und eine Seite veröffentlichen die nicht selten besser aussieht als das was so der ein oder andere Designer vom Stapel lässt. 

Bitte nicht missverstehen! Auch ich sehe definitiv die negativen Seiten beim Thema Pagebuilder und im speziellen beim Einsatz fertiger Themes. Besonders wenn hier dann „Spezialisten“ eine Webseite „zusammenhusten“ die optimalerweise aus 30+ Plugins besteht, Ladezeiten jenseits von Gut und Böse aufweist und dann für viel Geld verkauft wird. Aber dies ist ein anderes Thema dass ich bestimmt noch in einem eigenen Artikel behandeln werde.

Im heutigen Artikel widme ich mich nun aber dem wohl meist diskutierten Thema, nämlich dem:

Einfluss von Pagebuildern von WordPress Seiten.

Nachdem ich nun den fastWP Pagebuilder einmal angeworfen habe um diese nette Headline zu erstellen 😎 möchte ich im ersten Step erläutern wie dieser Test durchgeführt worden ist.

Inhaltsverzeichnis

Übersicht & Informationen zum Ablauf des Tests

Die Idee zu diesem Test ist mir schon vor diversen Monaten gekommen und inspiriert wurde ich von einem Artikel der Anfang 2018 erstellt worden ist ( https://pagely.com/blog/wordpress-page-builders/ )

Für meinen Tests habe ich mir die aus meiner Sicht bekanntesten und meist verwendeten Pagebuilder herausgesucht. Diese sind:

  • Gutenberg 
  • Elementor
  • WPBakery
  • Beaver Builder
  • Divi Builder (DIVI Theme)
  • Fusion Builder (Avada Theme)
  • Oxygen Builder

Einige grundlegende Informationen zur Auswahl

Es gibt neben diesen Pagebuildern natürlich auch noch andere Pagebuilder. Speziell beim SiteOrigin habe ich lange überlegt ob ich diesen mit in die Auswahl aufnehme.

Ich denke aber dass oben genannte mittlerweile dermaßen deutlich den Markt dominieren und der SiteOrigin Pagebuilder immer mehr in der Versenkung verschwindet weshalb ich mich gegen die Aufnahme entschieden habe.

Wäre der Gutenberg nicht Bestandteil vom WordPress Core, dürfte er auf Grund von Bewertungen vermutlich hier auch nicht Bestandteil sein 🤭.

Beim Divi Builder habe ich sowohl den Standalone Builder getestet, als auch das Divi Theme. Ich gebe zu dies war auch speziell für mich persönlich ein interessanter Test da ich schon länger vermute dass eine Kombination aus Divi Builder und einem „Performance Theme“ wie z.B. dem Astra Theme oder GeneratePress nicht zwangsläufig viel besser performt als das komplette Multipurpose Theme Divi. 

Der Fusion Builder vom Avada Theme ist der einzige Pagebuilder der nicht als „Standalone“ Lösung verwendet werden kann. Fakt ist aber dass das Avada wohl das weltweit am häufigsten eingesetzte WordPress Theme ist. 

Der Oxygen Builder wird vermutlich vielen gar nichts sagen obwohl es ihn bereits seit einigen Jahren gibt und dieser mittlerweile sogar schon in der Version 3 erhältlich ist. Der Oxygen fristete bis dato eher ein Schattendasein. Mit Version 3 könnte aber genau dieser Pagebuilder für ordentlich „Furore“ in der WordPress Welt sorgen. Später dazu mehr.

Welche Grundvoraussetzungen wurden für den Test geschaffen und wie waren die technischen Spezifikationen?

Für unseren Test habe ich im ersten Step mit dem Gutenberg Editor (in weiser Voraussicht dass es mir mit diesem am schwersten fallen würden ein exaktes Layout nachzubauen) einen individuellen Onepager gebaut. 

Dieser ist recht einfach aufgebaut und besteht aus verschiedenen Elementen.

Anschließend habe ich 6 weitere WordPress Seiten erstellt, jeweils den entsprechenden Pagebuilder installiert (teilweise mit Erweiterung – dazu aber auch später mehr) und dann das Grunddesign von der mit dem Gutenberg erstellten Seite nachgebaut.

Dabei habe ich versucht so perfekt wie möglich an das original heranzukommen.

Hier muss man sagen dass natürlich die Schriftfarbe, oder leicht abweichende Abstände oder auch die Größe eines Buttons keinen Einfluss auf die spätere Performance Bewertung haben werden, aber zum einen wollte ich so direkt (eventuellen) späteren Diskussionen aus dem Weg gehen und zum anderen wollte ich diesen Test auch nutzen um zusätzlich eine individuelle Einschätzung über das Handling mit den einzelnen Buildern zu geben. 

Teilweise musste ich mich so schon sehr genau mit der Funktionsweise vertraut machen um den ein oder anderen Bereich genau nachzubauen.

Somit gibt es als kleines „Goodie“ auch noch ein paar Infos wie gut oder wie schlecht mein Eindruck zu den einzelnen Pagebuildern war.

Hier die genaue technische Übersicht:

Hoster: Raidboxes
Starter Paket mit 2GB RAM, 1 vCore, SSD
Das Server Caching von Raidboxes wurde deaktiviert
PHP Version: 7.3
WordPress Version: 5.3.2
WordPress Theme: Astra
Plugins: Query Monitor

Pagebuilder Übersicht:

Gutenberg: Version 7.3.0, als Addon wurde das Plugin „Ultimate Add-Ons für Gutenberg“ installiert
Elementor: Version 2.8.5, als Addon wurde die Erweiterung Elementor Pro installiert
WPBakery: Version 6.1.0
Beaver Builder: Version 2.3.1.1, als Addon wurde die Erweiterung Beaver Builder Plugin Pro installiert
DiviBuilder: Version 4.2.2
Divi Theme: Version 4.2.2
Fusion Builder / Avada: 6.1.2

Was wurde getestet bzw. gemessen ?

Für die Performance Messungen habe ich jede Seite mit den folgenden Tools und Funktionen getestet:

GTmetrix Ladezeit: komplette Ladezeit der Webseite
GTmetrix Page Size: Seitengröße inkl. Bildern, Scripten etc.
GTmetrix Requests: Anzahl der Anfragen an die Datenbank
Webpagetest.org Ladezeit komplett: komplette Ladezeit der Seite
Webpagetest.org Start Render: die Dauer bis das erste sichtbare Element auftaucht
Query Monitor Ladezeit: Ladezeit der Seite laut Query Monitor
Query Monitor Peak Memory Usage: Speicher der benötigt wird wenn alle Scripte, PHP etc. laufen
Query Monitor Database Queries: Anzahl der Anfragen an die Datenbank die dei Seite lädt
Query Monitor Database Query Time: Zeitdauer für eine Anfrage an die Datenbank
PageSpeed Insights Google (Lighthouse): Test der Seite mit Google Developer Console und dem Site Audit (mobile Version)

Pagebuilder Performance Check 2020

So – damit sollten die grundsätzlichen Eckpunkte ausreichend erläutert sein. Dann starten wir einmal in unseren Test 💪.

Gutenberg Performance Test

So sieht unsere Gutenberg Seite aus:

Gutenberg GTmetrix Daten:

GTmetrix Details:

Gutenberg Webpagetest.org Daten:

Gutenberg Query Monitor Übersicht:

Gutenberg Google PageSpeed Insights:

Performance Daten Übersicht Gutenberg

GutenbergDaten:
Gtmetrix PageSpeed Score84%
GTMetrix Yslow Score86%
GTMetrix Ladezeit1,0sek
Gtmetrix PageSize457KB
GTMetrix Requests31
Webpagetest Ladezeit voll1,721sek
Webpagetest Speed Start Render0,600sek
Ladezeit Query Monitor0,12sek
Peak Memory Usage9,425kb
Database Queries32
DB Queries Time0,01168
Lighthouse Audit87 / 92 / 71 / 85

Gutenberg Usability

Der Gutenberg ist aktuell aus meiner Sicht in keiner Sicht eine Alternative zu bestehenden Pagebuildern. Blogartikel und eventuell einfache Seiten lassen sich umsetzen, aber komplexere Strukturen sind ein echter Krampf. Die Funktionalität um eine komplette Seite/Unterseite zu bauen ist dermaßen eingeschränkt und überhaupt nicht vergleichbar mit dem was die Konkurrent bietet. Es bleibt zu hoffen dass sich hier in den nächsten 1,2 Jahren noch einiges tut, denn aus performancetechnischer Sicht ist der Gutenberg Spitze!

Elementor Performance Test

So sieht unsere Elementor Seite aus:

Elementor GTmetrix Daten:

GTmetrix Details:

Elementor Webpagetest.org Daten:

Elementor Query Monitor Übersicht:

Elementor Google PageSpeed Insights:

Elementor Yellowlab.tools

Performance Daten Übersicht Elementor

ElementorDaten:
Gtmetrix PageSpeed Score97%
GTMetrix Yslow Score81%
GTMetrix Ladezeit1,1sek
Gtmetrix PageSize541kb
GTMetrix Requests47
Webpagetest Ladezeit voll1,569sek
Webpagetest Speed Start Render1,0sek
Ladezeit Query Monitor0,36sek
Peak Memory Usage18,276kb
Database Queries81
DB Queries Time0,02158
Lighthouse Audit66 / 95 / 79 / 85

Elementor Usability

Der Elementor Pagebuilder ist nicht umsonst der aktuelle Star in der Pagebuilder Szene. Ich denke einer der Hauptgründe ist neben der tollen und intuitiven Bedienung auch der extrem große Funktionsumfang den bereits die Free Version mitbringt. Die Performance, zumindest im Backend ist überragend und aus meiner Sicht mit die Beste die man bei einem Pagebuilder finden kann. Mit der Pro Version erhält man als Anwender geniale Optionen um professionelle Webseiten zu erstellen. Man muss es sagen wie es ist – es macht einfach richtig Spaß mit dem Elementor zu arbeiten.

WPBakery Performance Test

So sieht unsere WPBakery Seite aus:

WPBakery GTmetrix Daten:

WPBakery GTmetrix Details:

WPBakery Webpagetest.org

WPBakery Query Monitor Übersicht:

WPBakery Google PageSpeed Insights:

Performance Daten Übersicht WPBakery

WPBakeryDaten:
Gtmetrix PageSpeed Score97%
GTMetrix Yslow Score84%
GTMetrix Ladezeit1,0sek
Gtmetrix PageSize513kb
GTMetrix Requests37
Webpagetest Ladezeit voll1,487
Webpagetest Speed Start Render1,1
Ladezeit Query Monitor0,27sek
Peak Memory Usage11,261kb
Database Queries48
DB Queries Time0,0154
Lighthouse Audit90 / 96 / 79 / 85

WPBakery Usability

Der WPBakery ist der ultimative Pagebuilder wenn man bei themeforest bzgl. Premium Themes schaut. Ich denke dies ist lizenztechnisch beeinflusst denn offen und ehrlich gesagt – ich persönlich möchte mit diesem Pagebuilder keine einzige Seite bauen. 

Unabhängig davon dass ich ihn unglaublich unübersichtlich finde, sind mir auch bei der Erstellung unserer „Page“ diverse Punkte negativ aufgefallen – und wir reden hier eben nicht von einer „komplexen Seite“. Spalten Duplizierung nicht möglich, keine wirkliche Liveansicht, keine individuelle Anpassungen von Überschriften und Schriften möglich usw. usw.  – aus meiner persönlichen Sicht ist der wpBakery massiv schlechter als seine Konkurrenz.

 

BeaverBuilder Performance Test

So sieht unsere BeaverBuilder Seite aus:

BeaverBuilder GTmetrix Daten:

Beaver GTmetrix Details:

BeaverBuilder Webpagetest.org

BeaverBuilder Query Monitor Übersicht:

BeaverBuilder Google PageSpeed Insights:

Performance Daten Übersicht BeaverBuilder

BeaverBuilderDaten:
Gtmetrix PageSpeed Score94%
GTMetrix Yslow Score87%
GTMetrix Ladezeit1,1sek
Gtmetrix PageSize341kb
GTMetrix Requests31
Webpagetest Ladezeit voll1,177
Webpagetest Speed Start Render1,0sek
Ladezeit Query Monitor0,35sek
Peak Memory Usage15,720kb
Database Queries64
DB Queries Time0,0163
Lighthouse Audit94 / 95 / 79 / 85

Beaver Builder Usability

Wie eingangs geschrieben habe ich mir in der Vergangenheit etwas schwer mit der Bedienung getan. In meinem Test war ich ehrlich gesagt begeistert. Sehr intuitiv und mit dem Pro Addon sehe ich den Beaver Builder auf einer Stufe mit dem Elementor. Eine Sache hat mich bei meinem Test wirklich genervt. Wird ein Element geöffnet, braucht der Beaver so eine kurze Bedenkzeit bis alles geladen ist. Klickt man hier zu schnell bricht man damit den Ladevorgang des ursprünglichen Moduls ab und muss dies erneut öffnen. Das ist mir recht häufig passiert. 

Bezüglich der Performance kann man hier schon vorwegnehmen – der Beaver hat die Konkurrenz ganz schön alt aussehen lassen.

Divi Builder Performance Test

So sieht unsere Divi Builder Seite aus:

Divi Builder GTmetrix Daten:

Divi Builder GTmetrix Details:

Divi Builder Webpagetest.org

Divi Builder Query Monitor Übersicht:

Divi Builder Google PageSpeed Insights:

Performance Daten Übersicht Divi Builder

Divi BuilderDaten:
Gtmetrix PageSpeed Score82%
GTMetrix Yslow Score84%
GTMetrix Ladezeit1,1sek
Gtmetrix PageSize711kb
GTMetrix Requests40
Webpagetest Ladezeit voll1,817
Webpagetest Speed Start Render1,2sek
Ladezeit Query Monitor0,31sek
Peak Memory Usage29,017
Database Queries48
DB Queries Time0,0134
Lighthouse Audit76 / 96 / 79 / 85

Divi Builder Usability

Ich muss hier gleich direkt sagen dass ich durch die recht intensive Nutzung vom Divi Builder sicher etwas beeinflusst bin. Viele User die mit dem Divi beginnen zu arbeiten, empfinden ihn als unübersichtlich, überladen und ohne wochenlange Einarbeitungszeit schwierig zu bedienen. Ich habe bereits in der ersten Version mit dem Builder gearbeitet und kenne mich daher sehr gut aus. Auf dieser Basis in der Divi Builder für mich der beste Pagebuilder von allen. Wenn man weiß kann man eigentlich anpassen. Ich bin auch der Meinung das der Divi weitaus mehr Optionen bezüglich Anordnung und Designmöglichkeiten bietet als alle anderen Builder. Berichtigt mich gerne. 😀

Nach einer gewissen Einarbeitungszeit bin ich mittlerweile auch komplett auf den visuellen Frontend Builder umgestiegen – hier habe ich mich anfangs etwas schwer getan. 

Mit keinem anderen Pagebuilder bin ich dermaßen schnell bei der Erstellung und Individualisierung von Webseiten. Nachdem nun auch noch endlich die Option geschaffen worden ist eigene Header und Footer Templates zu erstellen war ich komplett zufrieden.

Fakt ist aber auch dass der Divi sowohl im Frontend als auch im Backend beim Seitenaufbau die größten Performance Probleme hat. Grundvoraussetzung ist ein top Rechner, da man ansonsten kaum flüssig arbeiten kann. Was ich ebenfalls negativ anmerken muss ist dass es immer mal wieder Bugs gibt und das auch recht häufig nach einem der vielen regelmäßigen Updates. 

Das für mich persönlich größte Manko ist nun mittlerweile aber der bereits erwähnte Aspekt das der Divi Builder ganz frech sämtliche Styles anderer Module und Plugins überschreibt.  Bei der aktuellen Arbeit habe ich z.B. beim Einsatz des Form Plugins Formcraft als auch beim Einsatz des Directory Plugins geodirectory massive Probleme da mit verwendeten Pagebuilder das CSS teilweise überschrieben wird und man einiges nacharbeiten muss um hier alles wie gewünscht darzustellen. Diese Probleme gibt es soweit ich weiß NUR mit dem Divi Builder.

Divi Theme Performance Test

So sieht unsere Divi Theme Seite aus:

Divi Theme GTmetrix Daten:

Divi Theme GTmetrix Details:

Divi Theme Webpagetest.org

Divi Theme Query Monitor Übersicht:

Divi Theme Google PageSpeed Insights:

Performance Daten Übersicht Divi Theme

Divi ThemeDaten:
Gtmetrix PageSpeed Score80%
GTMetrix Yslow Score83%
GTMetrix Ladezeit1,1sek
Gtmetrix PageSize740kb
GTMetrix Requests43
Webpagetest Ladezeit voll1,842
Webpagetest Speed Start Render1,2sek
Ladezeit Query Monitor0,30sek
Peak Memory Usage28,300kb
Database Queries49
DB Queries Time0,0137
Lighthouse Audit83 / 85 / 79 / 85

Divi Theme Usability

Zum eigentlichen Divi Builder habe ich zuvor bereits einiges geschrieben. Das Divi Theme grundsätzlich bietet wie von einem Multipurpose Theme erwartet extrem umfangreiche Einstellungs- und Konfigurationsmöglichkeiten. Ich gebe zu dass ich bei verschiedenen Optionen immer mal wieder länger suchen muss. Hier finde ich unseren folgenden Kandidaten, das Avada, weitaus besser.

Avada Performance Test

So sieht unsere Avada Seite aus:

Avada GTmetrix Daten:

Avada GTmetrix Details:

Avada Webpagetest.org

Avada Query Monitor Übersicht:

Avada Google PageSpeed Insights:

Performance Daten Übersicht Avada Theme

AvadaDaten:
Gtmetrix PageSpeed Score72%
GTMetrix Yslow Score82%
GTMetrix Ladezeit1,2sek
Gtmetrix PageSize846kb
GTMetrix Requests95
Webpagetest Ladezeit voll2,705sek
Webpagetest Speed Start Render1,5sek
Ladezeit Query Monitor0,5sek
Peak Memory Usage15,148kb
Database Queries73
DB Queries Time0,0185
Lighthouse Audit69 / 92 / 71 / 85

Avada Theme Usability

….wäre da nicht die Sache mit der Performance 😩

Das Avada ist bezüglich der Usability wirklich ein geniales Theme. Der Fusion Pagebuilder ist (zumindest) im Backend genial. Einmal eingearbeitet lassen sich Seiten extrem schnell erstellen und ausbauen. Bezüglich Design und Funktionen wird man förmlich erschlagen. Im Gegensatz zum Divi empfinde ich die Darstellung und Präsentation der Theme Einstellungen weitaus besser – vor allen Dingen aufgrund der integrierten Suche.

Was mir beim Fusion Builder fehlt ist die individuelle Steuerung von Schriften in den einzelnen Elementen. Ich versteh nicht dass man hier nicht mit der Konkurrenz gleichzieht. Bezüglich des visuellen Frontend Builders habe ich eingangs bereits erwähnt dass dieser aus meiner Sicht überhaupt nicht geht. Der ein oder andere mag das sicher anders sehen aber ich komme damit überhaupt nicht klar.

Ebenfalls erwähnen sollte man das in der Vergangenheit immer mal wieder recht große Probleme bei größeren Updates aufgetreten sind. Auch wir hatten hier bei einigen Kundenprojekten teilweise ordentlich zu tun um alte Avada Versionen auf den aktuellen Stand zu bringen.

Am Ende muss man eben aber vor allen Dingen die grottenschlechte Performance sehen. Das Pagebuilder und Multipurpose Themes nicht unbedingt einen Porsche aus eurer Webseite machen, ist wohl klar, aber die Ladezeiten und auch die Leistung die ein Avada deinem Server abverlangt ist schon heftig und liegt aus meiner Sicht nicht mehr im Verhältnis – vor allen Dingen eben auch weil die Konkurrenz zeigt das es auch besser geht.

Oxygen Builder Performance Test

So sieht unsere Oxygen Seite aus:

Oxygen GTmetrix Daten:

Oxygen GTmetrix Details:

Oxygen Webpagetest.org

Oxygen Query Monitor Übersicht:

Oxygen Google PageSpeed Insights:

Performance Daten Übersicht Oxygen

OxygenDaten:
Gtmetrix PageSpeed Score93%
GTMetrix Yslow Score89%
GTMetrix Ladezeit0,6sek
Gtmetrix PageSize403kb
GTMetrix Requests23
Webpagetest Ladezeit voll1,155
Webpagetest Speed Start Render0,6sek
Ladezeit Query Monitor0,14
Peak Memory Usage12,019kb
Database Queries39
DB Queries Time0,0162
Lighthouse Audit97 / 92 / 79 / 83

Oxygen Usability

Im Gegensatz zu den 2 Vorgängern ist Oxygen V3 schon um einiges genialer was UX und Funktionen angeht. Im Gegensatz zu vielen Kritiken die man so im Netz findet muss ich sagen ging mit der Bau unserer Testseite recht schnell von der Hand. Bei einigen Punkten habe ich vergeblich nach Einstellungsmöglichkeiten gesucht aber genau hier sollte eben auch erwähnt werden dass sich der Oxygen Builder eben (auch) an reine Entwickler wendet die auch in der Lage sind ein Theme von Hand zu coden. Mit dem Oxygen sollen dann Prozesse und Arbeiten massiv vereinfacht werden, aber es soll trotzdem die Möglichkeit erhalten bleiben quasi jeden Bereich der Seite individuell zu ändern und anzupassen ohne sich in den „Grenzen“ eines Pagebuilders zu bewegen.

Der Oxygen ist bezüglich der Funktionen die der Builder von Hause aus bietet sehr umfangreich, aber auch nicht mit denen eines Divi oder eines Elementors vergleichbar. Ich denke aber dass man mit Version 3 ein Produkt kreiert hat dass endlich für „Aufmerksamkeit“ in der WordPress Szene sorgt – zumindest hat man hier diesen Eindruck da der Oxygen schon sehr aktiv diskutiert wird.

Aus meiner Sicht ist es wichtig dass die Entwickler zügig den nächsten Schritt gehen. Es gibt extrem viele Baustellen die angegangen werden müssen und das geht vermutlich nur wenn man das ganze Projekt“ größer“ aufzieht. 

Das ist auf jeden Fall meine große Hoffnung. 

Sauberer Code, eine tolle Performance und 99%ige Freiheit bei der Entwicklung ist für verschiedene Projekte genial. Ich denke es gibt weiterhin Seiten und Projekte die ich mit einem anderen Pagebuilder umsetzen würde, einfach weil hier schneller bessere Ergebnisse zu erzielen sind. Im Rahmen eines Kundenbudgets muss man eben solche Entscheidungen treffen. 

Für komplexe Projekte oder auch für Seiten bei denen einfach entsprechendes Budget vorhanden ist, ist der Oxygen sicher eine geniale Lösung und ich freue mich hier auf kommende Arbeiten.

Auswertung unseres Performance Tests

Beste Werte

Höchster Gtmetrix PageSpeed Score: Elmentor & WPBakery mit 97%

Bester Gtmetrix Yslow Score: Oxygenbuilder mit 89%

Beste Gtmetrix Ladezeit: Oxygenbuilder mit 0,6sek

Kleinste Gtmetrix Seitengröße: BeaverBuilder mit 341kb

Niedrigste Anzahl Requests Gtmetrix: Oxygenbuilder mit 23

Beste Ladezeit bei Webpagetest.org: Oxygenbuilder mit 1,155sek

Schnellste Start Render Webpagetest.org: Gutenberg & Oxygenbuilder mit 0,6sek

Beste Ladezeit Query Monitor: Gutenberg mit 0,12sek

Niedrigster Peak Memory Usage: Gutenberg mit 9,425kb

Wenigste Database Queries: Gutenberg mit 32

Niedrigste Database Query Time: 0,01168 Gutenberg

Beste Lighthouse Daten: Beaver Builder mit 94/95/79/85 Punkten

Schlechteste Werte

Niedrigster Gtmetrix PageSpeed Score: Avada mit 72%

Niedrigster Gtmetrix Yslow Score: Elementor mit 81%

Langsamste Gtmetrix Ladezeit: Avada mit 1,2sek

Größte Gtmetrix Seitengröße: Avada mit 846kb

Höchste Anzahl Requests Gtmetrix: Avada mit 95

Langsamste Ladezeit bei Webpagetest.org: Avada mit 2,705sek

Späteste Start Render Webpagetest.org: Avada mit 1,5sek

Langsamste Ladezeit Query Monitor: Avada mit 0,5sek

Höchster Peak Memory Usage: Divi Builder (+Astra Theme) mit 29,017kb

Höchste Anzahl Database Queries: Elementor mit 81

Höchste Database Query Time: Elementor mit 0,02158sek 

Schlechteste Lighthouse Daten: Avada mit 69/92/71/85 Punkten

Hier die Gesamtübersicht als Tabelle

GutenbergElementorWPBakeryBeaverDivi BuilderDivi ThemeAvadaOxygen Builder
Gtmetrix PageSpeed Score84%97%97%94%82%80%72%93%
GTMetrix Yslow Score86%81%84%87%84%83%82%89%
GTMetrix Ladezeit1,0sek1,1sek1,0sek1,1sek1,1sek1,1sek1,2sek0,6sek
Gtmetrix PageSize457KB541kb513kb341kb711kb740kb846kb403kb
GTMetrix Requests3147373140439523
Webpagetest Ladezeit voll1,721sek1,569sek1,487sek1,177sek1,817sek1,842sek2,705sek1,155sek
Webpagetest Speed Start Render0,6sek1,0sek1,1sek1,0sek1,2sek1,2sek1,5sek0,6sek
Ladezeit Query Monitor0,12sek0,36sek0,27sek0,35sek0,31sek0,30sek0,5sek0,14sek
Peak Memory Usage9,425kb18,276kb11,261kb15,720kb29,017kb28,300kb15,148kb12,019kb
Database Queries3281486448497339
DB Queries Time0,011680,021580,01540,01630,01340,01370,01850,0162
Lighthouse Audit87 / 92 / 71 / 8566 / 95 / 79 / 8590 / 96 / 79 / 8594 / 95 / 79 / 8576 / 96 / 79 / 8583 / 85 / 79 / 8569 / 92 / 71 / 8597 / 92 / 79 / 83

Fazit Performance Test Pagebuilder

Die Leser die es bis hier ausgehalten haben möchte ich nun gar nicht mehr mit einem Roman „nach Hause schicken“. Hier noch einige kurze Anmerkungen die mir persönlich bei diesem Test in den Kopf gekommen sind:

  1. Der Oxygenbuilder ist bezüglich der Performance absolut beeindruckend! Sicher ist er nicht zu 100% mit einem Elementor oder Divi Builder bezüglich der Optionen und Möglichkeiten beim Seiten Aufbau zu vergleichen – aber zum einen ist er gar nicht „so weit weg“ und zum anderen bietet er zusätzlich sogar noch weitaus mehr Möglichkeiten eine WordPress Seite individuell zu gestalten
  2. Der WPBakery hat mich positiv überrascht. Er ist jetzt nicht wirklich irgendwo überragend oder sticht heraus, aber er ist im Vergleich der gesamten Daten konsequent immer vorn mit dabei und liefert zumindest aus meiner Sicht überraschend gute Daten.
  3. Der BeaverBuilder ist neben dem Oxygenbuilder mein persönlicher Favorit und hat mich extrem beeindruckt. Bezüglich der Performance deklassiert er Elementor, Divi und Avada. Bezüglich der Usability war ich von dem Möglichkeiten und der Einfachheit extrem positiv überrascht. Ich gebe zu – für kommende Projekte bei denen ein Pagebuilder zum Einsatz kommt werde ich vermutlich eher zum BeaverBuilder greifen als zum Divi.
  4. Das Divi Theme als auch der Divi Builder ist aus meiner persönlichen Sicht ein genialer Pagebuilder. Ich gebe aber offen zu das diese Test auch definitiv noch einmal klar macht dass die extrem umfangreichen Funktionalitäten auf Kosten der Performance gehen.

    Man muss sich immer klar machen dass wir hier vom Grundgerüst sprechen – wenn dazu noch e-commerce oder auch andere komplexere Funktionen kommen, kommt eine Seite recht schnell an ihr Limit und wenn ich dann so „verschwenderisch“ wir ein Divi agiere, fehlt mir diese Leistung am Ende dann doch schmerzlich.

  5. Divi Builder + Astra Theme ist nicht wirklich viel effektiver oder performanter als das Divi Theme direkt. Ich hatte es schon länger vermutet, dieser Test hat es jetzt bestätigt.
  6. Der Gutenberg ist bezüglich der Performance recht stark. Interessant ist das trotz der teilweise besten Daten bezüglich Requests, Page Size, Datenbank Queries etc. bei der eigentlichen Ladezeit nur hinteres Mittelfeld ist. Mit 1,721sek liegt der Gutenberg nur knapp vor dem Divi Theme.
  7. Der Elementor als aktueller Star in der Pagebuilder Szene enttäuscht aus meiner Sicht etwas. Er ist jetzt nicht wirklich schlecht, aber auch nicht wirklich gut. Erschreckend hoch ist die Anzahl der Datenbank Queries wo der Elementor mit 81 extrem hoch liegt. Auch bei der Database Query Time lag der Elementor mit 0,02158 sek am höchsten.

    Man muss sich hier halt im Klaren sein dass solche Daten gerade auch bei größeren Seiten schon einen spürbaren (negativen) Einfluss haben können. Zumindest sollte man erwähnen dass der Elementor kein Porsche unter den Pagebuildern ist – teilweise habe ich das Gefühl dass er hier doch etwas stark „gehypt“ wird und zumindest unser Test zeigt das er wenn überhaupt sich im Mittelfeld bezüglich der Performance bewegt.

  8. Last but not least – das Avada – ich möchte hier nicht ungerecht werden, aber die nackten Tatsachen sprechen aus performancetechnischer Sicht absolut gegen das Avada.

    Das Avada bewegt sich bei der Ladezeit ja nicht nur etwas schlechter als die Konkurrent sondern massiv mehr als deutlich. Für mich persönlich ist die Ladezeit von webpagetest.org der wichtigste Wert und hier liegt das Avada einfach einmal fast EINE SEKUNDE höher als die Konkurrenz. Ich möchte noch mal erwähnen dass ich sogar einiges an Features des Themes deaktiviert habe.

    Das hat alleine schon fast 20 Requests eingespart – man kann sich also vorstellen wo das Avada ohne Optimierung bewegt. Aus meiner Sicht kann das nicht sein und muss es vermutlich auch nicht. Das Divi Theme ist sicherlich auch kein „Performance-Monster“ – zeigt aber dass es auch deutlich besser geht. Interessant wäre warum sich das Avada auf einem dermaßen schlechten „Niveau bewegt“. Vielleicht hat hier der ein oder andere von euch ein paar Infos oder Ideen.

    Grundsätzlich muss ich mir als Anwender klar darüber sein dass wenn mein Theme schon bei einem einzelnen Aufruf dermaßen viel Ressourcen benötigt, dass dann Seiten mit weitaus mehr Traffic extrem hohe Anforderungen an den Server stellen – die Regel wird sein dass solche Avada Seite massiv in die Knie gehen – auch wenn nur 10 Leute gleichzeitig auf der Seite sind.

Damit bin ich am Ende meines Pagebuilder Performance Tests. Ich hoffe das die Informationen für euch interessant waren. 
Ich möchte versuchen in diesen Test noch 3 oder 4 Pagebuilder mit aufzunehmen. Den Visual Composer, den Brizzy, den Thrive Architect und eventuell den Siteorgin Builder. Ich mache das ein wenig davon abhängig wie dieser Artikel hier „angenommen“ wird. Schreibt hier gerne auch eure Meinung in die Kommentare.
 

Coole Infografiken zum Pagebuilder Test

Wer Interesse hat kann die folgenden 2 Infografiken gerne auf eigenen Seiten oder Social Accounts veröffentlichen.

Zu guter Letzt hier nun noch ein kleines Content Upgrade für alle diejenigen die immer noch nicht genug haben 😁

Bonusmaterial

Unsere Newsletter-Abonnenten sind uns sehr wichtig und wir investieren viel Zeit und Energie, um unseren Abonnenten zusätzlichen Mehrwert zu liefern.

Aus diesem Grund habe ich für diesen Artikel ein „Content Upgrade“ erstellt in dem du noch einen zusätzlichen Test findest – nämlich mit einem von mir erstellten Theme auf Bootstrap Basis welches natürlich exakt wie unsere anderen Kandidaten aussieht.

Im Content Upgrade findest du folgende Informationen:

  • kurze Info über das von mir erstellte WordPress Theme
  • Performance Daten & Screenshots für das Theme
  • kurzes Feedback
  • Downloadlink um das Theme herunterzuladen

Klingt das interessant?

Zugang zu erhalten ist sehr einfach: Du meldest Dich bei unserem Newsletter an. Das ist die einzige Bedingung.

Wenn dir unser Newsletter nicht gefällt, meldest du dich mit einem Klick auf den Link am Ende jeder E-Mail wieder ab.

Ganz einfach.

Um dich bei unserem Newsletter anzumelden und Zugang zum Bonusmaterial zu erhalten, fülle die folgende Anmeldung aus und folge den Anweisungen:

10 Kommentare zu „Pagebuilder Performance Check 2020“

  1. Avatar

    WOW, muss ich echt sagen, da steckt einiges an arbeit drin, ich habe den artikel gerade nur auf dem handy überflogen und werde ihn jetzt gleich noch mal zu hause lesen, aber geil!

  2. Avatar

    Ich bin offen gesagt extrem geschockt was das Avada angeht. Ich nutze das bereits seit Jahren immer mal wieder, aber der Unterschied ist ja schon gravierend 😱

  3. Avatar

    Was sollen solche Tests?? Leute kauft euch ein Buch zum Thema html/css und dann erstellt eure Seiten komplett ohne Pagebuilder! Die Dinger sind schrott!

  4. Avatar

    Danke für den Test, interessant wäre noch ein Test ohne Pagebilder, einmal rein WordPress mit Classic Editor und einmal eine reine HTML Seiten ohne CMS. Dann hatte der Test noch mehr Aussagekraft.

  5. Avatar

    Zuerst einmal gratuliere zu der Mühe, die sich hier gemacht wurde. In diesem Beitrag steckt sehr viel Arbeit drin, Respekt. Auch wurden die Rahmenbedingungen so gewählt, dass sie für eine große Anzahl von Anwendern eine Relevanz besitzen. Es gibt also nichts zum Motzen. Und die vergleichsweise kleine Anzahl an Profis kommt ohnehin ohne Builder aus, wenn es sich machen lässt. Aber um die geht es in diesem Blogbeitrag nicht.

    Erstaunlich, wie durchschnittlich der Gutenberg Editor abschneidet. Das sollte eigentlich aus Sicht von WordPress nicht sein. Ich persönlich vermisse im Vergleich den Page Builder von SiteOrigin und natürlich den Themify Builder. Anders als der u̶n̶s̶ä̶g̶l̶i̶c̶h̶ ̶g̶r̶o̶t̶t̶i̶g̶e̶ allseits beliebte Visual Composer müllen beide die Datenbank nicht zu und laden zumindest laut Chrome Entwicklertools deutlich schlanker und performanter.

    1. Christian

      @Elias, yellowlab.tools ist ja sehr geil, kannte ich bis dato nicht, vielen Dank erst mal dafür.
      Also ich habe alle Seite noch als Vorlage da und kann Sie wieder live nehmen. Ich schaue mal das ich die Daten vielleicht noch nachliefere.

      1. Avatar

        @Christian: Das wäre super, danke. Echt cool wäre auch die Möglichkeit die Kommentare zu abonnieren falls / wenn jemand noch kommentiert hat. Bin nur durch Zufall noch mal auf den Beitrag gestoßen. 😉

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

154 SEO Tools - die ultimative Liste!

Abonniere jetzt unseren Newsletter und lade dir die Liste kostenlos herunter!

Alles klar! Prüfe jetzt deinen Posteingang um die Anmeldung abzuschließen.