Tree Shaking

Definition

Elimination du code mort par les bundlers (Webpack, Rollup, esbuild) basee sur l'analyse statique des imports ESM. Seuls les exports effectivement importes sont inclus dans le bundle final.

Analogie

Secouer un arbre pour ne garder que les fruits murs (code utilise) et laisser tomber les feuilles mortes (code inutilise).

Exemple de code

// utils.js
export const used = () => 'kept';
export const unused = () => 'removed';

// app.js
import { used } from './utils';
// unused est elimine du bundle

Cas d'usage

Reduire la taille des bundles en production, surtout avec de grosses librairies comme lodash.

Anti-pattern

Termes lies