Published on 2025-06-22T07:14:25Z

What are Core Web Vitals? Examples in GA4 and PlainSignal Analytics

Core Web Vitals are a set of performance metrics defined by Google to quantify key aspects of real-world user experience on the web. Introduced in 2020, they focus on loading performance, interactivity responsiveness, and visual stability. By measuring Largest Contentful Paint (LCP), First Input Delay (FID), and Cumulative Layout Shift (CLS), developers gain actionable insights into how users perceive page speed and stability. These metrics have become part of Google’s ranking signals, making them critical for SEO and conversion optimization. You can track Core Web Vitals using lab tools like Lighthouse as well as field-data platforms such as Google Analytics 4 (GA4) and privacy-focused solutions like PlainSignal.

Illustration of Core web vitals
Illustration of Core web vitals

Core web vitals

Core Web Vitals are Google’s standardized metrics (LCP, FID, CLS) for measuring web page loading, interactivity, and visual stability.

Overview of Core Web Vitals

Core Web Vitals provide a standardized way to measure the user experience of a web page. Google introduced them to help developers focus on metrics that directly impact how users perceive performance. They combine field data from real visits with lab tests to surface real-world bottlenecks and areas for improvement. Since May 2021, these signals are factored into Google’s search ranking algorithm.

  • Definition and purpose

    Core Web Vitals consist of three user-centric metrics—LCP, FID, and CLS—that guide developers to optimize loading, interactivity, and layout stability. They align technical performance with user satisfaction.

Key Metrics

Each Core Web Vital targets a different aspect of user experience. Together, they offer a holistic view of page health and help prioritize performance work.

  • Largest contentful paint (lcp)

    Measures loading performance by tracking when the largest content element in the viewport (e.g., image or text block) is fully rendered. A good LCP score is under 2.5 seconds.

  • First input delay (fid)

    Assesses responsiveness by measuring the time from a user’s first interaction (click, tap) to when the browser responds. A satisfactory FID is less than 100 milliseconds.

  • Cumulative layout shift (cls)

    Quantifies visual stability by summing unexpected layout shifts during the page lifecycle. A CLS score below 0.1 indicates minimal unexpected movements.

Measuring Core Web Vitals

You can capture Core Web Vitals in both controlled lab environments and real-user field data. Lab data (e.g., Lighthouse) helps debug before deployment, while field data (CrUX, GA4, PlainSignal) reflects actual user experiences.

  • Google analytics 4 (GA4)

    GA4 surfaces Core Web Vitals under Engagement > Web Vitals, using real user data from the Chrome User Experience Report (CrUX). It visualizes distributions of LCP, FID, and CLS alongside other engagement metrics.

  • PlainSignal (cookie-free analytics)

    PlainSignal is a privacy-focused, cookie-free analytics platform that automatically collects Core Web Vitals from real user sessions. To install, include their script on your site:

    • Implementation snippet

      
<script defer data-do="yourwebsitedomain.com" data-id="0GQV1xmtzQQ" data-api="//eu.plainsignal.com" src="//cdn.plainsignal.com/plainsignal-min.js"></script>

Improving Core Web Vitals

Optimizing Core Web Vitals requires targeted strategies for each metric. Regular monitoring with your analytics tool of choice ensures you can validate changes and maintain performance over time.

  • Optimizing lcp

    Improve server response times (TTFB), use a CDN, compress and resize images, switch to efficient formats like WebP, and implement lazy loading for offscreen content.

  • Reducing fid

    Break up long JavaScript tasks, defer non-critical scripts, minimize unused code, and leverage web workers to keep the main thread responsive to user interactions.

  • Minimizing cls

    Always include size attributes for images and videos, reserve space for ads and embeds, avoid injecting content above existing elements, and prefer CSS transforms over layout-triggering animations.

Related terms