esbuild-lazy-analyzer

1.4.0 verified Fri May 01 auth: no javascript

A CLI tool (v1.4.0, active development) that analyzes lazy-loading in esbuild chunk splits using the metafile output. It generates static JSON statistics and interactive HTML dependency graphs showing chunk composition, eager vs lazy imports per entry point, length of dependency chains, and file-level bundle impact. Unlike general esbuild visualizers (e.g., esbuild-visualizer), this focuses on code-splitting optimization, showing which chunks are lazy-loaded and their sizes, enabling developers to identify opportunities for improved lazy-loading. It produces a self-contained HTML report with interactive import graphs and modals for per-file import inspection.

Common errors

error Error: The specified metafile does not exist. ↓

cause The --metafile path is incorrect or the file wasn't generated.

fix

Verify the path and re-run esbuild with --metafile to create the metafile.

error Error: No data found in the metafile's outputs. ↓

cause The metafile is valid but doesn't contain output chunks (e.g., splitting not enabled).

fix

Run esbuild with --splitting and --format=esm to generate multiple chunks.

Warnings

gotcha The --metafile must be produced with esbuild's splitting enabled; otherwise, there is only one chunk and analysis is trivial. ↓

fix Ensure esbuild run with --splitting flag: npx esbuild ... --splitting

gotcha At least one of --outmeta or --outreport is required; the tool will error if neither is provided. ↓

fix Add --outmeta path.json or --outreport path.html (or both).

gotcha The tool generates HTML with relative imports for D3; the report must be served via HTTP (not file://) to display graphs correctly. ↓

fix Use a local server (e.g., npx serve .) to open the report.

Install

npm install esbuild-lazy-analyzer

yarn add esbuild-lazy-analyzer

pnpm add esbuild-lazy-analyzer

Imports

esbuild-lazy-analyzer
wrong
```
npm run esbuild-lazy-analyzer
```
correct
```
npx esbuild-lazy-analyzer --metafile meta.json --outreport report.html
```
Tool is a CLI, not a library. Use npx or install globally and run directly. No JavaScript API is exported.

Quickstart

Generate an esbuild metafile and run the analyzer to produce an interactive HTML report.

// Build with esbuild and output metafile
npx esbuild src/index.js --bundle --splitting --format=esm --outdir=dist --metafile=meta.json

// Analyze lazy-loading
npx esbuild-lazy-analyzer --metafile meta.json --outreport report.html

// Open report.html in browser