What is tree shaking

Tree shaking is a form of dead code elimination. It means that unused modules will not be included in the bundle during the build process and for that it relies on the static structure of ES2015 module syntax,( i.e. import and export). Initially this has been popularized by the ES2015 module bundler rollup, these days practically all bundlers use this technique.

Practical Code Example

// Tree Shaking (Dead Code Elimination):
// math.js
export const add = (a, b) => a + b;
export const unusedHugeMathFunction = () => { /* 50KB code */ };

// main.js
import { add } from './math.js';
console.log(add(2, 3));
// Bundler (Webpack/esbuild/Rollup) strips 'unusedHugeMathFunction' from production bundle!