Why does React.lazy need a default export?
Because React.lazy expects the dynamic import to resolve to a module with a default export. If your component uses a named export, wrap it in the import to re-export it as default, or reconfigure the component's export.
Verify This Answer
Cross-check this information using these trusted sources:
More FAQs in Lazy Loading Components in React: Best Practices With Suspense
Most impactfully, route-level components. Users only download the code for the page they visit, which keeps the first load small. Avoid lazy loading tiny components that are used immediately, as that adds overhead without benefit.
Yes. Every lazy component must be wrapped in a Suspense with a fallback. Without a fallback, React has nothing to show while the code loads, and you get an error instead of a loading state.
Around routes or large independent sections, not around every tiny component. Too many boundaries add overhead; too few give a poor loading experience. Place them where a fallback makes sense to the user.
Still have questions?
Browse all our FAQs or reach out to our support team