Die Geschwindigkeit deines Onlineshops verbessern

Diese Seite wurde gedruckt um Dec 07, 2023. Die neueste Version findest du unter https://help.shopify.com/de/manual/online-store/store-speed/improving-speed.

Auf die Geschwindigkeit deines Onlineshops wirken sich mehrere Faktoren aus, von denen du einige steuern kannst.

Wenn du nicht weißt, wie schnell dein Onlineshop heute ist, kannst du deinen Bericht zur Onlineshop-Geschwindigkeit anzeigen.

Auf dieser Seite

Faktoren, die du nicht steuern kannst

Gerät, Netzwerk und Standort deines Kunden

Kunden, die deinen Shop besuchen, leben auf der ganzen Welt und haben unterschiedliche Geräte und Internetverbindungen. Dies bedeutet, dass dein Shop abhängig von diesen Faktoren möglicherweise schneller oder langsamer geladen wird.

Wenn ein Kunde dich wegen der Geschwindigkeit deines Shops kontaktiert, bitte den Kunden, zu überprüfen, ob er die neueste Version seines Browsers verwendet, ob er kürzlich den Cache gelöscht hat und sein Internetdienstanbieter keine Ausfälle oder eine herab gefahrene Leistung erlebt.

Shopify-Infrastruktur

Shopify hostet deinen Onlineshop auf schnellen, globalen Servern und begrenzt nicht die Bandbreite deines Shops. Du kannst den Status deines Shopify-Shops unter Shopify-Status überprüfen.

Shopify nimmt fortlaufend Verbesserungen am Code und der Infrastruktur vor. Einige dieser Verbesserungen können sich bei deinem Geschwindigkeits-Score zeigen.

Im Folgenden findest du einige Funktionen, die sich auf die Geschwindigkeit deines Onlineshops auswirken.

Content Delivery Network (CDN)

CDN steht für Content Delivery Network. Shopify bietet Händlern ein CDN von Weltklasse, das von Cloudflare ausgeführt wird und sicherstellt, dass dein Onlineshop auf der ganzen Welt schnell geladen wird. Du kannst den CDN-Status auf der Cloudflare-Statusseite überprüfen.

Lokaler Browser-Cache

Der Shop speichert Caches oder einige Elemente im lokalen Speicher des Kunden vorübergehend. Wenn der Kunde das nächste Mal deinen Onlineshop besucht, kann der Browser Ressourcen aus dem Cache laden, anstatt eine weitere Anfrage an den Server zu senden.

Shopify legt das Browser-Caching für Cache-fähige Ressourcen in deinem Shop auf ein Jahr für jede Datei fest. Dateien, die zwischengespeichert werden können, sind Bilddateien, PDFs, JS-Dateien und CSS-Dateien.

Serverseiten-Cache für Seiten

Zusätzlich zum Caching des lokalen Browsers speichert Shopify Seiten auf der Serverseite. Wenn eine Seite zum ersten Mal geladen wird, ist es möglicherweise langsamer, aber spätere Seitenlasten werden schneller, da Kunden eine zwischengespeicherte Kopie erhalten.

Die Assets im Liquid-Objekt content_for_header

Das Liquid-Objekt `` injiziert Assets, die von verschiedenen Onlineshop-Funktionen verwendet werden, einschließlich Leistungsanalysen und optionalen Funktionen wie dynamischen Checkout-Buttons. Das Laden dieses Objekts und verbundener Assets wirkt sich auf die Geschwindigkeit deines Shops aus. Shopify optimiert das Tag und seine Assets, um es schneller zu machen.

Faktoren, die du steuern kannst

Im Folgenden findest du einige Faktoren, die sich auf die Geschwindigkeit deines Onlineshops auswirken könnten, und erfährst, wie du diese angehen kannst.

Apps

Wenn du Apps hinzufügst, um die Funktionalität oder das Erscheinungsbild deines Onlineshops zu ändern, fügen diese Apps dem Theme Code hinzu, damit sie ausgeführt werden können. Mancher Code kann entfernt oder neu angeordnet werden, um die Leistung deines Onlineshops zu verbessern. Wenn du keine App verwendest, kannst du den Code entfernen.

