Shopify Speed-Audit: So führen Sie es Schritt für Schritt durch

Beheben Sie die häufigsten Probleme sofort

Die meisten Shopify Speed-Audits decken dieselben Probleme auf: renderblockierende Skripte, unoptimierte Schriften und schlechte Ressourcen-Priorisierung. Thunder Page Speed Optimizer behebt sie automatisch:

• Verzögert nicht-kritisches JavaScript, das das Rendern der Seite blockiert
• Inlined kritisches CSS für die sofortige Darstellung des sichtbaren Bereichs
• Optimiert das Laden von Schriften, um unsichtbaren Text zu verhindern
• Steuert die Ladereihenfolge der Ressourcen für optimale Core Web Vitals

Installieren Sie zuerst Thunder und führen Sie dann Ihr Audit durch, um die verbleibenden Probleme zu identifizieren. Starten Sie mit einem kostenlosen Speed-Test, um Ihre aktuelle Baseline zu sehen.

Was Sie vor dem Start brauchen

Ein komplettes Shopify Speed-Audit nutzt diese kostenlosen Tools:

Außerdem brauchen Sie: Ihre Store-URL, Zugriff auf den Shopify-Admin und ~60-90 Minuten. Weitere Tool-Optionen finden Sie in unserem kompletten Leitfaden zu Shopify-Speed-Test-Tools.

Schritt 1: Ihre Baseline-Scores festhalten

Bevor Sie etwas beheben, dokumentieren Sie, wo Sie stehen. Führen Sie PageSpeed Insights auf diesen vier Seiten aus (testen Sie mobil und Desktop):

1. Startseite – Ihre trafficstärkste Seite und der erste Eindruck
2. Eine Top-Kategorieseite – testet, wie Ihr Store mit Produkt-Grids umgeht
3. Ihre meistverkaufte Produktseite – hier entstehen die Conversions
4. Ein Blogbeitrag oder eine Inhaltsseite – meist am leichtesten, nützlich als Vergleich

Halten Sie diese Zahlen in einer Tabelle fest:

Schritt 2: Reale Core Web Vitals prüfen

Labor-Scores (PageSpeed Insights) testen unter kontrollierten Bedingungen. Reale Nutzerdaten zeigen, wie echte Kunden Ihren Store erleben. Öffnen Sie die Google Search Console → Core Web Vitals.

Sie sehen die Seiten nach Status gruppiert:

• Gut – alle drei Metriken bestanden (LCP < 2.5s, CLS < 0.1, INP < 200ms)
• Optimierung erforderlich – eine oder mehrere Metriken im Warnbereich
• Schlecht – eine oder mehrere Metriken nicht bestanden

Diese Daten sind besonders wertvoll, weil sie reale Bedingungen widerspiegeln – echte Gerätegeschwindigkeiten, echte Netzwerkverbindungen, echtes Kundenverhalten. Wenn Ihre Labor-Scores ordentlich aussehen, aber die realen CWV-Daten "schlecht" zeigen, haben Ihre Kunden auf langsameren Mobilgeräten ein schlechtes Erlebnis.

Notieren Sie, welche Metrik am häufigsten durchfällt:

• LCP fällt durch? → Konzentrieren Sie sich auf Hero-Bilder, Schriften und renderblockierende Ressourcen
• CLS fällt durch? → Konzentrieren Sie sich auf Bildabmessungen, dynamisch eingefügte Inhalte und Layout-Shift-Fixes
• INP fällt durch? → Konzentrieren Sie sich auf JavaScript-Optimierung und Interaktions-Reaktionsfähigkeit

Ein umfassendes Verständnis dieser Metriken vermittelt unser Shopify Core Web Vitals-Leitfaden.

Schritt 3: App-Auswirkungen auf die Geschwindigkeit auditieren

Apps sind die Ursache Nr. 1 für langsame Shopify-Stores. Allein dieser Schritt deckt oft 50-70 % Ihrer Geschwindigkeitsprobleme auf.

Schnelle Methode: der Netzwerk-Tab in Chrome DevTools

1. Öffnen Sie Ihren Store in Chrome → Drücken Sie F12 → Klicken Sie auf den Tab "Network"
2. Aktivieren Sie "Disable cache" und laden Sie die Seite neu
3. Filtern Sie nach "JS" (JavaScript) – sortieren Sie nach Größe (größte zuerst)
4. Suchen Sie nach Skript-URLs mit App-Namen, cdn.shopify.com/extensions oder Drittanbieter-Domains
5. Notieren Sie die Gesamtzahl der Requests und die gesamte Übertragungsgröße

Gesunde Zielwerte:

Gründliche Methode: Test mit deaktivierten Apps

Der aufschlussreichste Test: Deaktivieren Sie vorübergehend alle Apps und messen Sie den Geschwindigkeitsunterschied. Springt Ihr Store von 30 auf 75, sind Apps Ihr Hauptproblem.

