Performance

Core Web Vitals: measure LCP, INP and CLS before fixing your site

Read Core Web Vitals correctly, distinguish real-user data from lab tests and prioritise fixes using the documented Sanegon redesign.

Emeric Mathis1 October 2024Updated on 10 September 20263 min read

A high performance score does not tell you whether every customer can use your website comfortably. A useful audit connects a metric to a page, a device and a task. Start with the journey you want to improve: reading a service page, choosing a product or sending an enquiry.

What LCP, INP and CLS measure

LCP concerns the largest visible content, INP measures responsiveness to interactions, and CLS describes unexpected layout shifts. Google's good thresholds are 2.5 seconds, 200 milliseconds and 0.1, measured at the 75th percentile for mobile and desktop separately. INP replaced FID in March 2024. Google's definitions.

These are relevant search signals, but passing them does not guarantee rankings. Useful content and relevance still matter. Google's page experience guidance.

Establish a baseline you can compare

Open the exact URL in PageSpeed Insights. Save the report date and device setting. Distinguish available real-user data from the Lighthouse simulation shown below it. A small website may not have enough traffic for a field report; missing data is not a pass or a failure.

Run the same page under the same settings after a change. Also try the important interactions yourself. A loading test alone will not explain why a particular catalogue filter feels slow.

A project example: Sanegon

The Sanegon case study documents a mobile laboratory comparison dated 25 July 2026. The new website scored 95/100 for Lighthouse Performance, versus 67/100 for the previous site. The recorded LCP changed from 4.8 to 2.9 seconds; CLS changed from 0.227 to 0.

The distinction matters: 95/100 does not mean the measured LCP already meets the 2.5-second target. These are dated lab results, not evidence of increased sales or a real-user Core Web Vitals pass. The case study provides the measurement context and tool links.

Match the correction to the cause

When the main content appears late

Identify the LCP element. For a photograph, check the actual file downloaded, its dimensions and when its request starts. Do not delay the main image until a scroll event. For a heading, inspect fonts and the styles needed to display it. If the HTML response itself arrives late, investigate hosting, cache behaviour and server work before changing image quality.

When a click feels slow

Record the specific interaction in browser performance tools. Look for expensive calculations, repeated rendering and third-party scripts triggered by the action. Provide prompt feedback and divide long work into smaller tasks. In the LR Studios catalogue, the key journey is finding a game and following its store link. That task does not need a complex interaction layer.

When buttons move during loading

Reserve space for images and embeds. Test validation messages, fonts and banners with a slow connection. Watch the controls a customer needs to click, rather than only observing the top of the page.

Keep a small release checklist

Check an example from each important page family: home, service, article and product or case study. Record loading, interaction and layout observations before and after the change. Keep working features in the test, too.

The image optimisation guide explains the visual side. For a targeted review, share a URL, the slow action and your dated report through my web development services.

Contact form

Accepted formats: PDF, JPG, PNG, DOCX. Max total size: 25 MB.