Telling the browser which slide matters took LCP from 3.6s to 1.8s
In a homepage carousel, the browser often can't tell which slide is visible first, so it may prioritize the wrong image. LCP — Largest Contentful Paint — then waits on an image nobody sees yet. Think of it like a chef cooking table 5's order before table 1, who's been waiting at the door.
A site's carousel held 5 images. The browser loaded them in source order, and the visible first slide came third in the code, so LCP hit 3.6s.
The fix used priority hints:
— Added fetchpriority="high" to the first visible slide.
— Added loading="lazy" to the off-screen slides.
— The browser fetched the right image first.
Result: LCP dropped to 1.8s.
Try this: in a carousel, mark the first slide high priority and lazy-load the rest.
Vitals 101
@CoreVitals101
Telling the browser which slide matters took LCP from 3.6s to 1.8s
Этот пост опубликован в Telegram-канале Vitals 101. Подписаться можно по ссылке: @CoreVitals101.