Empowering a Performance Culture

on YouTube ↗28m

" summary

Company consolidates 100+ sites into one app and cuts the homepage JS bundle from 360 KB to 27 KB, dropping load from ~13.5s to ~2.5s and improving First Contentful Paint by ~4s. Uses WebPageTest, Lighthouse and Perfume.js for metrics, swaps a JS modal for a CSS URL-based approach, defers code via intersection observer, changes clicks to touchstart shaving ~100ms, wrestles with 125 third‑party requests via tag manager, and ships a PR‑scanning tool called spotter to predict regressions.

AI-written summary · about

" chapters (13)

1. 0:00Introduction and background
2. 2:10Executive buy-in for performance
3. 4:19JavaScript bundle optimization
4. 9:18Third-party scripts impact
5. 11:50Developer awareness approach
6. 15:45Optimizing user interactions
7. 17:33Developer challenges and education
8. 19:21Product and design collaboration
9. 22:50Documenting trade-offs and debt
10. 24:13Legacy code refactoring
11. 25:39Predicting performance regressions
12. 26:42Tools and developer experience
13. 27:27Performance culture beyond code

" related talks

• 48mThink Fast, First: Empowering a Performance CultureAlfredo Lopez · LibertyJS 2019
• 25mGetting your Team Passionate About Web Performance to Achieve Performant Web AppsNicolas Goutay · FrontEnd Con 2018
• 33mPerformance culture. New opportunities with EmbroiderTomek Nieżurawski · EmberFest 2022
• 16mDear non-performant appNishu Goel · Reliable Web Summit 2021
• 37mSecret Shortcuts of Loading Web PerformanceNikola Mitrovic · XtremeJS 2023
• 41mSpeed at Scale: Web Performance Tips and Tricks from the TrenchesAddy Osmani, Katie Hempenius · Google I/O 2019
• 28mPractical PerformancePaul Irish, Sam Saccone · Polymer Summit 2016
• 27mHow we make Web Apps lightning fast at MicrosoftSean Thomas Larkin · JSCamp Barcelona 2019