The Road to Web Performance in 3 Critical Steps
summary
Claims that performance work follows three steps: measure (Chrome DevTools, Lighthouse, PageSpeed, WebPageTest and the Performance API to collect First Contentful Paint, long tasks and Time To Interactive), optimize (defer/async scripts, inline critical CSS, font loading strategies, blurred low‑res placeholders, gzip/http2, preload/preconnect) and be consistent (service worker cache to survive 3G and flaky networks). Udacity applies these on a global site serving millions and confirms the service worker cache actually keeps pages usable offline.
AI-written summary · about
chapters (32)
- 0:00Introduction
- 1:10Expectations
- 2:06What is Performance
- 3:36Why Define Performance
- 4:06Measuring Performance
- 4:33Renown Chrome Dev Tools
- 6:37Page Speed Insights
- 7:30Web Page Test
- 8:46Lighthouse
- 9:35Lab Tests
- 10:40Performance API
- 11:46Long Tasks
- 12:53Time to Interact
- 13:43Optimize
- 14:29Deferring NonCritical Assets
- 15:22JavaScript in Session
- 15:51Deferring Scripts
- 17:09CSS Optimization
- 18:18Media Attribute
- 19:32Phone Optimization
- 21:17Fonts
- 21:32Images
- 22:43Network Optimization
- 23:03HTTP
- 24:04Preload
- 24:50Network Consistency
- 25:14Life I Offline
- 25:38Service Workers
- 26:04Workbox
- 26:40Summary
- 26:54Step 1 Measure
- 27:12Be Consistent
related talks
32mEverything you need to know about Web Performance
22mNew Perspectives on Performance
01h 04mNeed for speed 8, performance tuning of your web application
29mHigh Performance in the Critical Rendering Path
25mGetting your Team Passionate About Web Performance to Achieve Performant Web Apps
16mFrom Beginner to Expert in Web Performance
31mWe're All Doing the Best We Can
49mDemystifying web performance tooling and metrics