Google Moves Web Vitals to DevTools

Google has announced the retirement of its Web Vitals extension, officially ending support for the tool as of January 2025. This decision represents a notable change in how developers monitor Core Web Vitals, a critical set of metrics that assess website performance and user experience. Instead of relying on the now-discontinued extension, developers are being directed to use the Performance panel within DevTools, where these metrics have been fully integrated.

The Web Vitals extension was originally introduced to help developers monitor metrics such as Largest Contentful Paint (LCP), First Input Delay (FID), and Cumulative Layout Shift (CLS) with ease. These metrics play a crucial role in understanding how quickly a website loads, how responsive it is, and how stable its content appears during loading. However, Google’s decision to retire the extension aims to streamline the monitoring process by consolidating these tools into DevTools, the built-in developer suite within the Chrome browser.

By moving Core Web Vitals monitoring into DevTools, Google intends to provide a more centralised and efficient solution for developers. This integration eliminates the need for additional extensions, simplifying workflows and making it easier to diagnose and optimise website performance directly within the browser environment. The Performance panel now offers all the features previously available in the Web Vitals extension, ensuring that developers can continue to monitor these vital metrics without disruption.

For developers who have been reliant on the Web Vitals extension, this transition is a clear call to adapt to the updated tools. Google advises developers to familiarise themselves with the Performance panel in DevTools, which not only replicates the functionality of the extension but also offers enhanced features for a more robust performance analysis. This panel allows developers to access detailed insights into their site’s performance metrics and identify areas for improvement, all within a single interface.

The shift also aligns with Google’s broader commitment to improving web performance standards and ensuring optimal user experiences. Core Web Vitals have become a cornerstone of Google’s ranking criteria, making it essential for developers to maintain high performance levels. The consolidation of tools within DevTools reflects Google’s aim to support developers with streamlined and comprehensive solutions, enabling them to focus on optimising their websites more effectively.

In light of this change, developers are encouraged to update their workflows and explore the enhanced capabilities of the DevTools Performance panel. While the retirement of the Web Vitals extension may initially feel like a disruption, the move ultimately offers a more unified and powerful approach to monitoring and improving website performance.

This decision underscores Google’s dedication to fostering a high-performing web ecosystem. By integrating Core Web Vitals monitoring directly into DevTools, the company continues to prioritise tools and standards that support both developers and end-users. As the web evolves, such updates ensure that performance tracking remains accessible, efficient, and aligned with the latest technological advancements.

Google has officially announced the closure of its Web Vitals Chrome extension, coinciding with the release of Chrome 132. This marks the end of an era for the extension, which had been a popular tool for monitoring website performance metrics. The decision comes as part of Google’s broader strategy to streamline its tools and enhance the user experience for developers.

The key features of the Web Vitals extension, which provided metrics such as Largest Contentful Paint (LCP), First Input Delay (FID), and Cumulative Layout Shift (CLS), have now been fully integrated into the DevTools Performance panel. This integration makes DevTools the primary platform for measuring Core Web Vitals, offering developers a centralised and powerful tool for monitoring and improving site performance.

With nearly 200,000 users relying on the Web Vitals extension, its discontinuation represents a significant shift. However, Google emphasises that the move to DevTools reflects a commitment to providing a more robust and efficient solution. By focusing on DevTools, Google aims to offer developers a streamlined workflow, eliminating the need for additional extensions while maintaining access to critical performance insights.

The DevTools Performance panel not only replicates the functionality of the extension but also introduces additional features for a more comprehensive debugging experience. Developers can now access Core Web Vitals data directly within the browser’s built-in tools, simplifying the process of identifying and addressing performance issues.

This transition aligns with Google’s goal of improving web standards and ensuring optimal user experiences. Core Web Vitals remain a critical component of Google’s ranking algorithms, making it essential for developers to monitor and enhance these metrics. The shift to DevTools ensures that developers have access to up-to-date tools that are seamlessly integrated into their existing workflows.

While the closure of the Web Vitals extension may require users to adapt, it ultimately offers a more unified and capable solution. Google encourages developers to explore the enhanced capabilities of DevTools, which not only centralises performance monitoring but also supports a wide range of debugging and optimisation tasks.

