Progressive React
summary
Create React App boots a ~33 KB gzipped bundle; on a Moto G4 it loads ~2s on 4G and ~4+ s on 3G slow. HTTP Archive shows median mobile JS rising from ~50 KB (2011) to ~360 KB now; a sampled set of React sites shows median First Paint ~4.7 s and Time to Interactive ~20.5 s. Practical fixes include code-splitting with dynamic imports and react-loadable or lazy/suspense, profiling with the React Profiler and Lighthouse, service worker caching via Workbox, and bundle inspection with webpack analyzers.
AI-written summary · about
chapters (10)
- 0:00Start
- 3:46There's no such thing as a slow site
- 4:59what's the current state of speed?
- 8:32Profile / Analyze
- 12:20Higher level concerns
- 16:04route / component
- 18:31suspense
- 19:36cache things worth caching?
- 22:20CSS-in-JS?
- 23:19extract critical styles (if you SSR)
related talks
24mHoussein Djirdeh - Progressive React
25mDesigning High Performance React Applications
32mPractical Performance Tips Building Progressive Web Apps
18mA Guide to Instant Loading Angular Apps
06mHow to React in the Slow Lane
21mMaking Your React Apps Perform At Scale
26mLightning Fast React Apps
29mReact to the Need for Speed