plugin-bundle-size

Grafana plugin bundle size optimisation module.js is the render-blocking entry point for every Grafana app plugin. The smaller it is, the less impact the plugin has on Grafana's overall startup time. A well-split plugin should have a module.js under ~200 KB that contains nothing but lazy-loaded wrappers — all feature code loads on demand. Target: ~15–25 JS chunks total. Fewer means too little splitting; far more (50+) means over-engineering. Risk levels Not all splitting opportunities carry the same risk. Apply them in this order: Level What Risk Impact Safe module.tsx lazy wrappers (Priority 1) Very low — no behaviour change Highest — module.js drops 90%+ Safe Route-level lazy() (Priority 2) Low — each route is self-contained High — one chunk per route Safe Extension lazy() (Priority 3) Low — extensions are isolated Medium — independent chunk per extension Moderate Component registries / tab panels (Priority 4) Medium — verify Suspense placement Medium — splits heavy pages further Do not touch Vendor libraries ( @grafana/scenes , @reduxjs/toolkit ) N/A N/A — webpack splits these automatically Do not touch Shared utility components (Markdown, Spinner) used across many files High churn, many callsites Low — already in shared vendor chunks Show more