Route-based & Component-level Splitting
Split by route (screen-level) and split inside screens (widget-level). Use Suspense near the slow area so the rest stays interactive.
Two levels: route & widget
Aim: Split routes (whole screens) and widgets (heavy parts inside a screen). Keep fallbacks local so the page stays usable.
Where to split & why
- Route-based: split big pages
- Component-level: split charts/editors
- Place Suspense tight to the slow area
All lessons in this course
- React.lazy and Suspense — Lazy Components
- Route-based & Component-level Splitting
- Bundles, Cache & Preloading Hints