Der Mythos „Apps entfernen“.
Suchen Sie nach „So verbessern Sie den Shopify-Geschwindigkeits-Score“ und Sie werden überall den gleichen Rat finden: Apps entfernen. Es ist die faule Antwort auf ein differenziertes Problem – und kostet Händler echtes Geld.
Deshalb ist es ein schlechter Rat: Apps generieren Umsatz. Ihre Bewertungs-App fördert Social Proof und Conversions. Ihre Upsell-App erhöht den AOV. Ihre E-Mail-Erfassungs-App erstellt Ihre Liste. Ihre Analyse-App sagt Ihnen, was funktioniert. Sie zu entfernen, um einer Eitelkeitsmetrik nachzujagen, ist so, als würde man die Registrierkasse ausstecken, um Strom zu sparen.
Die Händler, die mit echten, funktionierenden Geschäften tatsächlich eine Punktzahl von über 90 erreichen, tun dies nicht, indem sie Apps entfernen. Sie tun dies durch Optimierung wie diese Apps werden geladen. Das ist ein grundlegend anderer Ansatz – und den werden wir hier behandeln.
Wir haben mit Stores zusammengearbeitet, die 15–25 Apps betreiben, die auf dem Desktop 85–95 und auf Mobilgeräten 70–85 Punkte erzielen. Das Muster ist immer das gleiche: Die Apps selbst sind nicht das Problem. Die Art und Weise, wie ihre Skripte geladen werden, ist.
Wichtiger Vorbehalt: „Apps nicht entfernen“ bedeutet nicht „alles behalten“. Wenn Sie drei verschiedene Bewertungs-Apps oder ein Popup-Tool haben, das Sie einmal installiert und nie konfiguriert haben, sollten diese verschwinden. Der Punkt ist: Verzichten Sie nicht auf Funktionen, die den Umsatz steigern, nur weil ein Geschwindigkeitstest es Ihnen gesagt hat. Für ein umfassendes Verständnis der Funktionsweise von Scores lesen Sie unsere Leitfaden für einen guten Shopify-Geschwindigkeitswert.
Was Ihren Shopify-Geschwindigkeitswert tatsächlich verlangsamt
Dein Shopify-Geschwindigkeitsbewertung wird mithilfe von Google Lighthouse berechnet, das sechs Metriken misst. Wenn Sie wissen, welche Apps tatsächlich Auswirkungen haben, wissen Sie genau, worauf Sie sich konzentrieren müssen:
| Metrisch | Gewicht | App-Auswirkungen | Fix |
|---|---|---|---|
| Gesamtblockierungszeit (TBT) | 30% | Sehr hoch | App-Skripte zurückstellen |
| Größter Contentful Paint (LCP) | 25% | Hoch | Kritisches Inline-CSS, Heldenbild optimieren |
| Geschwindigkeitsindex | 10% | Hoch | Defer-Skripte + Inline-CSS |
| Kumulative Layoutverschiebung (CLS) | 25% | Mittel | Platz für dynamische Elemente reservieren |
| Erste Contentful Paint (FCP) | 10% | Mittel | Entfernen Sie renderblockierende Ressourcen |
Bemerken Sie das Muster? 55 % Ihrer Punktzahl (TBT + LCP) wird direkt davon gesteuert, wie JavaScript und CSS geladen werden. Apps sind in den meisten Shopify-Shops die größte JavaScript-Quelle. Sie müssen die Apps jedoch nicht entfernen – Sie müssen nur Änderungen vornehmen wann und wie ihr Code wird geladen.
Wenn ein Browser auf a <script> Tag ohne aufschieben oder asynchron, es stoppt alles – stoppt das Parsen von HTML, stoppt das Rendern von Pixeln – bis das Skript heruntergeladen und ausgeführt wird. Ein einzelnes 200-KB-Überprüfungs-App-Skript, das synchron geladen wird theme.liquid kann bei einer gedrosselten Mobilfunkverbindung 800 ms zu Ihrer TBT hinzufügen.
Die Lösung besteht nicht darin, die Bewertungs-App zu entfernen. Dadurch wird das Skript geladen danach Die Seite wird gerendert. Genau das bewirkt die Skriptverzögerung – und sie ist der größte Hebel zur Verbesserung Ihres Shopify-Geschwindigkeitsscores. Weitere Informationen hierzu finden Sie in unserem Leitfaden zu Behebung von Rendering-blockierenden Ressourcen auf Shopify.
Die Ein-Klick-Lösung: Thunder Page Speed Optimizer
Bevor wir uns mit den manuellen Strategien befassen, hier der schnellste Weg zu 90+: let Thunder erledigt das automatisch. Jede Strategie, die wir unten behandeln – Skriptverzögerung, kritisches CSS, Bildoptimierung, Laden von Schriftarten – erledigt Thunder in einer Installation.
Was Thunder automatisch macht:
Verschiebt alle Render-blockierenden Skripte
Jedes App-Skript wird nach dem Lackieren geladen – keine manuelle Codebearbeitung erforderlich
Inlines kritisches CSS
Extrahiert „above-the-fold“-Stile und integriert sie für sofortiges Rendern
Optimiert das Laden von Bildern
Lädt Offscreen-Bilder verzögert und priorisiert Heldenbilder für schnelleres LCP
Behebt das Laden von Schriftarten
Lädt kritische Schriftarten vor und fügt automatisch „font-display: swap“ hinzu
Durchschnittliche Verbesserung: +27 Punkte (mit allen installierten Apps)
Das sind 27 Punkte ohne eine einzige App zu entfernen. Most stores go from 40-60 to 70-90 on mobile, and from 60-80 to 90+ on desktop. Testen Sie die aktuelle Punktzahl Ihres Shops , um Ihren Ausgangspunkt zu sehen.
Kostenloser Plan verfügbar · Keine Kreditkarte erforderlich · 30-Sekunden-Installation · Funktioniert mit allen Apps und Themes
Strategie 1: Renderblockierende Skripte zurückstellen
Dies ist die Optimierung mit der höchsten Wirkung, die Sie durchführen können. Renderblockierende Skripte sind für 30–50 % der Geschwindigkeitsverluste der meisten Shopify-Shops verantwortlich. Hier erfahren Sie, warum sie so schädlich sind und wie Sie sie beheben können.
Das Problem
Wenn eine App auf Shopify installiert wird, fügt sie normalerweise eine hinzu <script src="..."> -Tag zu Ihrem theme.liquid -Datei. Ohne explizit aufschieben oder asynchron -Attribute, Browser behandeln dies als „Alles stoppen und zuerst dies laden.“ Multiplizieren Sie das mit 10–15 Apps, und Sie haben einen Stau an Skripten, die alle versuchen zu laden, bevor Ihre Seite überhaupt das erste Pixel anzeigen kann.
Die manuelle Korrektur
Vorher (Rendering-Blockierung):
<script src="https://app-cdn.example.com/widget.js"></script> Nach (aufgeschoben):
<script src="https://app-cdn.example.com/widget.js" defer></script>
Öffnen Sie Ihren Theme-Code-Editor und navigieren Sie zu theme.liquidund hinzufügen aufschieben zu jedem Skript-Tag eines Drittanbieters. Für Inline-Skripte (die nicht verwendet werden können aufschieben), wickeln Sie sie in ein DOMContentLoaded -Ereignis-Listener oder Verwendung setTimeout , um die Ausführung um 2-3 Sekunden zu verzögern.
⚠️ Warnung: Hinzufügen aufschieben auf das falsche Skript kann die Funktionalität beeinträchtigen. Zahlungsskripte, Shopifys eigene Analysen und einige App-Widgets erwarten ein synchrones Laden. Testen Sie ein dupliziertes Theme gründlich, bevor Sie es live schalten. Dies ist einer der Gründe, warum sich viele Händler dafür entscheiden Thunder – es weiß, welche Skripte sicher zurückgestellt werden können und behandelt die Randfälle automatisch.
Erwartete Auswirkungen: 15-30 point improvement on mobile, 10-20 on desktop. This single change often gets stores from 50s to 70s-80s.
Strategie 2: Kritisches Inline-CSS
CSS-Dateien blockieren standardmäßig auch das Rendern. Ihr Browser malt kein einziges Pixel, bis das gesamte CSS darin enthalten ist <head> wurde heruntergeladen und analysiert. Bei den meisten Shopify-Themes sind das 200–500 KB CSS – die meisten davon gestalten Elemente unterhalb der Falte oder vollständig auf anderen Seiten.
Die manuelle Korrektur
- Kritisches CSS extrahieren: Verwenden Sie ein Werkzeug wie Kritisch , um zu ermitteln, welche CSS-Regeln für „above-the-fold“-Inhalte auf Ihrer Homepage erforderlich sind.
- Inline es: Platzieren Sie diese Regeln in einem
<style>-Tag in Ihrem<head>. - Den Rest aufschieben: Laden Sie Ihre vollständige CSS-Datei asynchron mit
<link rel="preload" href="style.css" as="style">mit einem Fallback. - Wiederholen Sie dies für jede Vorlage: Produktseiten, Sammlungsseiten und Ihre Homepage haben jeweils unterschiedliche „Above-the-Fold“-Inhalte. Jeder benötigt sein eigenes kritisches CSS.
Das ist technisch aufwendig und wartungsintensiv. Jedes Theme-Update kann Ihre CSS-Struktur ändern und eine erneute Extraktion erforderlich machen. Es ist eine der zeitaufwändigsten manuellen Optimierungen – und eines der Dinge, die Thunder vollständig automatisiert. Schauen Sie sich unsere an Funktionsseite , um zu sehen, wie es funktioniert.
Erwartete Auswirkungen: 5–15 Punkte Verbesserung, hauptsächlich bei FCP und LCP.
Strategie 3: Bilder richtig optimieren
Bilder sind in den meisten Shopify-Shops das größte Asset. Ein einzelnes, nicht optimiertes Hero-Banner kann mehr wiegen als alle Ihre App-Skripte zusammen. Die gute Nachricht: Bildoptimierung ist unkompliziert und wirkungsvoll.
Schnelle Siege
Heldenbild unter 200 KB: Ihr LCP-Element ist normalerweise das Hero-Banner oder das erste Produktbild. Komprimieren Sie es mit 80 % Qualität in das WebP-Format. Verwenden Sie Shopify Bild-URL Filter mit spezifischer Breite: {{ image | image_url: width: 1200 }}
Explizite Abmessungen: Immer einbeziehen Breite und Höhe Attribute ein
Laden Sie den Helden vor: Hinzufügen <link rel="preload" as="image" href="hero.webp"> in Ihrem <head> , um den Browser anzuweisen, mit dem Herunterladen Ihres LCP-Bildes zu beginnen, bevor er es im HTML erkennt.
Alles andere per Lazy-Load laden: Jedes Bild unterhalb des Falzes sollte haben wird geladen="faul". Lesen Sie unseren Leitfaden weiter Lazy Loading auf Shopify für die vollständige Einrichtung.
Erwartete Auswirkungen: 5-20 Punkte je nach aktueller Bildsituation. Shops mit unkomprimierten 2-MB-Hero-Bildern werden dramatische Verbesserungen erleben.
Strategie 4: Das Laden von Schriftarten korrigieren
Schriftarten sind heimtückische Geschwindigkeitskiller. Jede Schriftstärke ist eine separate Datei (jeweils 40–100 KB). Ein typischer Shopify-Shop lädt 4–8 Schriftartendateien, was 200–600 KB zum anfänglichen Laden der Seite hinzufügt. Ohne Schriftartenanzeige: tauschen: Browser zeigen unsichtbaren Text an, bis die Schriftarten vollständig geladen sind – was Ihren FCP-Score ruiniert.
Die manuelle Korrektur
Schriftstärken begrenzen: Verwenden Sie höchstens 2 Schriftfamilien mit jeweils 2 Strichstärken (normal + fett). Das sind maximal 4 Dateien.
Schriftart-Anzeige hinzufügen: swap: Stellen Sie sicher, dass alle @font-face-Deklarationen enthalten Schriftartenanzeige: tauschen , sodass Text sofort in einer Ersatzschriftart gerendert wird, während benutzerdefinierte Schriftarten geladen werden.
Kritische Schriftarten vorab laden: Hinzufügen <link rel="preload" as="font" type="font/woff2" href="..." crossorigin> für die 1–2 Schriftarten, die in Ihrem „above thefold“-Inhalt verwendet werden.
Selbsthosting über Google Fonts: Downloading fonts and serving from Shopify's CDN eliminates a DNS lookup + connection to Google's servers.
Erwartete Auswirkungen: 3-10 Punkte, hauptsächlich auf FCP und LCP.
Strategie 5: Lazy-Load alles unterhalb der Falte
Über Bilder hinaus können Sie ganze Abschnitte Ihrer Seite verzögert laden. App-Widgets, die in der Fußzeile angezeigt werden, Bewertungsabschnitte unter Produktbeschreibungen und Instagram-Feeds unten – nichts davon muss geladen werden, bevor der Kunde die Seite sieht.
Fortgeschrittene Lazy-Loading-Techniken
Kreuzungsbeobachter: Verwenden Sie die Intersection Observer API, um zu erkennen, wann ein Abschnitt in die Ansicht gescrollt wird, und laden Sie dann die zugehörigen Skripte. Dies funktioniert für Bewertungs-Widgets, Chat-Widgets und Social-Proof-Popups.
Benutzerinteraktion löst Folgendes aus: Einige Skripte müssen nur geladen werden, wenn der Benutzer interagiert. Ein Chat-Widget kann bei der ersten Mausbewegung geladen werden. Ein Upsell-Popup kann geladen werden, wenn der Benutzer etwas in den Warenkorb legt. Dieses „Last bei Interaktion“-Muster hält die anfängliche Seitenstärke minimal.
Skelettbildschirme: Zeigt leichte Platzhalterinhalte an, während schwere Abschnitte geladen werden. Dies verbessert die wahrgenommene Leistung und hält den CLS niedrig, da sich das Layout nicht ändert, wenn echte Inhalte eintreffen.
Erwartete Auswirkungen: 5-15 Punkte auf Mobilgeräten. Variiert je nachdem, wie viele Below-Fold-Skripts Sie zurückstellen können.
Strategie 6: App-Qualität prüfen, nicht Quantität
Anstatt zu zählen, wie viele Apps Sie haben, prüfen Sie, wie jede App geladen wird. Einige Apps sind wunderbar optimiert – winzige Skripte, verzögertes Laden, minimales CSS. Andere geben 500 KB nicht minimiertes JavaScript synchron in Ihr Theme ein. Den Unterschied zu kennen ist der Schlüssel.
So prüfen Sie die Geschwindigkeitsauswirkungen jeder App
- Öffnen Sie Chrome DevTools → Registerkarte „Netzwerk“. in Ihrem Shop
- Deaktivieren Sie jede App einzeln (vorübergehend deinstallieren oder den Deaktivierungsschalter der App verwenden, falls verfügbar)
- Führen Sie PageSpeed Insights erneut aus nach jeder Änderung (dreimal ausführen, den Durchschnitt bilden)
- Protokollieren Sie das Score-Delta für jede App – jetzt wissen Sie genau, welche Apps die meisten Punkte kosten
- Für teure Apps, Suchen Sie nach leichteren Alternativen, die das Gleiche mit weniger Codegewicht leisten
Wir haben Fälle gesehen, in denen eine einzelne Bewertungs-App 20 Punkte kostete, während die Bewertungs-App eines Mitbewerbers mit den gleichen Funktionen nur 3 Punkte kostete. Die Funktionalität ist identisch – die Codequalität jedoch nicht. Schauen Sie sich unsere an Leitfaden für Skripte von Drittanbietern für weitere Informationen zur Identifizierung schwerer Skripte.
Sie möchten nicht manuell prüfen? Verwenden Sie die Thunder Shopify Analyzer , um genau zu sehen, welche Skripte in Ihrem Store geladen werden, wie groß sie sind und welche das Rendern blockieren. Sie erhalten in Sekundenschnelle einen umsetzbaren Bericht.
Welchen Shopify-Geschwindigkeitswert sollten Sie tatsächlich anstreben?
Seien wir realistisch. Hier sehen Sie, was gut optimierte Shopify-Shops mit echten Apps tatsächlich punkten:
| Profil speichern | Typischer Desktop | Typisches Mobiltelefon |
|---|---|---|
| Minimaler Store (3–5 Apps, leichtes Design) | 95-100 | 85-95 |
| Standard-Store (10–15 Apps, optimiert) | 90-98 | 70-85 |
| Funktionsreicher Store (15–25 Apps, optimiert) | 85-95 | 60-80 |
| Enterprise Store (25+ Apps, umfangreiche Funktionen) | 75-90 | 50-70 |
Ein mobiler Score von 75-85 mit 15 installierten Apps ist ausgezeichnet. Das bedeutet, dass Ihre Core Web Vitals erfolgreich sind und Ihr Shop für echte Benutzer schnell geladen wird. Streben Sie nicht nach den perfekten 100 – dazu müssen Sie auf Funktionen verzichten, die Ihr Geschäft profitabel machen.
Was wichtiger ist als die Laborbewertung, ist Ihre Core Web Vitals-Felddaten – die tatsächliche Leistung, die tatsächliche Besucher erleben. Überprüfen Sie dies PageSpeed Insights unter „Entdecken Sie, was Ihre echten Benutzer erleben.“ Wenn diese Kennzahlen grün sind, ist Ihr Shop schnell – unabhängig davon, was der Laborwert aussagt.
Weitere Informationen zur Bedeutung dieser Zahlen finden Sie in unserem Deep Dive weiter Shopify-Geschwindigkeitsbewertung vs. Google PageSpeed und die Beziehung zwischen Geschwindigkeit und Konvertierungen.
Häufig gestellte Fragen
Kann ich wirklich einen Shopify-Geschwindigkeitswert von über 90 erreichen, ohne Apps zu entfernen?
Ja – aber es hängt davon ab, welche Apps und wie sie geladen werden. Der Schlüssel liegt nicht darin, Apps zu entfernen, sondern zu optimieren, wie ihre Skripte geladen werden. Durch den Verzicht auf renderblockierendes JavaScript, das Inlining von kritischem CSS und das Lazy-Loading nicht notwendiger Ressourcen können die meisten Geschäfte mit 10–15 installierten Apps 90+ erreichen. Thunder Page Speed Optimizer automatisiert diesen gesamten Prozess.
Wie viele Apps sind zu viele für die Shopify-Geschwindigkeit?
Es gibt keine magische Zahl. Ein Store mit 20 gut codierten Apps kann einen mit 5 schlecht codierten Apps übertreffen. Entscheidend ist, wie jede App ihre Skripte lädt. Apps, die synchrones JavaScript in Ihre theme.liquid einfügen oder große CSS-Dateien über den Fold laden, sind die wahren Geschwindigkeitskiller. Verwenden Sie die Chrome DevTools-Registerkarte „Netzwerk“, um zu ermitteln, welche Apps das meiste Gewicht hinzufügen.
Funktioniert Thunder mit allen Shopify-Apps?
Thunder ist mit allen Shopify-Apps und Themes kompatibel. Es funktioniert auf der Ladeebene des Browsers – es verzögert Skripte, fügt kritisches CSS ein und optimiert die Ladereihenfolge der Ressourcen. Dies bedeutet, dass die Art und Weise, wie die Assets einer App geladen werden, optimiert wird, ohne die Funktionalität der App zu ändern. In seltenen Fällen, in denen eine App ein synchrones Laden erfordert (z. B. Zahlungs-Widgets), erkennt Thunder dies und lässt es in Ruhe.
Welchen Shopify-Geschwindigkeitswert sollte ich anstreben?
Für die meisten Shopify-Shops bedeutet ein Geschwindigkeitswert zwischen 70 und 90 auf Mobilgeräten eine hervorragende Leistung. Desktop-Werte über 90 sind üblich. Die eigentliche Metrik, auf die es ankommt, sind die Felddaten von Core Web Vitals – wenn Ihr LCP unter 2,5 s, INP unter 200 ms und CLS unter 0,1 bei echten Benutzern liegt, schneidet Ihr Shop unabhängig von der Laborbewertungszahl gut ab.
Warum ist mein mobiler Shopify-Geschwindigkeitswert so viel niedriger als der Desktop?
Mobile-Scores simulieren ein Mittelklasse-Telefon mit einer langsamen 4G-Verbindung mit starker CPU-Drosselung. Desktop simuliert einen schnellen Computer über eine Kabelverbindung. Durch diese Drosselung kostet jedes nicht optimierte Skript auf Mobilgeräten das Drei- bis Fünffache mehr. Aus diesem Grund haben Skriptverzögerung und kritisches CSS-Inlining – das Thunder automatisch verarbeitet – einen größeren Einfluss auf mobile Ergebnisse.
Wird die Optimierung meines Geschwindigkeitswerts tatsächlich den Umsatz steigern?
Data consistently shows that faster stores convert better. Google's research found that a 1-second improvement in mobile load time can increase conversions by up to 27%. For Shopify specifically, stores with LCP under 2.5 seconds see 15-20% higher add-to-cart rates on average compared to stores loading in 4+ seconds. Speed isn't everything, but it removes friction from the buying process.
Was ist die beste Shopify 90-Strategie zur Optimierung des mobilen Scores im Jahr 2026?
Die effektivste Strategie, um im Jahr 2026 einen Mobil-Score von über 90 zu erreichen, konzentriert sich auf drei Bereiche: (1) Verschieben Sie alles unkritische JavaScript – dies allein kann auf Mobilgeräten 15–25 Punkte bringen, da Lighthouse eine starke CPU-Drosselung anwendet. (2) Integrieren Sie kritisches CSS und verzögern Sie den Rest – eliminiert renderblockierende Stylesheets. (3) Optimieren Sie LCP, indem Sie fetchpriority='high' für Ihr Heldenbild festlegen und es vorab laden. Thunder Page Speed Optimizer verarbeitet alle drei automatisch, mit einer durchschnittlichen Verbesserung von über 27 Punkten speziell auf Mobilgeräten.