Nicolas Frizzarin

Core Web Vitals: Put your application into orbit with best practices

Is your JavaScript blocking the main thread? Learn how to master the new Interaction to Next Paint metric and build a truly responsive application.

Core Web Vitals: Put your application into orbit with best practices
#1about 2 minutes

Why users are unsatisfied with web applications

Common user feedback points to slow page loads, blinking screens, and delayed interactions as key sources of frustration.

#2about 4 minutes

Understanding Core Web Vitals and measurement methods

Core Web Vitals are Google's metrics for measuring user experience, which can be tracked using field data from real users or lab data for debugging.

#3about 5 minutes

How to optimize the Largest Contentful Paint (LCP)

Improve LCP by breaking down the loading process into four phases and using techniques like preloading resources and optimizing image formats.

#4about 4 minutes

Preventing Cumulative Layout Shift (CLS) for stability

Avoid visual instability by correctly sizing images, reserving space for dynamic content like ads, and managing web font loading.

#5about 4 minutes

Improving Interaction to Next Paint (INP) responsiveness

Optimize INP by breaking up long JavaScript tasks, deferring non-critical code execution, and simplifying complex DOM structures.

Related jobs
Jobs that call for the skills explored in this talk.

Matching moments

Improving the developer feedback loop with specialized tools
03:16 MIN

Improving the developer feedback loop with specialized tools

Developer Time Is Valuable - Use the Right Tools - Kilian Valkhof

The value of progressive enhancement and semantic HTML
03:31 MIN

The value of progressive enhancement and semantic HTML

WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More

Exploring modern JavaScript performance and new CSS features
08:07 MIN

Exploring modern JavaScript performance and new CSS features

WeAreDevelopers LIVE – AI, Freelancing, Keeping Up with Tech and More

Why you might not need JavaScript for everything
02:33 MIN

Why you might not need JavaScript for everything

WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More

The only frontend stack that truly matters
11:10 MIN

The only frontend stack that truly matters

WeAreDevelopers LIVE – Frontend Inspirations, Web Standards and more

How a broken frontend culture impacts the web
04:02 MIN

How a broken frontend culture impacts the web

WeAreDevelopers LIVE – Frontend Inspirations, Web Standards and more

Navigating the growing complexity of modern CSS
09:00 MIN

Navigating the growing complexity of modern CSS

WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More

Empathizing with users over chasing engagement metrics
05:24 MIN

Empathizing with users over chasing engagement metrics

Slopquatting, API Keys, Fun with Fonts, Recruiters vs AI and more - The Best of LIVE 2025 - Part 2

Featured Partners

Related Videos

See all videos
What you need to know about Core Web Vitals58:59

What you need to know about Core Web Vitals

Ines Akrap

Next.js Unleashed: Optimizing Web Vitals for superior User Experience26:44

Next.js Unleashed: Optimizing Web Vitals for superior User Experience

Eileen Fürstenau

Optimistic UI Updates: Enhancing User Experience and Improving Interaction to Next Paint (INP)20:30

Optimistic UI Updates: Enhancing User Experience and Improving Interaction to Next Paint (INP)

Marc Müller

Catching up on the basics you don't really need that much code14:44

Catching up on the basics you don't really need that much code

Chris Heilmann

The Illusion of a Performant Web Application28:56

The Illusion of a Performant Web Application

Cathrin Möller

Measure and improve frontend performance by using test automation25:38

Measure and improve frontend performance by using test automation

Ramona Schwering

Is your Progressive Web App Lazy? How to read and improve your PWA Performance29:57

Is your Progressive Web App Lazy? How to read and improve your PWA Performance

Laura Morinigo

What’s New and What’s Next in Web UI22:46

What’s New and What’s Next in Web UI

Cleyra Uzcategui

Related Articles

View all articles
DC
Daniel Cranney
Dev Digest 190: GitHub A11Y action, >12s Sora 2 videos and 42 CSS units!
Inside last week’s Dev Digest 190 . 🙅 Developers don’t trust AI, and that’s a good thing 🤖 Why everyone is talking about AI agents 🔓 Autonomous AI hacking and the future of cyber security 😨 Windows 10 support ends, millions of PC’s fall off a securi...
Dev Digest 190: GitHub A11Y action, >12s Sora 2 videos and 42 CSS units!
CH
Chris Heilmann
Dev Digest 116 - WWWAI?
This time, learn how to un-AI Google's search results, what's new on the web, avoid a new security hole and go back to BASICS with us. News and ArticlesWhat a week. Google, Microsoft, OpenAI and many others had their big flagship events announcing th...
Dev Digest 116 - WWWAI?

From learning to earning

Jobs that call for the skills explored in this talk.