Tree shaking is basically a term used by module bundlers such as WebPack and Rollup to convey that the import-export module syntax can be used for dead-code elimination.
Essentially, the new module loader system enables these module bundlers to do something known as tree shaking, where they shake the tree to get rid of the dead leaves.
Your JavaScript is a tree. The modules you import represent the living leaves of your tree. The dead (unused) code is represented by the brown, dead leaves of the tree. To remove dead leaves, the bundler has to shake the tree and let them fall.
Tree shaking, used by a module bundler, eliminates unused code in the following manner:
- Firstly, the bundler will combine all of the imported module files (like a good bundler). Here, exports that are not imported in any file are not exported at all.
After that, the bundler minifies the bundle and simultaneously removes dead code. Thus, variables/functions that are not exported...