1. Gehen Sie zum Shopify-Admin → Einstellungen → Apps und Vertriebskanäle
2. Notieren Sie Ihren aktuellen PageSpeed-Score
3. Deaktivieren Sie die Apps einzeln und testen Sie nach jeder
4. Halten Sie fest, welche Apps die größten Score-Einbrüche verursachen
5. Aktivieren Sie die Apps danach wieder

Für eine tiefere Analyse nutzen Sie unseren Shopify-Store-Analyzer, um genau zu sehen, welche Skripte jede App lädt.

Schritt 4: Renderblockierende Ressourcen identifizieren

Renderblockierende Ressourcen sind CSS- und JavaScript-Dateien, die den Browser daran hindern, Ihre Seite anzuzeigen, bis sie vollständig heruntergeladen und verarbeitet sind. Sie sind der Hauptgrund für hohe LCP-Zeiten.

Prüfen Sie PageSpeed Insights – schauen Sie unter "Empfehlungen" nach:

• "Ressourcen beseitigen, die das Rendering blockieren" – listet jede CSS- und JS-Datei auf, die das Rendern Ihrer Seite blockiert. Aufklappen, um die möglichen Einsparungen zu sehen.
• "Nicht verwendetes CSS reduzieren" – CSS, das heruntergeladen, aber auf dieser Seite nicht genutzt wird. Häufig bei großen Theme-Stylesheets.
• "Nicht verwendetes JavaScript reduzieren" – JS-Code, der heruntergeladen, aber nicht ausgeführt wird. Oft von Apps, die ihr volles Bundle auf Seiten laden, wo sie gar nicht gebraucht werden.

Typische renderblockierende Übeltäter auf Shopify

Thunder beseitigt renderblockierende Ressourcen automatisch, indem es nicht-kritische Skripte verzögert und kritisches CSS inlined. Das ist für die meisten Shopify-Stores die Einzeloptimierung mit dem größten Effekt.

Schritt 5: Bildoptimierung überprüfen

Bilder sind typischerweise die schwersten Assets auf jeder Shopify-Seite. Prüfen Sie auf diese Probleme:

Bildgröße und -format

In Chrome DevTools → Network → nach "Img" filtern – prüfen Sie die gesamte Bildgröße und die Größen einzelner Dateien.

• Hero-/Banner-Bilder über 200KB: Komprimieren oder verkleinern. Zielwert für Hero-Bilder: 80-150KB.
• Produktbilder über 100KB: Shopify komprimiert automatisch, aber die Original-Uploads zählen. Laden Sie Bilder mit maximal 2048x2048 hoch.
• Bilder nicht im WebP-/AVIF-Format: Shopifys CDN liefert automatisch WebP aus, wenn der Browser es unterstützt – überprüfen Sie das in der Spalte "Type" im Netzwerk-Tab.
• Bilder mit falschen Abmessungen: Ein 3000x3000-Bild, das mit 300x300 angezeigt wird, verschwendet Bandbreite. Nutzen Sie Shopifys image_url-Filter mit Breitenparametern.

Lazy Loading

Bilder unterhalb des sichtbaren Bereichs sollten Lazy Loading nutzen, damit sie erst geladen werden, wenn der Nutzer in ihre Nähe scrollt. Prüfen Sie auf:

• Hero-Bild mit loading="lazy": Das ist falsch – Ihr Hero sollte sofort laden, da er das LCP-Element ist
• Produkt-Grid-Bilder ohne Lazy Loading: Produkte unterhalb des sichtbaren Bereichs sollten lazy geladen werden
• Dekorative Bilder, die sofort laden: Trust-Badges, Social-Icons und Footer-Bilder sollten alle lazy sein

Ein vollständiges Vorgehen für die Bildoptimierung liefern unser Shopify-Bildoptimierungsleitfaden und die Anleitung zur Lazy-Loading-Einrichtung.

Schritt 6: Qualität des Theme-Codes analysieren

Ihr Shopify-Theme ist das Fundament, auf dem alles andere lädt. Ein aufgeblähtes oder schlecht programmiertes Theme macht jede weitere Optimierung weniger wirksam.

Schneller Theme-Gesundheitscheck

1. Prüfen Sie die eingebaute Geschwindigkeit Ihres Themes: Nutzen Sie in Shopify Onlineshop → Themes → klicken Sie auf Ihren Theme-Namen → Abschnitt "Geschwindigkeit". Shopify liefert eine Basis-Geschwindigkeitsbewertung.
2. Zählen Sie die Theme-Sections auf der Startseite: Jede Section fügt HTML, CSS und manchmal JavaScript hinzu. Mehr als 15-20 Sections auf einer Seite sind ein Performance-Risiko. Prüfen Sie, ob Sie Sections nutzen, die Sie entfernen könnten.
3. Prüfen Sie auf Inline-JavaScript: Durchsuchen Sie Ihren Theme-Code nach <script>-Tags in Section-Dateien. Inline-Skripte in Sections laden auf jeder Seite, die diese Sections einbindet.
4. Achten Sie auf exzessive Liquid-Schleifen: Komplexe Liquid-Logik (verschachtelte for-Schleifen, schwere Metafeld-Abfragen) verlangsamt das serverseitige Rendern und erhöht die TTFB (Time to First Byte).