In conclusion, the retirement of the Web Vitals Chrome extension is part of Google’s ongoing effort to modernise its tools and provide a cohesive development environment. By consolidating features into DevTools, Google ensures that developers can continue to monitor Core Web Vitals efficiently while leveraging the latest advancements in performance analysis.

What’s New in DevTools?

The Performance panel in Chrome DevTools now offers a comprehensive suite of tools that not only replicate but also enhance the capabilities previously available through the Web Vitals extension. This transition provides developers with an integrated and powerful platform for monitoring and debugging web performance metrics.

One key feature is Live Metrics, which provides real-time Core Web Vitals data during local testing. This allows developers to assess how their websites perform as they make changes, ensuring optimisations are effective and immediate.

The panel also includes Field Data, enabling developers to compare their local test results with Chrome User Experience Report (CrUX) data. This comparison includes insights for both desktop and mobile views, offering a holistic understanding of website performance across different devices.

For those focusing on Largest Contentful Paint (LCP), DevTools now allows users to pinpoint the specific element responsible for their LCP score. Detailed phase breakdowns, such as Time to First Byte (TTFB) and render delay, are available to help developers identify bottlenecks and optimise load times effectively.

Another enhancement is the Interaction to Next Paint (INP) Interaction Log, which tracks interactions contributing to the INP score. This feature provides detailed timing information, including input delay, processing time, and presentation, making it easier to diagnose and resolve interaction performance issues.

The Cumulative Layout Shift (CLS) Log groups layout shifts to give a clear picture of what contributes to a site’s CLS score. This makes it easier to tackle visual instability and enhance the overall user experience on a webpage.

Additionally, the panel includes Diagnostic Metrics, such as TTFB and First Contentful Paint (FCP). These metrics provide further insights into the loading and rendering phases, equipping developers with the information needed to refine their site’s performance further.

DevTools now consolidates all the features of the Web Vitals extension while adding advanced debugging tools in a single, accessible location. This integration ensures developers have a streamlined workflow for analysing and improving Core Web Vitals, setting a new standard for web performance monitoring.

What Developers Should Do Next

If you are still relying on the Web Vitals extension for performance monitoring, it is now the perfect time to transition to Chrome DevTools. With the discontinuation of the extension, DevTools has become the primary platform for tracking and improving Core Web Vitals.

To ease the transition, Google has provided a detailed migration guide. This guide outlines how to make the switch and take full advantage of the robust tools available in DevTools’ Performance panel. It ensures that developers can seamlessly adapt to the new setup without losing critical functionality.

For those who may face challenges migrating, Google has also shared instructions on how to maintain a local copy of the Web Vitals extension. This approach offers temporary support, allowing users to continue leveraging the extension for performance insights.

However, it is worth noting that the CrUX API key tied to the extension will soon be revoked. This change could disrupt field data integration, which relies on this API key. Developers who plan to keep using a local copy will need to generate a new CrUX API key through the CrUX API documentation to maintain full functionality.

Making the switch to DevTools not only ensures uninterrupted performance monitoring but also offers a more advanced and centralised platform for debugging and optimising website metrics. Transitioning now will allow you to stay ahead and make the most of Google’s enhanced developer tools.

Looking Ahead

Google’s recent decision to retire the Web Vitals Chrome extension demonstrates its dedication to enhancing DevTools as the ultimate performance monitoring tool for developers. By integrating the extension’s best features into the DevTools Performance panel, Google aims to centralise and streamline the process of website performance optimisation.

The Performance panel now provides comprehensive coverage, from tracking Core Web Vitals to offering advanced diagnostic capabilities. Developers can look forward to even more updates in the future, further solidifying DevTools as an indispensable resource for performance monitoring and debugging.

While the Web Vitals extension was widely regarded as a helpful tool, its transition to DevTools makes monitoring and optimising site performance even more convenient. With everything now housed in one place, developers can save time and effort while accessing a more powerful suite of tools.

For those interested in learning more about these changes, Google has shared additional details in their official announcement. Developers can also explore the GitHub repository for in-depth information on how to maximise the capabilities of DevTools for their projects.