CODEWITHSUNDEEP
reactjswebpacklazy-loading
mikenlanggio
mikenlanggio

Reputation: 1137

Should I use dynamic import for my entire app?

I have a React app and my bundle getting bigger and bigger.

-Should i use dynamic import (React.lazy) for entire my app?

-Can i use one React.Suspense (It will surround the App tag) for entire my app?

Thank for your help

Upvotes: 3

Views: 246

Answers (1)

winwiz1
winwiz1

Reputation: 3174

  • You can split yout app into multiple SPAs, each with it own smaller bundle.

  • Perform bundle minification in production build - this can be done without any impact on your ability to debug the bundle.

  • Separate the dependencies (including React library) into a separate bundle and ensure it doesn't need to be reloaded when client switches from one SPA to another.

crisp-react is a boilerplate project that demonstrates all these techniques.

P.S.
Using dynamic imports is beneficial when, for example, the Reporting SPA consists of 10 reporting components and you know the Component7 will be used by few people and/or infrequently. Then it's a good candidate for dynamic import.

Upvotes: 3

Related Questions