1 year ago

In this tutorial we're going to investigate a webpack feature called code splitting. Code splitting will allow you to reduce the size of your main JavaScript file by splitting it up into different files and lazy load these as and when they're required.

Using code splitting you can split up your code into multiple files and only download the files your app needs to display the page. For example if you only use a component on a single page you don't need to load in that component on every page of your app, using code splitting Webpack can lazy load in that component only when it is needed.

Using a webpack comment annotation you can tell webpack to prefetch this by using the following code.