Core Web Vitals describe loading, responsiveness and visual stability from the user’s point of view. A useful audit goes beyond a single score: identify the slow element or interaction, separate field data from a one-time lab run, make one targeted change, and measure again.
Understand the three current metrics
Largest Contentful Paint focuses on when the main visible content is rendered. Interaction to Next Paint measures responsiveness after user interactions. Cumulative Layout Shift measures unexpected movement of visible content. Each metric points to a different class of problem.
Start with field data when it is available
Real-user data reflects actual devices, networks and usage patterns. Lab tests are useful for debugging because they are repeatable, but they may not represent the full audience. If the two disagree, first check whether they are measuring the same URL, device class and time window.
Investigate the LCP element
A slow LCP may be caused by server response time, a large hero image, render-blocking resources or client-side rendering. Identify the actual LCP element before optimizing random assets.
Trace slow interactions for INP
High INP often points to long main-thread tasks or event handlers that do too much work before the next paint. Test the interactions users actually perform—opening menus, typing, filtering and submitting forms—not only the initial page load.
Reserve space to reduce CLS
Unexpected movement often comes from images, ads, embeds or components whose dimensions are not known until late. Reserve space with dimensions or stable containers and avoid inserting banners above content after the page has already settled.
Measure after each meaningful change
Performance work is iterative. Record the baseline, change one major bottleneck, deploy, then compare lab and field data after enough traffic accumulates. Do not optimize only to turn a score green if the user experience does not improve.
Worked example
Example investigation
If a tool page has good server response but a 2 MB hero image becomes LCP, resize and compress that image, set explicit dimensions, retest in the same lab profile, then watch field data after deployment.
Practical checklist
Before you finish
- Identify the actual LCP element before optimizing.
- Use field data for real-user experience and lab data for diagnosis.
- Test real interactions when investigating INP.
- Reserve dimensions for images, ads and embeds.
- Compare before and after measurements.
Common mistakes
What to avoid
- Treating one Lighthouse run as permanent field performance.
- Compressing random images without checking which element is LCP.
- Ignoring mobile devices because desktop scores look good.
- Removing useful content only to chase a score.
Further reading from authoritative sources
Use these references when you need the underlying specification or platform guidance.