Führt der Traffic Ihres E-Commerce-Shops zu genügend Conversions? Wenn nicht, könnte Ihr Shop mit Leistungsproblemen zu kämpfen haben. Amazon verliert 1 % seines Online-Umsatzes von 141 Milliarden US-Dollar pro 100 ms Latenzzeit. Die BBC riskiert 10 % ihrer Website-Besucher pro zusätzlicher Sekunde Ladezeit.
Mit dem Wachstum Ihres Unternehmens steigt auch der Bedarf an neuen Funktionen, der Anpassung von Code und der Integration von Drittanbietersystemen. Überfordert von diesen steigenden Anforderungen ignorieren Marken oft die negativen Auswirkungen, die dies auf ihren Shop haben kann: langsame Ladezeiten der Website.
Selbst ein geringer Unterschied in der Geschwindigkeit Ihrer Website kann sich erheblich auf Ihren Gewinn auswirken. Dies sollte für Sie oberste Priorität haben. Eine langsame Website beeinträchtigt nicht nur die Konversionsrate, sondern führt auch zu einem schnellen Anstieg des Datenverkehrs. Laut Google kann eine Verzögerung der Website-Geschwindigkeit um 0,5 Sekunden zu einem Rückgang des Datenverkehrs um 20 % führen.
Plattformen wie Adobe Commerce (Magento) mit Vorteilen wie einer robusten Infrastruktur und mehreren integrierten Funktionen stellen Herausforderungen in Form von Ladegeschwindigkeit dar. Die kontinuierliche Optimierung Ihres Shops mit Ihrem Magento-Entwicklungspartner ist eine Voraussetzung für die Steigerung Ihres Umsatzes. In diesem Blog erfahren Sie, warum die Ladezeit von Seiten wichtig ist und welche Techniken zur Geschwindigkeitsoptimierung von Magento am besten geeignet sind, um dies zu erreichen.
Warum ist die Geschwindigkeitsoptimierung von Magento so wichtig?
Die Geschwindigkeit Ihrer Website hat einen direkten Einfluss auf Faktoren, die Ihren E-Commerce-ROI bestimmen, wie z. B. Benutzererfahrung, Konversionen, Absprungrate und SEO.
Nachdem wir die Faktoren besprochen haben, die zeigen, wie wichtig die Seitengeschwindigkeit für ein E-Commerce-Unternehmen sein kann, wollen wir uns nun mit den besten Techniken zur Leistungsoptimierung befassen, die für Magento-Shop-Betreiber geeignet sind.
Best Practices für die Leistungsoptimierung von Magento
1. Betonen Sie First Meaningful Paint (FMP)
First Meaningful Paint (FMP) oder das Laden von Inhalten oberhalb der Falz bedeutet, dass der relevanteste Teil der Seite zuerst angezeigt wird. Indem Sie den Bereich oberhalb der Falz beim Laden priorisieren, zeigen Sie den Nutzern Inhalte schneller an, was die Absprungrate reduziert.
Sie können dies erreichen, indem Sie JavaScript davon abhalten, im Voraus geladen zu werden. Wenn eine Webseite mit dem Rendern beginnt, wird auch der JS-Code parallel ausgeführt, was die Ladezeit erhöht. Um das gleichzeitige Laden von JS zu verhindern, können Sie die Code-Analyse mithilfe von Erweiterungen von Drittanbietern (z. B. Defer JavaScript) verzögern und unnötigen JS-Code an das Ende der Seite verschieben. Weniger zu verarbeitender JS-Code führt zu einer schnelleren Ladegeschwindigkeit der Seite.
2. Code-Optimierung
Sie passen den Code an Anforderungen wie die Erstellung neuer Funktionen und die Improvisation von Erweiterungen und Designs an. Veraltete oder unnötige Codes in der Anpassung können zu Leistungsproblemen führen und die Leistung Ihres Shops beeinträchtigen.
Melden Sie sich für dedizierte Magento Managed Services an, um Code-Audits durchzuführen, Engpässe zu identifizieren und den Code zu überprüfen und zu überarbeiten, um die Effizienz zu verbessern.
3. Suchoptimierung
Ein reaktionsschnelles Produktsuchsystem, das relevante Ergebnisse für Suchanfragen liefert, kann die Benutzererfahrung verbessern. Shops mit Tausenden von Produktkatalogen und Attributen können unter Indizierungsproblemen leiden, was zu Verzögerungen bei der Produktsuche führt.
Um die Suchfunktionalität zu beschleunigen, konfigurieren Sie die Best Practices für die Suchindexierung von Magento, um die Indexer für Preis, Produkt, Kategorieattribut usw. zu optimieren.
Auswirkungen von Indexern auf die Leistung Ihres Shops:
Indexer können Ihren Shop verlangsamen, indem sie Serverressourcen verbrauchen, wenn sie Produkte indizieren, die Sie Ihrem Portfolio hinzufügen. Für Magento-Indexer stehen zwei Modi zur Verfügung: „Update on Save” (Beim Speichern aktualisieren) und „Update on Schedule” (Nach Zeitplan aktualisieren).
Wenn Sie „Update on Save“ aktivieren, werden die Indexer immer dann ausgeführt, wenn Sie ein Produkt, eine Kategorie oder ein Attribut speichern. Die bessere Option, insbesondere wenn Sie Ihr Produktportfolio häufig erweitern, ist „Update on Schedule“. Mit diesem Indexer können Sie den Zeitpunkt festlegen, zu dem die Produkte und zugehörigen Informationen indexiert werden sollen. Es wird empfohlen, den Cron-Job für die Indizierung während Zeiten mit geringem Datenverkehr festzulegen.
Um den aktuellen Indizierungsmodus Ihres Shops zu erfahren, verwenden Sie den folgenden Befehl:
php bin/magento indexer:show-mode- Alternativ können Sie in Ihrem Admin-Panel zu „System > Indexverwaltung“ gehen.
- Ändern Sie den Modus mit dem folgenden Befehl in „Update on Schedule“ (Aktualisierung nach Zeitplan):
PHP bin/magento indexer:set-mode schedule
Sie können auch alle Indexer auswählen und die Option „Update on Schedule” (Aktualisierung nach Zeitplan) aktivieren, indem Sie:
- System > Indexverwaltung: Dropdown-Liste „Aktionen”
So planen Sie den Cron-Job für den Indexer „Update on Schedule“ (Aktualisierung nach Zeitplan):
- Speicher > Einstellungen > Konfiguration > Erweitert > System > Cron (geplante Aufgaben)
4. Elasticsearch
Elasticsearch ist eine Open-Source-Suchmaschine, die schneller genaue und relevante Suchergebnisse generiert. Basierend auf Apache Lucene, einer Suchbibliothek (Open Source), schlägt die Such- und Analyse-Engine automatisch Schlüsselwörter vor und vervollständigt Suchanfragen.
Dank der kontextbezogenen Suche kann die Suchmaschine nur nach relevanten Ergebnissen suchen, anstatt die gesamte Datenbank zu durchsuchen. Durch die Reduzierung der Suchvorgänge werden die Suchergebnisse schneller generiert.
Für verwandte Suchanfragen generiert die Suchmaschine Produkte, Bilder, Preise usw., wodurch die Suche eingegrenzt und letztendlich der Produktfindungsprozess für Benutzer beschleunigt wird.
Wenn Ihr Shop mit Magento 2.4.x oder späteren Versionen betrieben wird, ist Elasticsearch standardmäßig aktiviert. Wenn Sie ältere Versionen verwenden, können Sie es mit den folgenden Schritten aktivieren:
- Gehen Sie zu – Shops > Einstellungen > Konfiguration.
- Gehen Sie zu – Katalog > Katalog > Katalogsuche.
- Klicken Sie im Dropdown-Menü „Suchmaschine“ auf „Elasticsearch“.
- Klicken Sie auf „Konfiguration speichern“.
5. Optimieren Sie die Zeit bis zum ersten Byte (TTFB)
Die Zeit bis zum ersten Byte ist die Zeit, die ein Server benötigt, um das erste Byte an Informationen zu senden, nachdem er eine Anfrage (vom Benutzer) von einer Webanwendung erhalten hat. Mit anderen Worten: Es handelt sich um die Latenz zwischen einer Browseranfrage und der Antwortzeit des Servers, um das erste Byte zu senden.
Die Optimierung der TTFB ist wichtig für dynamische Seiten wie Warenkorb und Kasse. Faktoren wie nicht optimierter Code, schlechte Webserverkonfiguration, langsame Datenbank, Routing usw. erhöhen die TTFB.
Die von Google empfohlene TTFB beträgt 800 ms oder 0,8 Sekunden oder weniger. Sie können die TTFB optimieren, indem Sie das Caching und den Webserver konfigurieren, Erweiterungsprüfungen durchführen und den Code umgestalten.
6. GZip-Komprimierung
Die GZip-Komprimierung ist eine hervorragende Möglichkeit, Dateien zu komprimieren, die beim Laden einer Seite gerendert werden. Aktivieren Sie die GZip-Komprimierung für Ihren Shop. Durch die Konfiguration von GZip können Sie Dateien wie CSS, JavaScript, Schriftarten usw. komprimieren. Dadurch wird die Zeit reduziert, die der Server zum Herunterladen der
Dateien benötigt, was zu einer besseren Leistung führt.
GZip-Komprimierung aktivieren
7. Minimierung von CSS, JS und HTML
Magento bietet eine integrierte Funktion zur Minimierung von CSS und JavaScript. Die Optimierung von CSS und JS ermöglicht ein schnelleres Laden der Seiten, indem die Anzahl der an den Server gesendeten Anfragen um mehr als das 25-fache reduziert wird. So aktivieren Sie die integrierte Funktion:
Schalten Sie den Shop in den Produktionsmodus (Minimierung funktioniert nur im Produktionsmodus).
- Gehen Sie zu „Shops > Konfiguration > Erweitert > Entwickler” und aktivieren Sie die Änderung.
- Wählen Sie unter der Funktion „JavaScript-Dateien minimieren” die Option „Ja”.
- Klicken Sie auf „Konfiguration speichern”.
- Gehen Sie zu „System > Cache-Verwaltung“ und wählen Sie „Cache leeren“.
Quelle: Magento
8. Bildoptimierung
Bilder sind ein wesentlicher Bestandteil des E-Commerce, aber ihre Optimierung ist unerlässlich, um die Leistung Ihres Shops zu verbessern. Sie können Magento-Erweiterungen von Drittanbietern verwenden, um die Dateigröße ohne Qualitätseinbußen zu reduzieren.
Verwenden Sie Bildoptimierungstechniken wie Lazy Loading, bei dem Bilder erst nach dem Laden der gesamten Seite geladen werden. Sie können auch AWS oder ein CDN verwenden, um Ihre Inhalte schneller bereitzustellen.
Weitere Tipps zur Bildoptimierung sind die Vermeidung übergroßer Bilder und die Verwendung fortschrittlicher Bildformate wie Adopt WebP und JPEG 2000, die Dateien in kleinerer Größe ohne Qualitätseinbußen liefern.
9. Erweiterte JS-Bündelung
JS-Bundling reduziert zwar die Anzahl der an den Server gesendeten HTTP-Anfragen, lädt jedoch alle JS-Bundles, wenn eine Seite geladen wird. Fortgeschrittenes JS-Bundling behebt diesen Nachteil, indem es die Notwendigkeit einschränkt, alle JS-Bundles zu laden, wenn eine Seitenladeanfrage an einen Server gesendet wird.
Jede Seite in Ihrem Shop, sei es PDP oder PLP, benötigt nur einen bestimmten Satz von JS-Bundles zum Laden. Mit dem erweiterten JS-Bundling können Sie Bundles basierend auf dem Typ der Seite definieren, z. B. Checkout, CMS-Seiten, Produktdetailseiten, Kategorie usw.
Quelle – Magento
10. Überprüfen Drittanbieter-Erweiterungen
Die Prüfung Ihrer Magento-Erweiterungen von Drittanbietern ist eine wichtige Maßnahme, um herauszufinden, ob diese Geschwindigkeitsprobleme für Ihren Shop verursachen.
Um die Überprüfung durchzuführen, wählen Sie eine Erweiterung eines Drittanbieters aus und deaktivieren Sie sie. Leeren Sie den Cache und führen Sie einen Geschwindigkeitstest auf Seiten wie der Startseite, der Kasse, dem Warenkorb, der Produktdetailseite und den Kategorieseiten durch. Achten Sie auf Veränderungen in der Leistung Ihres Shops. Wenn Sie eine positive Auswirkung auf die Geschwindigkeit feststellen, haben Sie die Erweiterung gefunden.
Führen Sie diesen Vorgang für alle Erweiterungen von Drittanbietern durch, um festzustellen, ob sie sich auf die Leistung auswirken. Wenden Sie sich an den entsprechenden Anbieter, melden Sie Probleme und bitten Sie um eine Lösung.
11. Nutzen Sie flache Kataloge
Wenn Ihr Magento-Shop große Mengen an Katalogen präsentiert, ist die Aktivierung flacher Kataloge eine praktische Methode zur Leistungsoptimierung.
Magento speichert Produktdaten und Attribute mithilfe eines EAV-Modells (Entity Attribute Value). EAV ist ein Datenmodell, das Magento zur Bezeichnung von Entitäten verwendet. Mit diesem Modell können Sie Entitäten zusammen mit Attributen hinzufügen, die diese beschreiben. In diesem Modell enthält eine Entität Daten wie Produkte, Kategorien, Kunden und Bestellungen. Attribute sind Daten, die sich auf eine Entität beziehen, wie Name, Preis usw.
Das EAV-Modell ermöglicht es der Plattform, Daten auf organisierte Weise zu speichern und alle relevanten Daten übersichtlich zu halten.
Die Attribute jeder Entität werden je nach Wertetyp in verschiedenen Tabellen gespeichert. Wenn Produktinformationen benötigt werden, werden Anfragen an mehrere Tabellen gesendet, um Daten abzurufen. Dies verlangsamt die Antwortzeit der Abfrage.
Die Option „Flat Tables” in Magento führt mehrere Attribute einer Entität in einer einzigen Tabelle (Flat Table) zusammen. Um Produktinformationen anzuzeigen, wird also nur eine Tabelle abgefragt, was die Antwort beschleunigt.
Bei der Indizierung generiert und aktualisiert Magento Flat Tables. Aktivieren Sie diese Option mit den folgenden Schritten:
- Gehen Sie zu „Stores“ > „Konfiguration“ > „Katalog“ > „Katalog“ > „Storefront“.
- Wählen Sie unter „Flat Catalog Category verwenden“ die Option „Ja“
- Wählen Sie unter „Flat Catalog Product verwenden“ die Option „Ja“.
- Klicken Sie auf „Konfiguration speichern”.
Quelle – Magento
12. CDN integrieren
Mit CDN (Content Delivery Network) können Sie die Reaktionszeit erheblich verkürzen. Ein CDN speichert die dynamischen Elemente Ihres Shops wie CSS, JavaScript, Bilder, Videos und Schriftarten im Cache und rendert sie, wodurch die Belastung der Server minimiert wird.
CDN gewährleistet eine hohe Verfügbarkeit, indem es mehrere Bereitstellungsnetzwerke nutzt, um statische Inhalte in Ihrem Magento-Shop zu rendern. So implementieren Sie CDN für Ihren Magento-Shop:
- Gehen Sie zu Shop > Konfiguration > „Allgemein“
- Wählen Sie unter „Allgemein” die Registerkarte „Web”
- Wählen Sie Basis-URLs
- Geben Sie unter dem Feld „Basis-URL für statische Ansichtsdateien“ den CDN-Speicherort an, an dem statische Dateien gespeichert sind.
- Geben Sie im Feld „Basis-URL für Benutzermediendateien“ den CDN-Speicherort der JavaScript-Dateien an.
- Klicken Sie auf „Konfiguration speichern“.
Quelle – Magento
13. Datenbankprotokolle löschen
Magento generiert Protokolle, um durchgeführte Aktionen (z. B. angesehene Produkte) zu verfolgen. Mit der Zeit sammeln sich diese Protokolle in der Datenbank an und verlangsamen die Reaktion. Durch die Datenbankbereinigung werden Protokolle gelöscht, was die Leistung und Latenz der Website verbessert.
- Gehen Sie zu > Shops > Konfiguration
- Klicken Sie auf die Option „Erweitert“.
- Wählen Sie nach dem Erweitern die Registerkarte „System“ und öffnen Sie „MySQL Message Queue Cleanup“ (MySQL-Nachrichtenwarteschlange bereinigen).
- Legen Sie im Feld „MySQL Message Queue Cleanup“ die Zeit fest, zu der die automatische Bereinigung der Protokolle ausgelöst werden soll.
- Klicken Sie auf „Konfiguration speichern“.
Quelle – Magento
14. Ablauf-Header und Render-Blocking
Ablauf-Header weisen Magento 2 an, wie lange es statische Inhalte Ihres Shops zwischenspeichern soll. Durch die Konfiguration von Ablauf-Headern können Sie verhindern, dass der Browser den Server abfragt, um die unveränderten Teile einer Seite zu rendern. Sie können Ablauf-Header in Konfigurationsdateien auf Servern wie Apache oder Nginx hinzufügen.
Render-Blocking priorisiert CSS gegenüber JavaScript beim Laden einer Seite, wodurch der sichtbare Inhalt schneller gerendert wird.
15. Varnish-Cache
Varnish Cache ist die Caching-Technik für Magento 2, die als Proxy für Webserver dient. Wenn ein Client (Browser) eine Anfrage an einen Server sendet, um eine Webseite zu laden, verarbeitet der Server die erforderlichen CSS-, HTML-, JavaScript- und Bilddateien.
Varnish Cache erstellt einen temporären Speicher für diese Elemente. Wenn nachfolgende Anfragen eingehen, rendert Varnish Cache die zwischengespeicherten Assets an den Client, wodurch die Abfragen auf dem Server erheblich reduziert werden. Dies verbessert die Reaktionszeit und ermöglicht ein schnelleres Laden.
16. Redis-Cache
Der Redis-Cache spielt eine wichtige Rolle beim Datenbank-Caching und beim Session-Store-Caching. Bei Websites mit dynamischeren Seiten hilft das Datenbank-Caching, die Serverlast zu reduzieren.
Der Session-Store erfasst Daten wie Profilinformationen, Empfehlungen, Rabatte usw. vom Anmelden bis zum Abmelden eines Benutzers.
Redis ist ein In-Memory-Caching-System und kann für beide Zwecke verwendet werden. Mithilfe seines Eviction-Mechanismus können Sie mit dem Redis-Cache Daten entfernen, um Platz für neues Caching zu schaffen. Dazu stehen Ihnen 6 Eviction-Szenarien zur Verfügung.
17. Wechseln Sie in den Produktionsmodus
Stellen Sie sicher, dass Ihr Magento-Shop im „Produktionsmodus” betrieben wird. Der Produktionsmodus ist für beste Leistung optimiert. Sie können Ihren Shop mit dem folgenden Befehl in den Produktionsmodus versetzen: bin/magento deploy:mode:set production
18. Versions-Upgrades
Aktualisieren Sie Ihren Magento-Shop, um alle Verbesserungen der neuesten Version nutzen zu können. Magento bietet regelmäßig Upgrades an, die darauf abzielen, die technischen Eigenschaften des Systems insgesamt zu verbessern und Mängel in früheren Versionen zu beheben, wobei der Schwerpunkt auf Sicherheit und Leistung liegt.
Wenn Sie Ihren Magento-Shop auf dem neuesten Stand halten, können Sie von den Leistungsverbesserungen profitieren. Sie können sich von Ihrer Magento-/Adobe Commerce-Entwicklungsagentur bei der Aktualisierung Ihres Shops unterstützen lassen.
19. PWA
Progressive Web Apps bieten Kunden ein Erlebnis, das dem einer mobilen App ähnelt. PWA konzentriert sich auf die Verbesserung der Leistung von Webanwendungen auf Mobilgeräten, was nicht nur das Kundenerlebnis und die Konversionsrate verbessert, sondern auch zu besseren SEO-Rankings führt. Durch die Darstellung eines mobilen App-ähnlichen Erlebnisses macht PWA das Herunterladen der mobilen App Ihres Shops oder die Kosten für die Entwicklung einer mobilen App überflüssig.
Als Shop, der auf Magento basiert, können Sie PWA Studio, das SDK von Magento, nutzen, um progressive Web-Apps zu erstellen.
Zusammenfassung
Geschwindigkeit ist entscheidend. Punkt. Tatsache ist, dass sich Ihre monatelange Entwicklungsarbeit und Ihre jahrelangen Marketingbemühungen nur dann auszahlen, wenn Ihre Website schnell genug ist, um ihre Inhalte bereitzustellen. Eine bessere Website-Geschwindigkeit sorgt nicht nur für einen guten ersten Eindruck, sondern sorgt auch dafür, dass Kunden wiederkommen, und kann Sie von Ihren Mitbewerbern abheben.
Machen Sie die Leistungsoptimierung von Magento zu Ihrer obersten Priorität. Befolgen Sie die oben beschriebenen Techniken zur Optimierung der Geschwindigkeit von Magento-Websites. Lassen Sie sich von einer offiziellen Magento-Partneragentur mit praktischer Erfahrung in der Leistungsoptimierung unterstützen.
Da viele der Strategien die Serveroptimierung betreffen, kann die Wahl eines Partners mit Fachkenntnissen in der Bereitstellung plattformspezifischer Serverumgebungen wie Upsun eine optimale Leistung gewährleisten, die auf die individuellen Anforderungen Ihres Magento-Shops zugeschnitten ist.
