React.lazy: Load Components On Demand
React.lazy tells your app: "Don't download this component's code until it's needed." It's a core tool for code splitting. Use it for below-the-fold content or modals to speed up initial load. The footgun: forgetting `<Suspense>` will crash your app.
React.lazy is like telling your app: "Don't download this component's code until it's actually needed." This enables code splitting, sending users only the JavaScript required for the initial view. It's ideal for components not immediately visible, like modals or complex dashboards, improving initial load times. The footgun: you must wrap a lazy component in `<Suspense fallback={...}>`. Forgetting it means React has no loading UI to show and will crash the component tree.
Read the original → react.dev
- #react
- #performance
- #code-splitting
- #suspense
Get five bites like this every day.
Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.