Core Web Vitals (CWV)

Owned by Yahel Galili
Last updated: Nov 04, 2024
2 min read

Core Web Vitals (CWV) are a set of metrics that measure the user experience of your website. Google uses these metrics to rank websites in their search results, so optimizing them is important to drive organic traffic to your site.

Why are CWV important?

  • Better user experience: Faster loading times and smoother interactions keep users happy.

  • Improved search engine rankings: Websites with good CWVs tend to rank higher in search results.

The 3 metrics comprising CWV

  • Largest Contentful Paint (LCP): Measures how quickly the main content of a page loads.

  • Interaction to Next Paint (INP): Measures how quickly a page responds to user input.

  • Cumulative Layout Shift (CLS): Measures how much a page's content shifts around during loading.

How CWV is calculated

Each metric’s final score represents the 75th percentile in your site’s performance distribution, and is assigned a ‘poor’, ‘needs improvement’ or ‘bad’ rating based on these ranges:

  • Largest Contentful Paint (LCP)

    • “Good” score under 2.5 seconds

    • “Poor” score over 4 seconds

    • “Needs improvement” score between 2.5 and 4 seconds

  • Interaction to Next Paint (INP)

    • “Good” score under 200 ms

    • “Poor” score over 500 ms

    • “Needs improvement” score between 200 and 500 ms

  • Cumulative Layout Shift (CLS)

    • “Good” score under 0.1

    • “Poor” score over 0.25

    • “Needs improvement” score between 0.1 and 0.25

How to improve CWV

  • Optimize images: Compress images without losing quality.

  • Minimize JavaScript and CSS: Reduce the amount of code your page needs to load.

  • Leverage browser caching: Store static assets locally to reduce load times.

  • Prioritize critical resources: Load the most important resources first.

  • Avoid layout shifts: Plan your page layout carefully to prevent unexpected shifts.

Tools to measure CWV

  • Browsi: Reach out to your AM to learn how Browsi can help optimize your site. Specifically, while other tools on this list look at a whole site or individual sites, Browsi segments sites by layouts, giving you more actionable comparisons.

  • Google PageSpeed Insights

  • Google Lighthouse: Either as a Chrome extension or through Chrome DevTools

Beyond CWV

A couple of other metrics are measured by the same Google tools, and are commonly optimized in addition to CWV:

  • Total Blocking Time (TBT): Measures the total time a page is unresponsive to user input, i.e. between First Contentful Paint (FCP) and Time to Interactive (TTI). If this is a concern, reach out to your Browsi AM - we can help.

  • Time to First Byte (TTFB): Measures the time between the request for a resource and when the first byte of a response begins to arrive (the responsiveness of a web server).

  • First Contentful Paint (FCP): Measures the time from when the user first navigated to the page to when any part of the page's content (text, images (including background images), <svg> elements, or non-white <canvas> elements) is rendered on the screen.