Hero image is too large: A 2500–4000 px wide JPEG is delivered even though the screen may only need 1200 px.
Solution: Configure TYPO3 Image Processing properly, use appropriate crops, and deliver WebP/AVIF.
The most important image has loading="lazy": Especially in TYPO3 templates, lazy loading is often applied to all images across the board. For the LCP image, that's counterproductive.
Solution: Output the hero/header image with loading="eager" and ideally fetchpriority="high".
Hero images are embedded as CSS backgrounds: The browser usually discovers the image later than with a normal <img> or <picture>.
Solution: Use <picture>/<img> where possible. Only use background images where they're genuinely needed for design reasons.
TYPO3 cache isn't working correctly: Pages get re-rendered on every request, or extensions prevent effective cache usage. This drives up TTFB.
Solution: Review the TYPO3 page cache, Caching Framework, and, if applicable, reverse proxy/CDN. Pay particular attention to USER_INT elements.
Too much CSS loads before the first render: Bootstrap, custom styles, extension CSS, and legacy stylesheets quickly add up to several hundred KB.
Solution: Reduce CSS, remove unused styles, review critical CSS, and avoid unnecessary extension CSS files.
JavaScript blocks page rendering: Sliders, menus, animations, tracking, or large JS bundles load too early.
Solution: Load scripts with defer wherever possible and only execute JavaScript once it's actually needed.
Slider in the visible area: Swiper, Slick, or similar libraries are a classic culprit. The first large image sometimes only appears after the slider has initialized.
Solution: Output the first slider image immediately in the HTML, without depending on JavaScript.
Web fonts delay the LCP: With a large H1, the text itself can even be the LCP element. Multiple Google Font weights or external fonts make this worse.
Solution: Host fonts locally, only load the weights you need, use WOFF2, and preload important fonts.
Consent managers and third-party scripts: Cookiebot, Usercentrics, Google Tag Manager, Maps, chat tools, and other services can put significant early strain on CPU and network.
Solution: Load third-party scripts as late as possible and only run scripts that are genuinely necessary before consent.
No prioritization of above-the-fold resources: The browser initially loads the logo, fonts, tracking, footer images, and hero graphic with similar priority.
Solution: Specifically prioritize the LCP element with fetchpriority="high" and, if applicable, <link rel="preload">, deferring everything else.