Generally, code splitting is one of the most compelling features of webpack. This feature facilitates us to split our code into various bundles, which can be loaded only on-demand or in parallel. This is mainly used to achieve the smaller bundles and facilitates us to control resource load prioritization which finally has a great impact on the load time.
There are mainly three approaches to code splitting :
Entry Points : It is used to split code using entry configuration manually.
Prevent Duplication : It uses Entry dependencies or SplitChunksPlugin to dedupe and split chunks.
Dynamic Imports : It splits the code via inline function calls within modules
It is mainly used to enable pages that can never load unnecessary code.