12 Frontend Developer Mistakes or How to Optimize an Existing Product
summary
A collection of thirty live frontend optimization case studies across 30 production sites, showing concrete before/after metrics (e.g. 355 requests and 18s to usable content vs 51 requests and 1s). Practical tools and fixes covered include Critical CSS, Picture/srcset, Chrome Audits, prefetch/DNS-prfetch, HTTP/2 tradeoffs, and removing unsafe cookie hacks, with demonstrated lifts in interaction and revenue.
AI-written summary · about
chapters (17)
- 0:00Introduction
- 1:45What is optimization
- 3:33Too many HTTP requests
- 6:28HTTP/2 features and limits
- 7:13Unoptimized rendering
- 9:25Extra content bytes
- 12:15Wrong sharding use
- 13:43Unsafe code and cookies
- 16:12No user action prediction
- 18:05Ignoring rendering
- 19:22Unnecessary HTTP redirects
- 21:07Interface errors 9 & 10
- 24:36Uninformative error messages
- 26:23Poor navigation
- 27:52Successful page components
- 31:44Optimization results
- 32:28Q&A
related talks
48mBecome a Frontend Developer Ninja using HTML5, JS and CSS3
49mClient-side optimization checklist
28mFantastic Frontend Performance Tricks & Why We Do Them
01h 04mNeed for speed 8, performance tuning of your web application
39mFrom make it work to make it fast: quick wins to boost your application
31mThe Future of Front-End Performance
56mFrontend Performance Optimization
46mTesting frontend in 2019