Measure field data, not just lab scores
A perfect Lighthouse run on a fast laptop proves very little. Use real-user data from the Chrome UX Report or your own analytics, segmented by device, and treat lab tools as debugging aids only.
Fixing LCP
Largest Contentful Paint is usually one image or one blocking request. The fix is almost always about the critical path, not the total page weight.
- Serve the hero image in WebP or AVIF at the real display size
- Preload the hero asset and never lazy-load it
- Remove render-blocking third-party scripts from the head
- Cache HTML at the edge so the server is not the bottleneck
Fixing INP
Interaction to Next Paint punishes long JavaScript tasks. Most poor scores come from analytics bundles, chat widgets and heavy hydration rather than your own UI code.
- Defer non-critical third-party scripts until after interaction
- Break long tasks up and avoid layout thrash in event handlers
- Ship less JavaScript per route with code splitting
- Virtualise long lists and tables
Fixing CLS
Layout shift is almost entirely a reserved-space problem.
- Set width and height on every image, video and embed
- Reserve space for banners, ads and cookie notices
- Use font-display: swap with a matched fallback metric
- Never insert content above what the user is already reading
Where teams waste effort
Chasing 100 on a lab test while real users on mid-range Android phones still wait four seconds. Fix the slowest real segment first — that is where both rankings and conversion improve.