Killing LCP regressions with React Server Components
LCP is the metric that ranks. It's also the one that quietly regresses every time someone adds a hero image, a font, or a third-party script.
RSC plus streaming SSR gives you a structural fix instead of a perpetual cleanup project.
#Why LCP regresses on every release
Most LCP regressions come from three places: render-blocking JavaScript, late-loading hero assets, and client-side data fetches that block the largest paint.
Each one is fixable in isolation. The problem is they keep coming back, because the architecture invites them.
#Streaming SSR, in practice
Streaming lets you flush the document head and the LCP element first, then stream the rest as data resolves. The browser starts painting before your slowest query finishes.
#Selective hydration
Server components that don't need interactivity never ship JS to the client. The hydration budget collapses, and INP follows LCP down.
#Measure on real devices
Lab numbers lie. Wire up CrUX or your own RUM, segment by device class, and watch p75 LCP per route. That's the number Google uses.