FurkanO
FurkanO

Reputation: 7298

How does Webpack's code splitting work

I know little bit about webpack, but can not find a simple answer to my question. What does code splitting with Webpack mean?

Is it creating individual bundle js files for different routes and performing ajax operations for getting these js files when requested by the client.

Or is it performing async calls for getting other individual js files from server after showing the first requested page properly after the first hit?

Before I learn how to do, I would like to have an idea about what I am learning. Webpack docs doesn't help at all. It assumes you fully understand how webpack works.

Upvotes: 2

Views: 408

Answers (1)

mikey
mikey

Reputation: 236

Code splitting splits up your app into multiple bundled js. For example if you had a admin section to your app which your users will never see you can split it up into 2 bundles, this way users will not download the admin related js.

The actual loading of bundled js is done by script tag injection.

When the actual loading should be done is handled by the router. If you are using react-router this is a quick example.

Hope this helps somewhat.

Upvotes: 3

Related Questions