Sign in to confirm you’re not a bot
This helps protect our community. Learn more

Optimize for Core Web Vitals

Chrome for Developers
778K subscribers
<__slot-el>
<__slot-el>
175K views 4 years ago #DevTools #webdevLIVE #corewebvitals
In this hands-on talk, we cover tips & tricks for optimizing your user-experience to meet the Core Web Vitals. We use tools like Lighthouse & DevTools, show you code snippets for fixes, and highlight how you too can get fast and stay fast. Optimizing for quality of user experience is key to the long-term success of any site on the web. Whether you're a business owner, marketer, or developer, Core Web Vitals can help you quantify the experience of your site and identify opportunities to improve. Resources: Optimize Largest Contentful Paint &acirc;&#134;&#146; https://goo.gle/31sn6qo Optimize First Input Delay &acirc;&#134;&#146; https://goo.gle/38h3FlJ Optimize Cumulative Layout Shift &acirc;&#134;&#146; https://goo.gle/3i6g9kH Related Playlist: Day 1 &acirc;&#134;&#146; https://goo.gle/WDL20Day1 Subscribe to the Chrome Developers &acirc;&#134;&#146; https://goo.gle/ChromeDevs Speaker: Addy Osmani #webdevLIVE #corewebvitals #DevTools event: web.dev LIVE 2020; re_ty: Publish; fullname: Addy Osmani; product: Chrome - General; ...more
...more
These chapters are auto-generated

Introduction

0:00

Core Web Vitals

0:33

Aspect Ratio

3:30

Dynamic Content

10:25

Production Example

12:26

Image Elements

19:58

De defer JavaScript and CSS

26:09

Render blocking resources

26:29

Critical CSS

27:06

Chloe

28:02

Results

29:27

Server Response Times

29:56

Reduce Initial Server Response Time

30:22

Server Push

31:06

Automatic Server Push

32:28

Automatic Server Push syntax

32:50

Automatic Server Push results

33:26

Forced Input Delay

33:58

First Input Delay

34:08

What Causes a Poor First Input Delay

34:26

Using Dev Tools

34:48

Chloes Results

35:31

Chrome User Experience Report

36:07

Chrome User Experience Report Dashboard

36:37

Chrome User Experience Report API

37:10

Outro

37:25
Optimize for Core Web Vitals
3.1KLikes
175,259Views
2020Jul 8
In this hands-on talk, we cover tips & tricks for optimizing your user-experience to meet the Core Web Vitals. We use tools like Lighthouse & DevTools, show you code snippets for fixes, and highlight how you too can get fast and stay fast. Optimizing for quality of user experience is key to the long-term success of any site on the web. Whether you're a business owner, marketer, or developer, Core Web Vitals can help you quantify the experience of your site and identify opportunities to improve. Resources: Optimize Largest Contentful Paint &acirc;&#134;&#146; https://goo.gle/31sn6qo Optimize First Input Delay &acirc;&#134;&#146; https://goo.gle/38h3FlJ Optimize Cumulative Layout Shift &acirc;&#134;&#146; https://goo.gle/3i6g9kH Related Playlist: Day 1 &acirc;&#134;&#146; https://goo.gle/WDL20Day1 Subscribe to the Chrome Developers &acirc;&#134;&#146; https://goo.gle/ChromeDevs Speaker: Addy Osmani #webdevLIVE #corewebvitals #DevTools event: web.dev LIVE 2020; re_ty: Publish; fullname: Addy Osmani; product: Chrome - General;

Follow along using the transcript.

Chrome for Developers

778K subscribers