Back to Browse

Monitor live Core Web Vitals in Chrome DevTools #DevToolsTips

15.9K views
Oct 31, 2024
5:55

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 → https://goo.gle/3NDozRD Documentation → https://goo.gle/3NBiXYf Questions? Tweet to us: Jecelyn Yeen → https://goo.gle/jecfish Barry Pollard → https://goo.gle/tunetheweb Chrome DevTools → https://goo.gle/chromedevtools Watch more DevTools Tips → https://goo.gle/DevToolsTips Subscribe to Chrome for Developers → https://goo.gle/ChromeDevs #DevToolTips #ChromeForDevelopers #Chrome Speaker: Jecelyn Yeen Products Mentioned: Chrome DevTools

Download

1 formats

Video Formats

360pmp413.2 MB

Right-click 'Download' and select 'Save Link As' if the file opens in a new tab.

Monitor live Core Web Vitals in Chrome DevTools #DevToolsTips | NatokHD