Wie Elementor die Leistung von Websites priorisiert und verbessert

Lassen Sie uns über die Produkt-Roadmap von Elementor für 2021 sprechen, insbesondere über die Leistungsoptimierung. Während wir weiterhin coole neue Funktionen planen und entwickeln, die von unserer Community gewünscht wurden, haben wir es uns dieses Jahr zur Aufgabe gemacht, die Leistung der Websites unserer Benutzer zu verbessern. In diesem Beitrag möchte ich einige der Maßnahmen, die wir bereits ergriffen haben, um dieses Ziel zu erreichen, mit Ihnen teilen und ein wenig darüber sprechen, was im kommenden Jahr kommen wird.

Die Leistung von Websites ist seit den Anfängen des Internets ein Problem für Webentwickler. Da ich selbst Web-Ersteller bin, würde ich immer Fragen stellen wie:

• „Ist meine Website zu langsam? Führt es dazu, dass Nutzer das Unternehmen verlassen, oder schadet es meinen Google-Rankings?“
• „Sollte ich eine bestimmte Funktionalität loslassen, um die Geschwindigkeit der Website zu verbessern?“
• Und natürlich: „Was in aller Welt verursacht immer noch meine Leistungsprobleme? Ich dachte, ich hätte hier alle Grundlagen abgedeckt!“

Also ja, eine herausragende Leistung aus einer Website herauszuholen war schon immer eine Herausforderung für Webersteller, unabhängig von der Plattform oder den Tools, die wir verwenden. Bei so vielen relevanten Faktoren, die die Leistung beeinflussen, ist es nicht immer einfach, das eigentliche Problem zu isolieren, geschweige denn eine Lösung dafür zu finden. Genau aus diesem Grund haben wir diesen fünfteiligen Videokurs zum Thema Performance erstellt . In dieser Serie gehen wir auf jeden wichtigen Faktor ein, der die Leistung Ihrer Website beeinflussen kann, unabhängig davon, ob er mit Elementor zusammenhängt oder nicht, und führen Sie durch die Optimierung.

Um die Sache wirklich interessant zu machen, hat Google kürzlich angekündigt, dass die Website-Performance nun offiziell eine Rolle in seinem Ranking-Algorithmus spielt. Dies rückt das Thema Leistung in den Mittelpunkt und weckt Bedenken bei Website-Besitzern auf der ganzen Welt. Aus diesem Grund haben unsere R&D- und SEO-Teams in den letzten sechs Monaten unermüdlich daran gearbeitet, sicherzustellen, dass die Elementor-Websites dieses Update überstehen und mit Bravour bestehen.

Wenn es um den mysteriösen Algorithmus von Google geht, wissen wir, dass es viel mehr braucht als unser Wort, damit Sie sich sicher fühlen. Als Service für unsere Benutzer und die Web-Creator-Community werden wir daher ein kostenloses Web-Performance-Webinar mit führenden SEO-Experten veranstalten , um die bevorstehende Änderung zu diskutieren. Dies betrifft nicht nur das Update selbst, sondern beschreibt auch, wie sich diese Änderung auf Ihre Website auswirken kann und was Sie zur Vorbereitung tun können. Das Webinar findet am 28. April statt, also sichern Sie sich Ihren Platz .

Abgesehen von allen Kursen und Webinaren besteht unser Hauptziel jedoch darin, sicherzustellen, dass unser Produkt die Leistung Ihrer Website nicht beeinträchtigt. Dies war und bleibt für uns oberste Priorität. Lassen Sie uns also ohne weiteres in die Leistungsoptimierungsbemühungen von Elementor eintauchen, wie sie in unserer Produkt-Roadmap 2021 festgelegt sind.

Neben der Optimierung unseres Produktentwicklungszyklus besteht unsere Vision zur Verbesserung der Leistung von Elementor aus einem fünfgleisigen Ansatz. In einigen dieser Bereiche haben wir bereits einige wesentliche Verbesserungen vorgenommen, während andere in den kommenden Versionen von Elementor behandelt werden.

Wir sind auch stolz darauf, dass Performance zu einem integralen Bestandteil unserer Entwicklungs- und Release-Pipeline geworden ist. Jede Version von Elementor wird jetzt anhand einer Vielzahl von Leistungsmetriken validiert, um sicherzustellen, dass keine neuen Funktionen, Optimierungen oder Fixes negative Auswirkungen auf bestehende Websites haben, die mit Elementor erstellt wurden.

Sehen wir uns nun unsere Tracks nacheinander an:

Wir verbessern die Art und Weise, wie Elementor Assets lädt, um sicherzustellen, dass nur das geladen wird, was auf jeder Seite benötigt wird. In den neuesten Versionen von Elementor und Elementor Pro haben wir das optimierte Asset-Ladeexperiment eingeführt, um die Front-End-Leistung einer Website zu verbessern und jede Seite zu beschleunigen, indem nur die benötigten Funktionen geladen werden. Hier können Sie mehr darüber erfahren.

Wir haben bestimmten Widgets auch Lazy-Loading-Optionen hinzugefügt und werden dies auch in Zukunft tun. Das Video-Widget enthält beispielsweise eine Lazy-Load-Option, mit der Sie den eingebetteten vollständigen Videoplayer durch ein statisches Miniaturbild ersetzen können. Das Bild wechselt dann zurück zum vollständigen Video, sobald ein Besucher damit interagiert.

