Building Large-Scale Web Apps
summary
Uses React and ecosystem tooling — create-react-app, Next.js, Gatsby — and concrete patterns: route-level code splitting with react lazy and suspense, preload-on-hover and idle using requestIdleCallback and Network Information API, and centralized route config for consistent meta, layout and animations. Moves instrumentation out of UI into an app-level beacon handling layer so tracking systems swap without touching components. Claims: handles sudden spikes (up to 20x), reduces duplicated conditional UI logic, and makes progressive performance fixes broadly deployable.
AI-written summary · about
chapters (22)
- 0:00Introduction
- 0:30About me
- 1:24Traffic
- 2:40Enhancements
- 3:21Code Complexity
- 4:34Framework
- 7:33Why do we need abstraction
- 8:35Build a common component
- 9:11Common components by purpose
- 9:32Styling sharing
- 16:12Logic abstraction
- 17:03Instrumentation
- 17:52OnClick
- 18:12OnClick Beacon
- 18:49Single Component Reusable
- 20:11App Level Beacon Handling
- 22:18Routing
- 22:31React Router
- 24:17Route Configuration
- 25:15Preload Logic
- 26:58Network Information API
- 28:00Start from highlevel abstraction
related talks
52mBuilding Modern React Applications
31mSpeeding up Startup for Large React Apps
33mMaximising performance with React code-splitting techniques
39mMaking Your React Apps Perform At Scale
33mBuilding modern React applications
26mLightning Fast React Apps
25mScaling React.js Applications
49mWhy I bet my business on React