Wenn du der Meinung bist, dass eine App deinen Shop verlangsamt, führe die folgenden Schritte aus:

  • Deaktiviere App-Funktionen, die du nicht verwendest, oder entferne die App, wenn du sie nicht benötigst. Betrachte das Gleichgewicht zwischen Onlineshop-Funktionen und Geschwindigkeit.
  • Wenn du eine App entfernst, solltest du den Code entfernen, der während des App-Installationsvorgangs hinzugefügt wurde. Einige Apps helfen dir bei diesem Vorgang, indem sie ihren Code in {% comment %}-Tags einhüllen, die den App-Namen enthalten. Das Entfernen von nicht verwendetem App-Code ist eine Best Practice. Sie verhindert, dass Code für nicht verwendete Funktionen ausgeführt wird und verbessert die Lesbarkeit deines Theme-Codes.
  • Wende dich an deinen App-Entwickler.
  • Engagiere einen Shopify-Partner für weitere Unterstützung. Erhalte mehr Informationen über das Engagieren von Shopify-Partnern.

Themes

Themes bestehen aus Liquid-, HTML-, CSS- und JavaScript-Code. Wenn du Themes bearbeitest oder anpasst, können die Dateigrößen ansteigen und sich auf die Geschwindigkeit deines Shops auswirken.

Wenn du der Meinung bist, dass etwas in deinem Theme deinen Shop verlangsamt, führe die folgenden Schritte aus:

Theme- oder App-Funktionen

Wenn bestimmte Funktionen aktiviert sind, können sie sich auf die Geschwindigkeit deines Shops auswirken. Zum Beispiel laden einige Schnellansicht-Pop-up-Fenster vorab Informationen aus jeder Produktseite, wenn eine Kollektionsseite geladen wird. Das Laden von zusätzlichen Daten, die deine Kunden nicht verwenden, kann sich auf die Geschwindigkeit deines Shops auswirken, ohne Mehrwert zu erzielen.

Wenn du der Meinung bist, dass eine Funktion deinen Shop verlangsamt, kannst du die folgenden Schritte ausführen:

Komplexer oder ineffizienter Liquid-Code

Du kannst fast den gesamten Liquid-Code bearbeiten, der zum Rendern deines Shops verwendet wird. Es gibt effiziente und ineffiziente Methoden, um Liquid-Code zu schreiben. Durch die wiederholte Ausführung komplexer Operationen kannst du deine Zeit zum Rendern von Liquid-Code steigern, was sich auf die Gesamtgeschwindigkeit deines Shops auswirkt.

Wenn du z. B. die Produkte in einer Kollektion nach Preis anordnen möchtest, solltest du dies tun, bevor du die Produkte in deiner Kollektion durchläufst, und nicht als Teil des Durchlauf-Codes. Das ist empfehlenswert, da sich die Reihenfolge der Produkte nicht für jedes Produkt ändert und die Berechnung der Reihenfolge der Produkte der Anfrage Verarbeitungszeit hinzufügt.

Wenn du Bedenken hast, dass dein Code nicht optimiert ist, kannst du die folgenden Schritte ausführen:

  • Führe den Shopify Theme Inspector für Chrome aus, um die Code-Zeilen zu identifizieren, die Seiten in deinem Onlineshop verlangsamen.
  • Engagiere einen Shopify-Partner, der dir dabei hilft, ineffizienten oder nutzlosen Code zu finden.

Bilder und Videos

Übergroße Bilder und Bilder, die nicht sichtbar sind, können das Laden anderer, wichtigerer Teile einer Seite beeinträchtigen. Wenn Nutzer darauf warten müssen, dass große Bilder geladen werden, verlangsamt dies deinen Shop möglicherweise.

Shopify verfügt über einige Schutzmaßnahmen, um zu verhindern, dass du deinen Onlineshop mit Bildern oder Videos überlastest. Zum Beispiel:

  • Du kannst nicht mehr als 50 Produkte auf einer Kategorieseite oder 25 Abschnitte auf deiner Startseite haben.
  • Bei vielen Themes wird das Laden von Bildern, die derzeit nicht auf dem Bildschirm angezeigt werden, verschoben.
  • Bei vielen Themes wird auch eine bestimmte Größe eines Bildes basierend auf der Größe des Bildschirms, auf dem das Bild angezeigt wird, geladen.

Diese Schutzmaßnahmen verhindern jedoch nicht vollständig, dass Bilder oder Videos sich auf die Leistung deines Onlineshops auswirken.