Durch die Verwendung dieser Lazy-Loading-Techniken können Sie die Seitengröße und die Anzahl der HTTP-Anfragen während des anfänglichen Ladens der Seite erheblich reduzieren, was zu einer viel schnelleren Erfahrung für Ihre Besucher führt.

Seit wir Elementor vor fast fünf Jahren eingeführt haben, haben sich die Webbrowser stark weiterentwickelt. Jetzt können einige Funktionen, die vor fünf Jahren externe Bibliotheken erforderten, mit nativer Browserunterstützung implementiert werden. Dies sorgt für eine wesentlich effizientere Implementierung und kann in einigen Fällen die JavaScript-Ausführungszeit erheblich verkürzen.

Ein Beispiel dafür ist die Waypoints-Bibliothek, die in bestimmten Fällen durch die native Intersection Observer API ersetzt wurde.

Unser Ziel ist es, die Verwendung dieser Arten von CSS- und JavaScript-Bibliotheken zu reduzieren und sie nach Möglichkeit durch native Browserunterstützung zu ersetzen.

Wir planen, das vorhandene interne JavaScript und CSS von Elementor weiter zu verbessern und zu optimieren.

Beispiele hierfür sind die Möglichkeit, die Lademethode von Google Fonts zu konfigurieren und die Eigenschaft font-display, die der Font Awesome-Bibliothek hinzugefügt wurde. Diese Verbesserungen sollten die Render-Blocking-Prozesse für diese Dateien reduzieren und eine zusätzliche Optimierung bestehender CSS- und JS-Dateien ermöglichen.

In Elementor 3.0 haben wir den dynamischen CSS-Lade- und Rendering-Mechanismus verbessert. Elementor wird verwendet, um Seiten nach Elementen mit dynamischen Werten bei jedem Seitenladen zu durchsuchen. Ab Elementor 3.0 erstellt Elementor, wenn eine Seite erstellt und zum ersten Mal besucht wird, einen Cache aller Elemente mit dynamischen Werten. Anstatt die Seite bei jedem Seitenbesuch nach dynamischen Elementen zu durchsuchen, wird die Liste dann aus dem Cache geholt und sofort gerendert. Dies verbessert die serverseitigen Renderingzeiten erheblich und führt zu spürbaren Verbesserungen. Wir planen, in Zukunft weitere Parsing-Verbesserungen in Elementor zu implementieren. In diesem Blogbeitrag erfährst du mehr darüber.

Schließlich planen wir, die Codeausgabe, die Elementor generiert, weiter zu verbessern und zu verkleinern, um die Größe des DOM zu reduzieren.

Wir haben bereits mit diesen Verbesserungen in Elementor 3.0 begonnen, wo wir drei Wrapper-Elemente entfernt haben, um ein kleineres DOM zu erstellen und die Codeausgabe zu vereinfachen.

In Elementor 3.2 haben wir zwei weitere Elemente entfernt, um die Größe des DOM noch weiter zu reduzieren. Weitere Reduzierungen sind in naher Zukunft geplant.

Wie Sie sehen, ist 2021 und darüber hinaus mit neuen Funktionen, Verbesserungen und Überholungen zu rechnen. Dies alles geschieht, um Ihnen zu helfen, weiterhin erstaunliche Websites mit besserer Leistung zu erstellen. Wenn Sie noch nicht auf die neueste Version aktualisiert haben, sollten Sie diese und andere Verbesserungen genießen.

Wie Sie vielleicht wissen, gibt es viele nicht Elementor-bezogene Faktoren, die die Leistung Ihrer WordPress-Website beeinflussen. Dazu gehören Bildoptimierung, Webhosting, Serveranbieter, CDN und mehr. Da wir unseren Benutzern die Implementierung einer vollständigen WordPress-Optimierung ermöglichen möchten, haben wir eine umfangreiche Ressourcendatenbank mit kostenlosen Tutorials, Webinaren und Artikeln erstellt, die Ihnen helfen, mehr über die Leistung zu erfahren.

• Wir haben einen Videokurs zum Thema Leistung erstellt – in dieser fünfteiligen Serie gehen wir auf alle wichtigen Faktoren ein, die Ihre Leistung beeinflussen können und wie Sie sie optimieren können.

• Am 28. April veranstalten wir ein Webinar zu Core Web Vitals mit führenden SEO-Experten, um die bevorstehende Änderung des Google-Algorithmus und deren Auswirkungen auf Ihre Websites zu diskutieren. Sichern Sie sich hier Ihren Sitzplatz.

• Wir haben auch einen ausführlichen Blogbeitrag zur Beschleunigung von WordPress-Websites veröffentlicht, zusammen mit anderen leistungsorientierten Artikeln zu Themen wie der Auswahl von Webhosting, Caching-Plugins, Ausführung von Geschwindigkeitstests, Verwendung von WP Rocket und mehr.

Wir werden weiterhin kostenlose Webinare, Blog-Posts und Videos erstellen, um andere Aspekte der WordPress-Leistung zu behandeln, um die Web-Creator-Community weiterhin zu unterstützen.