igniteui-react-optimize-bundle-size
Installation
SKILL.md
Optimizing Ignite UI for React Bundle Size
Standard React techniques (React.lazy + Suspense, route splitting, minification, compression, bundle analyzers) apply unchanged. This skill covers only what is specific to Ignite UI.
Where the weight is
igniteui-react is published with "sideEffects": false and per-component modules, so named imports tree-shake well — a handful of core components costs little. The heavy families are separate packages:
| Package | Weight | Notes |
|---|---|---|
igniteui-react |
light per component | core UI; tree-shakes cleanly |
igniteui-grid-lite |
small | MIT grid; far lighter than the premium grids |
igniteui-react-grids |
heavy | Data/Tree/Pivot/Hierarchical grid |
igniteui-react-charts / -maps / -gauges |
heavy | legacy DV packages, weaker tree-shaking |
Two conclusions: install only the families you use, and split the heavy families out of the initial chunk. Downgrading IgrGrid to IgrGridLite is often the single largest win when the app only displays flat, read-only data — check the feature list in DATAVIZ.md first.