Core Web Vitals im Shopware-Shop messen und verbessern
LCP, INP und CLS im Shopware-Shop messen: Werkzeuge, Zielwerte, Server- und Frontend-Maßnahmen mit konkreten Konfigurationsbeispielen.
Ein schneller Shop verkauft besser, und Google bewertet die Ladeerfahrung über die Core Web Vitals. Wer sie nicht kennt, optimiert im Blindflug. Dieser Artikel zeigt, wie Sie die Werte in Ihrem Shopware-Shop belastbar messen, die Ursachen im Server und im Frontend finden und in sinnvoller Reihenfolge beheben.

Die drei Kennzahlen
| Kennzahl | Frage | Guter Wert |
|---|---|---|
| LCP (Largest Contentful Paint) | Wann ist der größte sichtbare Inhalt da? | unter 2,5 s |
| INP (Interaction to Next Paint) | Wie schnell reagiert die Seite auf Eingaben? | unter 200 ms |
| CLS (Cumulative Layout Shift) | Springt das Layout beim Laden? | unter 0,1 |
Google wertet das 75. Perzentil der echten Nutzerdaten aus. Es reicht also nicht, wenn Ihr eigener Rechner schnell ist.
Labordaten und Felddaten unterscheiden
- Felddaten stammen von echten Besuchern (Chrome User Experience Report, in PageSpeed Insights und der Search Console sichtbar). Sie sind maßgeblich für das Ranking.
- Labordaten entstehen bei einem simulierten Test (Lighthouse). Sie eignen sich, um Ursachen zu finden und Änderungen zu vergleichen.
Für reproduzierbare Tests nutzen Sie Lighthouse auf der Kommandozeile mit mobiler Simulation:
npx lighthouse https://www.example-shop.de/ \
--form-factor=mobile \
--only-categories=performance \
--output=json --output-path=./lh-home.json
Messen Sie nicht nur die Startseite, sondern je einen Vertreter von Kategorie, Produktseite, Warenkorb und Checkout. Jeder Seitentyp hat eigene Bremsen.
Server: Time to First Byte senken
Ein langsamer Server verschlechtert jede nachfolgende Metrik. Prüfen Sie zuerst:
- Produktionsmodus:
APP_ENV=prod,APP_DEBUG=0. - HTTP-Cache: In Shopware aktiv und mit einem Reverse Proxy (Varnish oder der integrierte Symfony-Cache) kombiniert. Seiten für anonyme Besucher sollten aus dem Cache kommen.
- OPcache: Ausreichend Speicher und in Produktion ohne ständige Timestamp-Prüfung.
opcache.enable=1
opcache.memory_consumption=256
opcache.max_accelerated_files=20000
opcache.validate_timestamps=0
- Cache-Backend: Redis für Cache-Pools und Sessions statt Dateisystem.
- Datenbank: Slow-Query-Log aktivieren und die teuersten Abfragen identifizieren.
slow_query_log = 1
long_query_time = 0.5
Mit validate_timestamps=0 müssen Sie nach jedem Deployment OPcache leeren oder PHP-FPM neu laden, sonst läuft alter Code weiter.
Frontend: LCP verbessern
Der LCP-Inhalt ist auf Shopware-Seiten meist das Hero-Bild oder das erste Produktbild. Maßnahmen:
- LCP-Bild nicht lazy laden und mit hoher Priorität auszeichnen:
<img src="hero.webp" width="1200" height="600" alt="..." fetchpriority="high">
- Moderne Formate (WebP, AVIF) und passende Größen über
srcset. - Webfonts lokal ausliefern,
font-display: swap, Schriftschnitte reduzieren. - Render-blockierende Skripte und CSS aus Plugins prüfen. Jedes Plugin bringt oft eigenes JavaScript mit.
INP verbessern
Schlechte INP-Werte entstehen durch lange JavaScript-Aufgaben im Hauptthread. Typisch in Shops: Tracking-Skripte, Chat-Widgets, Consent-Tools und schwere Plugin-Skripte. Gehen Sie so vor:
- Im Chrome-DevTools-Performance-Panel eine Interaktion aufzeichnen (zum Beispiel “In den Warenkorb”).
- Lange Aufgaben (über 50 ms) und ihren Verursacher identifizieren.
- Skripte verzögert laden oder entfernen, wenn der Nutzen fehlt.
CLS verbessern
- Breite und Höhe an allen Bildern und Einbettungen angeben.
- Platz für Banner, Cookie-Hinweise und nachgeladene Inhalte reservieren.
- Keine Inhalte oberhalb bereits sichtbarer Elemente einfügen.
Die richtige Reihenfolge
- Felddaten in der Search Console ansehen: welche Seitentypen sind betroffen?
- Mit Lighthouse eine Basismessung festhalten.
- Server und Caching zuerst, denn das wirkt auf alle Seiten.
- Dann Bilder und Fonts, danach JavaScript.
- Nach jeder Maßnahme erneut messen und dokumentieren.
Langsame Seiten sind außerdem einer der Gründe, warum mobile Kunden im Checkout abbrechen. Bei der Shopware Performance-Optimierung liefere ich eine nach Aufwand und Nutzen priorisierte Maßnahmenliste, auf Wunsch mit Umsetzung. Sprechen wir über Ihren Shop.