R is for React Performance
summary
Walks through concrete levers and outcomes: uses WebPageTest and browser APIs to show images drive LCP failures (only 55% good LCP, two and a half seconds threshold), page weight sits around four megabytes at the 75th percentile and near eight at the 90th, many sites still serve assets on HTTP/1.1, some pages make ~800 requests, and heavier pages increase internet emissions (~1–2%). Recommends Brotli, AVIF, fetch-priority/prefetch/preload, Network Information API, user-timing marks, and continuous measurement and monitoring to actually improve load behavior.
AI-written summary · about
chapters (26)
- 0:00Web performance literacy
- 1:05Core web performance
- 2:11AVIF images benefits
- 2:32Brotli compression
- 3:13Core Web Vitals
- 4:37Carbon emissions impact
- 6:23GIF challenges
- 7:29HTTP/2 vs HTTP/1.1
- 8:55Modern image format challenges
- 10:00JPEG history
- 11:03Page weight optimization
- 12:08Largest Contentful Paint
- 14:15Measuring performance
- 15:39Network Information API
- 17:25Offline capabilities
- 18:30Prefetching resources
- 20:20Quick protocols
- 20:42Reduce requests
- 21:49Speed Index
- 22:31Time to First Byte
- 23:13User Timing API
- 23:57Velocity conference
- 24:38WebPageTest tool
- 25:41User experience goal
- 26:25Why Slow tool
- 27:08Performance career impact
related talks
32mAnatomy of a Modern Page Load
27mSlashing Performance Bottlenecks and Poor User Experience
49mDemystifying web performance tooling and metrics
36mNobody cares about web performance. It's hard, expensive and unneeded
32mStay Away From My Path!
35mRevitalising the Web - The Importance of Web Performance
08mThe Performance Alphabet
27mOptimizing the Critical Rendering Path in React