Warnsignale beim Theme

Ist Ihr Theme der Flaschenhals, erwägen Sie den Wechsel zu einem schnelleren Shopify-Theme. Dawn (Shopifys Standard) gehört zu den schnellsten verfügbaren. Alternativen finden Sie in unserem Ranking der schnellsten kostenlosen Themes.

Schritt 7: Drittanbieter-Skripte inspizieren

Über Apps hinaus lädt Ihr Store wahrscheinlich Skripte externer Dienste – Analytics, Marketing-Pixel, Chat-Widgets, Bewertungsplattformen und mehr. Diese Drittanbieter-Skripte haben oft den größten Einfluss auf die Geschwindigkeit, weil sie von langsamen externen Servern laden.

Drittanbieter-Skripte finden

1. Schauen Sie in Chrome DevTools → Netzwerk-Tab auf die Spalte "Domain"
2. Jede Domain, die nicht cdn.shopify.com oder die Domain Ihres Stores ist, ist ein Drittanbieter
3. Notieren Sie jede einzelne Domain und die insgesamt von ihr geladene Datenmenge

Typische Drittanbieter-Skript-Sünder

Fixes priorisieren: der Speed-Audit-Aktionsplan

Nach Abschluss aller 7 Schritte haben Sie eine Liste von Problemen. So priorisieren Sie sie für maximale Wirkung:

Priorität 1: schnelle Erfolge (diese Woche)

• Installieren Sie Thunder Page Speed Optimizer für automatisierte Skript-Verzögerung und kritisches CSS
• Entfernen Sie ungenutzte Apps (jede App, die nicht aktiv zum Umsatz beiträgt)
• Komprimieren Sie zu große Bilder (alles über 200KB)
• Fügen Sie font-display: swap zu den Font-Deklarationen hinzu

Priorität 2: mittlerer Aufwand (diesen Monat)

• Google Fonts selbst hosten
• Lazy Loading für Bilder unterhalb des sichtbaren Bereichs implementieren
• Sich überschneidende Apps konsolidieren (3 Pop-up-Tools → 1)
• Nicht-essenzielle Drittanbieter-Skripte verzögern (Chat, Bewertungen auf Nicht-Produktseiten)

Priorität 3: höherer Aufwand (dieses Quartal)

• Theme-Migration, falls das aktuelle Theme grundsätzlich langsam ist
• Umstellung der Marketing-Pixel auf serverseitiges Tracking
• Code-Reste deinstallierter Apps aufräumen
• Laufendes Performance-Monitoring aufsetzen

Nach dem Audit: die Geschwindigkeit erhalten

Ein Speed-Audit ist nur wertvoll, wenn Sie danach handeln und Regressionen verhindern. Etablieren Sie diese laufenden Routinen:

• Monatlicher Schnellcheck: Führen Sie PageSpeed Insights auf Ihrer Startseite und Top-Produktseite aus. Vergleichen Sie mit Ihrer Baseline. Dauert 5 Minuten.
• Vor jeder neuen App-Installation: Machen Sie vor und nach der Installation einen Speed-Test. Senkt die App Ihren Score um 10+ Punkte, suchen Sie nach Alternativen.
• Nach Theme-Updates: Theme-Updates können neue Skripte einführen oder das Ressourcen-Laden verändern. Testen Sie die Geschwindigkeit immer nach dem Update.
• Quartalsweises Voll-Audit: Wiederholen Sie diesen kompletten 7-Schritte-Prozess alle 3 Monate. Stores sammeln mit der Zeit Speed-Schulden an, wenn sich Apps, Sections und Anpassungen stapeln.

Für laufendes Monitoring zwischen den Audits richten Sie automatisiertes Performance-Monitoring über Google-Search-Console-Alerts und synthetische Tests ein. Unser kompletter Speed-Optimierungsleitfaden behandelt Strategien für die langfristige Pflege.

Häufig gestellte Fragen

Ihr Speed-Audit ist die Startlinie

Ein Shopify Speed-Audit ist kein einmaliges Ereignis – es ist das Fundament eines fortlaufenden Performance-Managements. Die 7 Schritte in diesem Leitfaden geben Ihnen ein vollständiges Bild davon, was Ihren Store verlangsamt: von App-Ballast und renderblockierenden Skripten bis zu Bildoptimierung und Theme-Code-Qualität.

Der schnellste Weg zu Ergebnissen: Installieren Sie Thunder Page Speed Optimizer für die automatisierten Optimierungen und nutzen Sie dann Ihre Audit-Erkenntnisse für gezielte manuelle Verbesserungen. Die meisten Stores erzielen ihre größten Gewinne aus der Kombination von automatisiertem Skript-Management und manuellem App-Aufräumen.

Fangen Sie jetzt an. Führen Sie Ihren kostenlosen Speed-Test durch und folgen Sie diesem Leitfaden Schritt für Schritt. Ihre Kunden – und Google – werden den Unterschied bemerken.