In short, code splitting is just about not loading a whole element, but loading only part of it. When you are reading this page, you don’t have to load the whole site. When you are selecting a single row from a database – you don’t have to take all the data. Obvious? Code splitting is also quite obvious, it is not just about your data, but your code.
No – it’s just using it. Code splitting is done on a bundler level – webpack, parcel, or just your file system in the case of “native” esm modules. Code splitting is just files, files you can load somewhere “later”.
React.lazy
is using it. Just using code splitting of your bundler. Just calling import
when got rendered. And that’s all.
React.lazy
superseded it. And provided more features, like Suspense
to control loading state. So — use React.Lazy
instead.