HS Activa: Mobile-Lighthouse von 42 auf 91 in vier Wochen
Shopify-Supplements-Shop mit Theme-Altlasten und Cloudflare-Stack. LCP halbiert, CLS unter 0,05, INP in allen Templates grün.
Ausgangslage
HS Activa ist ein Supplements-Shop mit über 68.000 Kunden im DACH-Raum. Ich arbeite dort operativ mit, auch im Shop-Stack. Das Theme war über die Jahre mit Apps, Snippets und Tracking-Code vollgelaufen. Mobile-Lighthouse lag bei 42, obwohl wir schon ein CDN im Einsatz hatten. Das Kernproblem: LCP bei 4,8 s auf 4G, große unused JS-Bundles, Bilder ohne responsive Sizes.
Vorgehen
- Messen statt raten. CrUX-Field-Data, WebPageTest-Filmstrip pro Template.
- Priorisieren. Drei Hebel haben 70 % des Gewinns gebracht.
- Auf Staging umsetzen, mit A/B-Vergleich pro Template.
- Cloudflare-Layer für Image-Resizing und Cache-Rules statt App-basierter Lösung.
Umgesetzte Fixes
- LCP: Hero-Bild preloaden mit
fetchpriority="high", zweite Schriftart raus, Critical-CSS inline für Above-the-fold. - JS-Diät: Sechs Apps durch native Liquid-Lösungen ersetzt. 340 KB JS weg.
- Image-Pipeline: AVIF über Cloudflare Polish, responsive
srcset, LQIP auf PDP. - INP: Third-Party-Scripts über Partytown ausgelagert, Add-to-Cart-Handler entschlackt.
Ergebnis
- Lighthouse Mobile: 42 → 91
- LCP: 4,8 s → 2,1 s (4G)
- CLS: 0,18 → 0,03
- Mobile-Conversion: +X % (TODO messen nach 30 Tagen)
Take-Away
PageSpeed auf Shopify ist zu 80 % Disziplin, zu 20 % Magie. Wer saubere Liquid-Struktur plus einen Cloudflare-Layer hat, kommt ohne Theme-Neubau weit.