Skip to content

Bundle-splitting tour

One import, every page

The budget report is what found it: pages that render no demo were loading the whole demo module. The cause was three hops of imports — the public layout needed one component, that component lived in a file that imports the demo module, and every route in the group inherited the result. This page shows the before, the after, and where the weight legitimately goes.

Measured from the completed build on 2026-09-12 06:33 UTC (build eoCv1yhT4VQe) by npm run build && npm run measure, and committed as docs/build-report.json. The numbers are not re-derived while the page renders, because a build cannot see its own output.

JS on a page with no demo

743.1 → 429.5 KB

recorded on batch 55 (commit 1fb5142) → batch 60, e.g. /quality, /learn, /community/attribution

/studio main chunk

814.5 → 500.9 KB

after splitting the Pro gate out of the Section 14 demos

Routes at the shell baseline

91

pages whose file set is the shell itself — no chunk of their own

The import that was on every page

The public layout renders <KeyframesStyle />. It used to import it from cards.tsx to get it, and cards.tsx imported the single demo file — so all 80 public routes then shipped 7,416 lines of scenes whether or not they rendered a demo. Both figures are recorded from that build; the scenes are ten modules now.

before:  (public)/layout.tsx → cards.tsx → demos/Demo.tsx        743.1 KB on a page with no demo   [batch 55 (commit 1fb5142)]
after:   (public)/layout.tsx → keyframes.tsx (42 lines)   429.5 KB on the same page   [batch 60]

The keyframes moved into their own module. A page that renders a demo still
loads the scene modules, because it uses them; a page that does not, no longer
pays for them.

Where the weight goes by content type

Catalog bundle sizes are per-asset numbers from the data, not measurements of this build's chunks — a template is a whole page, an element is a control.

Data table — data table
ContentItemsCatalog KBMean
Components289456 KB1.6 KB
Backgrounds3366.6 KB2 KB
Lab tools33

Each route's largest own chunk, with the modules inside it

The client-reference manifest maps a module to the chunks that load it; read backwards it says which modules a chunk carries. The table below takes each route's largest own chunk — the one its own imports pulled in — and names the project modules inside it, so a heavy route is readable instead of a single number. Modules are the client modules the manifest references; server-only code never appears.

Data table — data table
RouteLargest own chunkSizeProject modules inside
/components/[slug]1w7r2o7fcyaey.js191.1 KBsrc/components/asset-detail.tsx
/admin/moderation00e0enjkikj0k.js73.1 KBsrc/app/admin/moderation/page.tsx
/admin/pipeline1keb21a2bqmb4.js50.9 KBsrc/app/admin/assets/page.tsxsrc/app/admin/moderation/page.tsxsrc/app/admin/ops/page.tsxsrc/app/admin/pipeline/page.tsxsrc/app/admin/prompts/page.tsx+5 more
/admin/audit1keb21a2bqmb4.js50.9 KBsrc/app/admin/assets/page.tsxsrc/app/admin/moderation/page.tsxsrc/app/admin/ops/page.tsxsrc/app/admin/pipeline/page.tsxsrc/app/admin/prompts/page.tsx+5 more
/admin/content1keb21a2bqmb4.js50.9 KBsrc/app/admin/assets/page.tsxsrc/app/admin/moderation/page.tsxsrc/app/admin/ops/page.tsxsrc/app/admin/pipeline/page.tsxsrc/app/admin/prompts/page.tsx+5 more
/admin/schedule1keb21a2bqmb4.js50.9 KBsrc/app/admin/assets/page.tsxsrc/app/admin/moderation/page.tsxsrc/app/admin/ops/page.tsxsrc/app/admin/pipeline/page.tsxsrc/app/admin/prompts/page.tsx+5 more
/admin/search1keb21a2bqmb4.js50.9 KBsrc/app/admin/assets/page.tsxsrc/app/admin/moderation/page.tsxsrc/app/admin/ops/page.tsxsrc/app/admin/pipeline/page.tsxsrc/app/admin/prompts/page.tsx+5 more
/admin/duplicates1keb21a2bqmb4.js50.9 KBsrc/app/admin/assets/page.tsxsrc/app/admin/moderation/page.tsxsrc/app/admin/ops/page.tsxsrc/app/admin/pipeline/page.tsxsrc/app/admin/prompts/page.tsx+5 more
/admin/escalation1keb21a2bqmb4.js50.9 KBsrc/app/admin/assets/page.tsxsrc/app/admin/moderation/page.tsxsrc/app/admin/ops/page.tsxsrc/app/admin/pipeline/page.tsxsrc/app/admin/prompts/page.tsx+5 more
/admin/exports1keb21a2bqmb4.js50.9 KBsrc/app/admin/assets/page.tsxsrc/app/admin/moderation/page.tsxsrc/app/admin/ops/page.tsxsrc/app/admin/pipeline/page.tsxsrc/app/admin/prompts/page.tsx+5 more
/admin/stats1keb21a2bqmb4.js50.9 KBsrc/app/admin/assets/page.tsxsrc/app/admin/moderation/page.tsxsrc/app/admin/ops/page.tsxsrc/app/admin/pipeline/page.tsxsrc/app/admin/prompts/page.tsx+5 more
/admin/theme1keb21a2bqmb4.js50.9 KBsrc/app/admin/assets/page.tsxsrc/app/admin/moderation/page.tsxsrc/app/admin/ops/page.tsxsrc/app/admin/pipeline/page.tsxsrc/app/admin/prompts/page.tsx+5 more