Hero-Bild ist zu groß: Ein 2500–4000 px breites JPEG wird ausgeliefert, obwohl auf dem Bildschirm vielleicht 1200 px reichen.
Lösung: TYPO3 Image Processing sauber konfigurieren, passende Zuschnitte nutzen und WebP/AVIF ausliefern.
Das wichtigste Bild hat loading="lazy": Gerade bei TYPO3-Templates wird Lazy Loading oft pauschal auf alle Bilder gesetzt. Für das LCP-Bild ist das kontraproduktiv.
Lösung: Hero-/Headerbild mit loading="eager" und idealerweise fetchpriority="high" ausgeben.
Hero-Bilder werden als CSS-Background eingebunden: Dann entdeckt der Browser das Bild meist später als ein normales <img> oder <picture>.
Lösung: Wenn möglich <picture>/<img> verwenden. Hintergrundbilder nur dort einsetzen, wo sie gestalterisch wirklich nötig sind.
TYPO3-Cache greift nicht richtig: Seiten werden bei jedem Aufruf neu gerendert oder Extensions verhindern eine effektive Cache-Nutzung. Dadurch steigt die TTFB.
Lösung: TYPO3 Page Cache, Caching Framework und ggf. Reverse Proxy/CDN überprüfen. Vor allem USER_INT-Elemente kritisch prüfen.
Zu viel CSS wird vor dem ersten Rendering geladen: Bootstrap, eigene Styles, Extension-CSS und alte Stylesheets summieren sich schnell auf mehrere hundert KB.
Lösung: CSS reduzieren, ungenutzte Styles entfernen, Critical CSS prüfen und nicht benötigte Extension-CSS-Dateien vermeiden.
JavaScript blockiert den Seitenaufbau: Slider, Menüs, Animationen, Tracking oder große JS-Bundles werden zu früh geladen.
Lösung: Skripte möglichst mit defer laden und JavaScript erst dann ausführen, wenn es tatsächlich benötigt wird.
Slider im sichtbaren Bereich: Swiper, Slick oder ähnliche Bibliotheken sind ein Klassiker. Das erste große Bild erscheint teilweise erst nach der Initialisierung des Sliders.
Lösung: Erstes Sliderbild sofort im HTML ausgeben und nicht von JavaScript abhängig machen.
Webfonts verzögern den LCP: Bei einer großen H1 kann sogar der Text selbst das LCP-Element sein. Mehrere Google-Font-Schnitte oder externe Fonts verschlechtern den Wert.
Lösung: Fonts lokal hosten, nur benötigte Schnitte laden, WOFF2 verwenden und wichtige Fonts preloaden.
Consent Manager und Drittanbieter-Skripte: Cookiebot, Usercentrics, Google Tag Manager, Maps, Chat-Tools und andere Dienste können CPU und Netzwerk früh stark belasten.
Lösung: Drittanbieter möglichst nachgelagert laden und nur wirklich notwendige Skripte vor Consent ausführen.
Keine Priorisierung der Above-the-fold-Ressourcen: Der Browser lädt Logo, Fonts, Tracking, Footer-Bilder und Hero-Grafik zunächst mit ähnlicher Priorität.
Lösung: Das LCP-Element gezielt mit fetchpriority="high" und ggf. <link rel="preload"> bevorzugen, alles andere zurückstellen.