Nicolas Frizzarin
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
18:40 MIN
Understanding the Core Web Vitals user experience metrics
Measure and improve frontend performance by using test automation
05:17 MIN
Introducing the three Core Web Vitals metrics
What you need to know about Core Web Vitals
03:53 MIN
Explaining the importance of Core Web Vitals
Next.js Unleashed: Optimizing Web Vitals for superior User Experience
23:40 MIN
Focusing on the right metrics for SPA performance
Lessons learned from building a thriving Vue.js SaaS application
01:58 MIN
Introducing Interaction to Next Paint as a Core Web Vital
Optimistic UI Updates: Enhancing User Experience and Improving Interaction to Next Paint (INP)
16:18 MIN
Measuring the impact on Largest Contentful Paint (LCP)
Blazing Fast Page Navigation with Speculation Rules
00:05 MIN
Understanding perceived performance and Core Web Vitals
Optimistic UI Updates: Enhancing User Experience and Improving Interaction to Next Paint (INP)
06:47 MIN
Understanding key frontend performance metrics and KPIs
Frontend Performance Testing in practice
Featured Partners
Related Videos
58:59What you need to know about Core Web Vitals
Ines Akrap
26:44Next.js Unleashed: Optimizing Web Vitals for superior User Experience
Eileen Fürstenau
20:30Optimistic UI Updates: Enhancing User Experience and Improving Interaction to Next Paint (INP)
Marc Müller
14:44Catching up on the basics you don't really need that much code
Chris Heilmann
25:38Measure and improve frontend performance by using test automation
Ramona Schwering
28:56The Illusion of a Performant Web Application
Cathrin Möller
29:57Is your Progressive Web App Lazy? How to read and improve your PWA Performance
Laura Morinigo
22:46What’s New and What’s Next in Web UI
Cleyra Uzcategui
Related Articles
View all articles
From learning to earning
Jobs that call for the skills explored in this talk.
Performance Analyst (Google and Power BI)
Digital Skills Ltd
€78K
Data analysis
Google Analytics
Microsoft Office
Google Tag Manager
Technical Program Manager, Core Data, Analytics and Insights
€51K
Senior
Core Data
Data analysis
Machine Learning
Web- & Digital Designer - Figma, Elementor & Performance Design
Liftoff Marketing GmbH
Remote
€42K
Intermediate
HTML
Figma
WordPress
+3