--- title: Improve Website UX with Chrome DevTools and Core Web Vitals. description: Core Web Vitals are Google's three key metrics for measuring website user experience: Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), and... canonical: https://daily.dev/posts/improve-website-ux-with-chrome-devtools-and-core-web-vitals--brpkpxkzp twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: Improve Website UX with Chrome DevTools and Core Web Vitals. | daily.dev og:description: Core Web Vitals are Google's three key metrics for measuring website user experience: Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), and... og:url: https://daily.dev/posts/improve-website-ux-with-chrome-devtools-and-core-web-vitals--brpkpxkzp og:image: https://api.daily.dev/og/posts/BrpKpxKZP.png og:image:alt: Improve Website UX with Chrome DevTools and Core Web Vitals. og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # Improve Website UX with Chrome DevTools and Core Web Vitals. **[Medium](https://daily.dev/sources/medium_js)** · 9 min read · 2 upvotes · 0 comments ## Summary Core Web Vitals are Google's three key metrics for measuring website user experience: Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), and Interaction to Next Paint (INP). LCP measures how fast the largest visible element loads (good under 2.5s), CLS measures layout stability during loading (good under 0.1), and INP measures interaction responsiveness (good under 200ms). Each metric can be measured using Chrome DevTools, Lighthouse, or PageSpeed Insights. Common fixes include compressing images and setting explicit dimensions, preloading fonts, removing render-blocking resources, breaking up long JavaScript tasks, and deferring third-party scripts. A final checklist helps developers verify all three metrics before shipping. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Questions this post answers ### What replaced First Input Delay (FID) as a Core Web Vital and when? Interaction to Next Paint (INP) replaced First Input Delay (FID) as an official Core Web Vital in 2024. FID only measured the delay before the first interaction was processed, while INP tracks responsiveness across all interactions throughout a page visit, reporting the worst or close to worst interaction, giving a fuller picture of how a site feels beyond just initial load. _Developers tracking Core Web Vitals changes like the FID-to-INP shift can follow updates on daily.dev._ ### What are Google's good, needs-improvement, and poor thresholds for LCP, CLS, and INP? For LCP: under 2.5 seconds is good, 2.5-4 seconds needs improvement, over 4 seconds is poor. For CLS: under 0.1 is good, 0.1-0.25 needs improvement, over 0.25 is poor. For INP: under 200ms is good, 200ms-500ms needs improvement, over 500ms is poor. These thresholds come from Google's Core Web Vitals scoring system. _Web developers benchmarking site UX against these thresholds can dig deeper into performance topics on daily.dev._ ### Why can't Interaction to Next Paint (INP) be fully measured using a Lighthouse audit? INP depends on real user interaction data collected across an entire visit, whereas Lighthouse runs a simulated, one-time lab audit and can't capture real interactions over time. PageSpeed Insights is better suited since it pulls field data from actual Chrome users via the Chrome UX Report. Chrome DevTools can still record a session to inspect interaction latency for debugging, but that single recording doesn't represent true INP. _Frontend engineers debugging responsiveness issues can find practical performance guidance on daily.dev._ ## Similar posts on daily.dev - [What Actually Impacts Google Rankings? : fireup.pro](https://daily.dev/posts/what-actually-impacts-google-rankings-fireup-pro-jtesup3jv) · FireUp · 4 upvotes · 0 comments - [LCP and INP are now Baseline Newly available](https://daily.dev/posts/lcp-and-inp-are-now-baseline-newly-available-kond6f1fo) · web.dev · 3 upvotes · 0 comments - [Chrome DevTools for Debugging Web Performance](https://daily.dev/posts/chrome-devtools-for-debugging-web-performance-he3paj551) · Web Performance Calendar · 9 upvotes · 0 comments - [Web Performance & Optimisation](https://daily.dev/posts/web-performance-optimisation-i331jarhz) · Medium · 2 upvotes · 0 comments --- Tags: [#webdev](https://daily.dev/tags/webdev), [#ux](https://daily.dev/tags/ux), [#google-chrome](https://daily.dev/tags/google-chrome), [#lighthouse](https://daily.dev/tags/lighthouse) [View this post on daily.dev](https://daily.dev/posts/improve-website-ux-with-chrome-devtools-and-core-web-vitals--brpkpxkzp) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"Improve Website UX with Chrome DevTools and Core Web Vitals.","url":"https://daily.dev/posts/improve-website-ux-with-chrome-devtools-and-core-web-vitals--brpkpxkzp","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/improve-website-ux-with-chrome-devtools-and-core-web-vitals--brpkpxkzp"},"datePublished":"2026-07-23T08:07:33.539Z","dateModified":"2026-09-14T07:38:45.842Z","description":"Core Web Vitals are Google's three key metrics for measuring website user experience: Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), and...","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/e469372944e2032dd23ccdddda266356?_a=AQAEuop","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/e469372944e2032dd23ccdddda266356?_a=AQAEuop","isAccessibleForFree":true,"articleSection":"Medium","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"Medium","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/medium","url":"https://daily.dev/sources/medium_js"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/improve-website-ux-with-chrome-devtools-and-core-web-vitals--brpkpxkzp","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":2},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"webdev,ux,google-chrome,lighthouse","timeRequired":"PT9M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Medium","item":"https://daily.dev/sources/medium_js"},{"@type":"ListItem","position":3,"name":"Improve Website UX with Chrome DevTools and Core Web Vitals."}]} {"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/improve-website-ux-with-chrome-devtools-and-core-web-vitals--brpkpxkzp#faq","mainEntity":[{"@type":"Question","name":"What replaced First Input Delay (FID) as a Core Web Vital and when?","acceptedAnswer":{"@type":"Answer","text":"Interaction to Next Paint (INP) replaced First Input Delay (FID) as an official Core Web Vital in 2024. FID only measured the delay before the first interaction was processed, while INP tracks responsiveness across all interactions throughout a page visit, reporting the worst or close to worst interaction, giving a fuller picture of how a site feels beyond just initial load. Developers tracking Core Web Vitals changes like the FID-to-INP shift can follow updates on daily.dev."}},{"@type":"Question","name":"What are Google's good, needs-improvement, and poor thresholds for LCP, CLS, and INP?","acceptedAnswer":{"@type":"Answer","text":"For LCP: under 2.5 seconds is good, 2.5-4 seconds needs improvement, over 4 seconds is poor. For CLS: under 0.1 is good, 0.1-0.25 needs improvement, over 0.25 is poor. For INP: under 200ms is good, 200ms-500ms needs improvement, over 500ms is poor. These thresholds come from Google's Core Web Vitals scoring system. Web developers benchmarking site UX against these thresholds can dig deeper into performance topics on daily.dev."}},{"@type":"Question","name":"Why can't Interaction to Next Paint (INP) be fully measured using a Lighthouse audit?","acceptedAnswer":{"@type":"Answer","text":"INP depends on real user interaction data collected across an entire visit, whereas Lighthouse runs a simulated, one-time lab audit and can't capture real interactions over time. PageSpeed Insights is better suited since it pulls field data from actual Chrome users via the Chrome UX Report. Chrome DevTools can still record a session to inspect interaction latency for debugging, but that single recording doesn't represent true INP. Frontend engineers debugging responsiveness issues can find practical performance guidance on daily.dev."}}]} ```