Wenn du der Meinung bist, dass Bilder deinen Shop verlangsamen, führe die folgenden Schritte aus:

  • Lies den Leitfaden zur Bildoptimierung.
  • Beschränke Slideshows von Feature-Bildern auf 2 bis 3 Folien oder verwende nur ein Feature-Bild.
  • Wende dich an deinen Theme-Entwickler, um zu erfahren, wie du Bilder am besten mit dem entsprechenden Theme verwenden kannst.
  • Engagiere einen Shopify-Partner für weitere Unterstützung. Erhalte mehr Informationen über das Engagieren von Shopify-Partnern.

Schriftarten

Du kannst aus verschiedenen Schriftarten für den Text in deinem Onlineshop auswählen. Wenn du jedoch eine Schriftart verwendest, die noch nicht auf dem Computer deines Kunden vorhanden ist, muss die Schriftart heruntergeladen werden, bevor dein Text angezeigt werden kann. Dies hat Auswirkungen auf den Ladevorgang deines Shops.

Du kannst eine Systemschriftart verwenden, um zu vermeiden, dass eine neue Schriftart auf den Computer deines Kunden heruntergeladen wird. Eine Systemschriftart ist eine Schriftart, die auf den meisten Computern bereits installiert ist.

Du kannst eine Mono-, Serif- oder Sans-Serif-Schriftfamilie auswählen. Wenn du eine dieser Schriftfamilien verwendest, kannst du weiterhin Schriftstile wie Fett- oder Kursivdruck verwenden.

Die Schriftart, die auf dem Computer deines Kunden angezeigt wird, hängt von dessen Betriebssystem ab. Im Folgenden findest du einige Beispiele für Schriftarten, die zum Rendern von Text verwendet werden können, wenn du eine Systemschriftfamilie auswählst:

  • Mono: Menlo, Consolas, Monaco, Liberation Mono oder Lucida Console
  • Sans-Serif: BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu oder Neue Helvetica
  • Serif: Iowas Old Style, Apple Garamond, Baskerville, Times New Roman, Droid Serif, Times oder Source Serif Pro

Tools zur Fehlerbehebung

Du kannst die folgenden Tools verwenden, um die Geschwindigkeit deines Onlineshops zu ermitteln.

Wenn du Entwickler bist, kannst du die Leistung deines Themes mithilfe der Tools und Best Practices von Shopify weiter optimieren. Mehr Informationen unter Shopify.dev.

Lighthouse

Der Bericht zur Onlineshop-Geschwindigkeit von Shopify verwendet Lighthouse, um die Geschwindigkeit deines Shops zu messen. Du kannst deinen eigenen Lighthouse-Bericht mit Google PageSpeed Insights ausführen, um detailliertere Kennzahlen für Seiten in deinem Shop anzuzeigen. Weitere Informationen zu diesen Kennzahlen findest du in der Dokumentation zu Google Lighthouse-Leistungskennzahlen. Du kannst auch einen Shopify-Partner engagieren, der dir dabei hilft, die Kennzahlen nachzuvollziehen, und dir Verbesserungen vorschlägt. Erhalte mehr Informationen über das Engagieren von Shopify-Partnern.

Shopify Theme Inspector für Chrome

Der Shopify Theme Inspector für Chrome ist ein Profiling-Tool, das ein Flame Graph verwendet, um die Rendering-Leistung für Liquid anzuzeigen. Mit diesem Tool kannst du die Code-Zeilen identifizieren, die Seiten in deinem Onlineshop verlangsamen. Erfahre, wie du den Shopify Theme Inspector verwendest.

Unterstützung bei der Onlineshop-Geschwindigkeit erhalten

Wenn du ein kostenloses Theme von Shopify verwendest, kann der Shopify Support dir möglicherweise bei grundlegenden Leistungsverbesserungen behilflich sein.

Wenn du ein Theme eines Drittanbieters verwendest und Hilfe benötigst, wende dich an deinen Theme-Entwickler oder engagiere einen Shopify-Partner. Erhalte mehr Informationen über das Engagieren von Shopify-Partnern.

Wenn du ein Entwicklungsteam oder einen Agenturpartner hast, kannst du auch diese kontaktieren, um weitere Unterstützung zu erhalten.

Bereit, mit Shopify zu verkaufen?

Kostenlos testen