Veröffentlicht am 24. Juni 2026
Nuvemshop (in spanischsprachigen Ländern Lateinamerikas als Tiendanube bekannt) ist die führende E-Commerce-Plattform in der Region und unterstützt über 180.000 Onlineshops. Händler können ihre Shops mit verschiedenen Designs und dynamischen Inhaltsanordnungen anpassen. Daher stellt es eine besondere technische Herausforderung dar, schnelle Seitenladezeiten für diese Vielfalt zu gewährleisten.
- Der LCP-Wert (Largest Contentful Paint) hat sich um 68%verbessert, von 57% auf 96% innerhalb eines Jahres. Das zeigt eine deutliche Veränderung in der Art und Weise, wie Shops Inhalte oben im Darstellungsbereich für echte Nutzer rendern.
- Die Core Web Vitals-Prüfung wurde von 48% auf 72%der Shops bestanden. Das bedeutet, dass fast drei von vier Shops jetzt den Mindestleistungsanforderungen von Google entsprechen.
- Das Shopping-Engagement hat sich messbar verbessert. Bei der Analyse derselben Gruppe brasilianischer Shops, die im Januar 2025 und im Januar 2026 aktiv waren, zeigten mobile Besucher aus der organischen Google-Suche Folgendes:
- 8,9% höhere Conversion-Rate (Sitzung zu kostenpflichtiger Bestellung)
- 8,4% höhere Engagement-Rate für den Einkaufswagen (Sitzung zu Einkaufswagen)
- Die größten Verbesserungen wurden auf Mobilgeräten erzielt. Das stimmt mit den Bereichen überein, in denen die LCP-Werte am stärksten verbessert wurden.
Diese Ergebnisse stimmen mit einer von Google in Auftrag gegebenen Studie von Deloitte überein (über 30 Millionen Sitzungen bei 37 Marken), laut der eine Verbesserung der Ladegeschwindigkeit um 0,1 Sekunden die Conversion-Raten im Einzelhandel um 8,4 % steigern kann. Das bestätigt, dass unsere Investitionen in die richtige Richtung gehen.
Die Herausforderung: LCP-Erkennung in dynamischen E-Commerce-Layouts
Anfang 2025 erfüllten nur 48% unserer Shops die Core Web Vitals-Grenzwerte und 57% hatten gute LCP-Werte. Unsere ursprüngliche Hypothese war, dass das Bildgewicht oder die Serverlatenz die Ursache sein könnten. Wir lagen falsch.
Durch die PageSpeed Insights-Analyse von Tausenden von Shops haben wir festgestellt, dass Händler auf unserer Plattform Homepage-Abschnitte dynamisch anordnen können: Karusselle, Banner, Produktübersichten und benutzerdefinierte Module können in beliebiger Reihenfolge angezeigt werden.
Diese Flexibilität führte zu einem unvorhergesehenen Problem: Das richtige Element wurde nicht immer als LCP identifiziert. In Shops mit Karussellen, die 85 % unserer Shops ausmachten, wurde manchmal ein Banner weiter unten im Darstellungsbereich als LCP markiert, anstatt das erste Karussellbild. Das hing davon ab, wie die Seite auf verschiedenen Bildschirmen und Geräten gerendert wurde. Das bedeutete, dass unsere Optimierungsbemühungen nicht die gewünschte Wirkung hatten: Wir haben Elemente optimiert, die keine LCP-Elemente waren.
Im Gegensatz zu typischen SaaS-Plattformen konnten wir nicht einfach die Homepage korrigieren. Wir brauchten eine Lösung, die für jede mögliche Designkonfiguration, Abschnittsanordnung und Händleranpassung funktioniert, ohne bestehende Shops zu beeinträchtigen oder die kreative Freiheit einzuschränken.
Wie sich dynamische Layouts auf die Auswahl des LCP-Elements auswirken
Durch die PageSpeed Insights-Analyse und die Überwachung von echten Nutzern haben wir festgestellt, dass CSS-Übergänge bei Karussellen und Bannern verzögert wurden, wenn Elemente für den LCP-Erkennungsalgorithmus des Browsers sichtbar wurden. Obwohl Nutzer das Karussell als erstes geladen wahrnahmen, markierte der Browser manchmal ein Banner im zweiten Abschnitt als LCP-Element, da die Sichtbarkeit dieses Elements nicht durch Übergangseffekte verzögert wurde.
Wir haben drei Hauptursachen identifiziert:
- CSS-Übergänge wurden verzögert, wenn Elemente als sichtbar betrachtet wurden, wodurch die LCP-Erkennung auf den falschen Frame verschoben wurde.
- Lazy Loading wurde auf Bilder oben im Darstellungsbereich angewendet, die sofort geladen werden mussten.
- Fehlende Prioritätssignale führten dazu, dass die wichtigsten Bilder nicht zuerst geladen wurden.
Wir haben auch festgestellt, dass ein erheblicher Teil der LCP-Messungen von Kategorie- und Produktseiten stammte, nicht nur von Homepages. Daher mussten unsere Korrekturen einheitlich auf alle Seiten mit hohem Traffic angewendet werden.
Implementierung: Die drei Hauptursachen im großen Maßstab beheben
Nachdem die Ursachen identifiziert waren, waren die Korrekturen einfach. Wir haben sie einheitlich auf alle Hauptdesigns und Seitentypen angewendet. Für jede Korrektur war jedoch eine sorgfältige Abgrenzung erforderlich, um neue Probleme zu vermeiden.
- CSS-Übergänge für Abschnitte in der ersten Position entfernt. Abschnitte, die zuerst auf der Seite angezeigt werden, werden jetzt sofort gerendert. So wird sichergestellt, dass der Browser sie ohne künstliche Verzögerungen als LCP-Kandidaten erkennt.
Lazy Loading für Bilder oben im Darstellungsbereich entfernt. Bei Bildern im ersten Abschnitt entfernen wir bedingt
loading="lazy", um die Verzögerung beim Laden von Ressourcen zu vermeiden. Wir haben darauf geachtet, dass dies nur für das erste Bild in Abschnitten in der ersten Position gilt:<!-- Before --> <img src="slide-1.webp" loading="lazy" alt="Featured product"> <!-- After --> <img src="slide-1.webp" alt="Featured product">Explizite Prioritätssignale hinzugefügt. Durch Hinzufügen von
fetchpriority="high"teilen wir dem Preload-Scanner des Browsers mit, dass das LCP-Bild eine Ressource mit hoher Priorität ist. So kann es früher erkannt und heruntergeladen werden, bevor Layout und Rendering abgeschlossen sind. Wir haben eine Validierungslogik hinzugefügt, um sicherzustellen, dass Prioritätssignale nur angewendet werden, wenn sich das Element tatsächlich an einer Position befindet, an der es der LCP Kandidat sein könnte. Wennfetchpriority="high"zu vielen Bildern hinzugefügt wird, ist das kontraproduktiv, da nichts eine hohe Priorität hat, wenn alles eine hohe Priorität hat.<!-- Before --> <img src="slide-1.webp" alt="Featured product"> <!-- After --> <img src="slide-1.webp" fetchpriority="high" alt="Featured product">Latenz durch Edge-Caching reduziert. Caching ist effektiv, um Ladezeiten zu verkürzen. Im E-Commerce birgt es jedoch ein echtes Risiko: Wenn veraltete Preis- und Bestandsdaten bereitgestellt werden, wirkt sich das direkt auf das Vertrauen der Kunden und den Umsatz aus. Wir sind hier vorsichtig vorgegangen und haben neben Leistungsdaten auch geschäftliche Messwerte im Blick behalten. So konnten wir die Cache-Trefferraten maximieren und gleichzeitig sicherstellen, dass wir niemals Inhalte im Cache speichern, die dem Händler oder Käufer schaden könnten.
Auswirkungen und Ergebnisse: LCP-Verbesserung von 57% auf 96 %
| Messwert (Januar 2025 bis Januar 2026) | Relative Verbesserung |
|---|---|
| LCP (gut) | +68% (57% auf 96%) |
| Core Web Vitals (Bestanden-Rate) | +50% (48% auf 72%) |
| Conversion-Rate (Sitzung zu kostenpflichtiger Bestellung) – mobile organische Google-Suche | +8,9% |
| Engagement für den Einkaufswagen (Sitzung zu Einkaufswagen) – mobile organische Google-Suche | +8,4% |
Durch diese Verbesserungen konnten sich Nuvemshop und Tiendanube als E-Commerce-Plattform mit der besten Leistung in Brasilien, Argentinien und Mexiko positionieren.
Wichtige Erkenntnisse und Nachbetrachtung
Aufgrund der hochgradig anpassbaren Architektur von Nuvemshop konnten wir uns nicht auf Standard-Optimierungsstrategien verlassen. Das eigentliche Problem war nicht das Bildgewicht oder die Serverlatenz, sondern dass Browser aufgrund von CSS-Übergängen, fehlenden Prioritätssignalen und Lazy Loading, das auf Bilder oben im Darstellungsbereich angewendet wurde, unerwartete Elemente als LCP auswählten.
Die Korrektur war einfach, nachdem wir die Hauptursachen verstanden hatten: Übergänge aus Abschnitten in der ersten Position entfernen, Lazy Loading für Bilder oben im Darstellungsbereich entfernen und explizite Prioritätssignale hinzufügen. Wir haben diese Korrekturen einheitlich auf alle Hauptdesigns, Seitentypen und die über 180.000 Shops auf unserer Plattform angewendet.
Die Ergebnisse sprechen für sich: Die LCP-Bestanden-Rate stieg von 57% auf 96%, die allgemeine Core Web Vitals-Bestanden-Rate von 48% auf 72 % und Händler verzeichneten messbare Verbesserungen: eine Steigerung der Conversion-Rate um 8,9% und eine Steigerung des Engagements für den Einkaufswagen auf Mobilgeräten um 8, 4 %. Schnelle Shops sind nicht nur eine technische Errungenschaft, sondern tragen auch direkt zum Erfolg der Händler bei.