Using the lazy API
There are two pieces involved with using the lazy() API in React. First, there’s bundling components into their own separate files so that they can be downloaded by the browser separately from other parts of the application. Second, once you have created the bundles, you can build React components that are lazy: they don’t download anything until they are needed. Let’s look at both of these.
Dynamic imports and bundles
The code examples in this book use the Vite tooling for creating bundles. The nice thing about this approach is that you don’t have to maintain any bundle configuration. Instead, bundles are created for you automatically, based on how you import your modules. If you’re using the plain import statement (not to be confused with the import method) everywhere, your app will be downloaded all at once in one bundle. When your app gets bigger, there will likely be features that some users never use or don’...
