Monitor live Core Web Vitals in Chrome DevTools #DevToolsTips

Опубликовано 31 октября 2024, 13:00

Barry shows Jecelyn the new Performance panel landing page featuring a live view of your local Core Web Vitals performance. Learn how it can be used to debug LCP issues, use CrUX data to see if you’re debugging a similar experience to your users, and measure INP in real time as you interact with the page.


Chapters:
0:00 - Introduction
0:25 Intro to Live Metrics panel
0:47 The Core Web Vitals
1:10 Investigating slow LCP issues
1:32 Checking your developer experience matches
1:54 Show Chrome User ExperienceReport (CrUX) data
3:00 How field data helps in debugging
3:18 How query params are handled in CrUX data
3:50 Other things to keep in mind when looking at field data
4:24 Identifying INP issues my mentoring interactions

Resources:
Blog post → goo.gle/3NDozRD
Documentation → goo.gle/3NBiXYf


Watch more DevTools Tips → goo.gle/DevToolsTips
Subscribe to Chrome for Developers → goo.gle/ChromeDevs


#DevToolTips #ChromeForDevelopers #Chrome


Speaker: Jecelyn Yeen
Products Mentioned: Chrome DevTools