perf: split vendor bundle into lazy chunks via manualChunks by adm01-debug · Pull Request #145 · adm01-debug/zapp-web

adm01-debug · 2026-05-20T03:32:08Z

Summary

Adds a manualChunks function to vite.config.ts that bins every major node_modules library into its own named, separately-cacheable chunk
26 named vendor chunks (vendor-react, vendor-radix, vendor-tanstack, vendor-supabase, vendor-framer, vendor-icons, vendor-i18n, vendor-sentry, vendor-mapbox, vendor-sip, vendor-elevenlabs, vendor-forms, vendor-date, vendor-pdf, vendor-zod, vendor-dnd, vendor-virtual, vendor-ui-utils, vendor-xlsx, vendor-panels, vendor-dompurify, vendor-protobuf, vendor-hotkeys, vendor-utils, vendor-polyfills, vendor-router) + vendor-misc catch-all
Includes motion-dom and motion-utils alongside framer-motion (framer-motion v12 ships these as separate npm packages)

Result

Chunk	Before	After
index (app code)	5,013 KB / 1,410 KB gzip	1,075 KB / 303 KB gzip
vendor-mapbox	—	1,677 KB (mapbox-gl, unavoidable)
vendor-misc	—	941 KB / 262 KB gzip
All other vendor chunks	—	< 400 KB each

78% reduction in main app chunk. Each vendor chunk is independently cacheable between deploys.

Test plan

npm run build succeeds (37s)
48/48 tests passing
TypeScript: 0 errors
chunkSizeWarningLimit set to 600 KB — mapbox-gl and vendor-misc exceed it but are expected (mapbox-gl is an unavoidable 1.6 MB blob; vendor-misc contains core-js polyfills)

https://claude.ai/code/session_01Gwdas9LekmByg4mbQzymUr

Generated by Claude Code

Summary by cubic

Split vendor code into lazy, named chunks using vite manualChunks to shrink the main app bundle and improve caching. Main chunk reduced by 78% (5,013 KB → 1,075 KB; gzip 1,410 KB → 303 KB), with vendor chunks cached across deploys.

Performance
- Added manualChunks in vite.config.ts to group major node_modules libs into separate vendor-* chunks (+ vendor-misc).
- Included motion-dom and motion-utils alongside framer-motion v12.
- Known large chunks: vendor-mapbox (~1.6 MB) and vendor-misc (polyfills like core-js).
- chunkSizeWarningLimit set to 600 KB; build and tests pass.

^{Written for commit 106acbe. Summary will update on new commits. Review in cubic}

Summary by CodeRabbit

Chores
- Aprimorada a configuração de otimização de build com novo limite de aviso de tamanho de chunk definido para 600KB e estratégia inteligente de segmentação de bibliotecas de terceiros em chunks especializados por categoria (framework, roteamento, componentes UI, processamento de dados, entre outros), resultando em melhor aproveitamento do cache do navegador e carregamento mais eficiente da aplicação.

Single index chunk had grown to ~5 MB (1.4 MB gzip) because all node_modules fell into one Rollup output chunk. This adds a manualChunks function that bins every major library into its own named chunk (vendor-react, vendor-radix, vendor-tanstack, vendor-supabase, vendor-framer, vendor-icons, vendor-i18n, vendor-sentry, vendor-mapbox, vendor-sip, vendor-elevenlabs, vendor-forms, vendor-date, vendor-pdf, vendor-zod, vendor-dnd, vendor-virtual, vendor-ui-utils, vendor-xlsx, vendor-panels, vendor-dompurify, vendor-protobuf, vendor-hotkeys, vendor-utils, vendor-polyfills, vendor-router). Result: app chunk 5 013 KB → 1 075 KB (gzip 1 410 KB → 303 KB). All vendor chunks are separately cacheable. Tests 48/48 pass. https://claude.ai/code/session_01Gwdas9LekmByg4mbQzymUr

vercel · 2026-05-20T03:32:13Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
zapp-web	Ready	Preview, Comment	May 20, 2026 3:32am

coderabbitai · 2026-05-20T03:32:14Z

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 18f543eb-d38e-4811-8604-506543035b08

📥 Commits

Reviewing files that changed from the base of the PR and between 6d69f88 and 106acbe.

📒 Files selected for processing (1)

vite.config.ts

Walkthrough

O PR otimiza a estratégia de divisão de chunks do Vite para produção. Altera a assinatura do callback defineConfig e implementa manualChunks baseado em regras para agrupar dependências de node_modules em chunks de vendor categorizados, reduzindo aviso de tamanho para 600KB.

Changes

Otimização de chunks Vite

Layer / File(s)	Resumo
Assinatura do callback e estratégia de manualChunks `vite.config.ts`	Ignora parâmetro de entrada `_env`, ativa `chunkSizeWarningLimit: 600` e implementa lógica granular de `manualChunks` para rotear bibliotecas principais em chunks vendor-específicos (React, router, UI frameworks, Supabase, i18n, charts, Mapbox, Sentry, forma, validação, utilitários e polyfills) com fallback `vendor-misc`.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

✨ Finishing Touches

📝 Generate docstrings

Create stacked PR
Commit on current branch

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

cubic-dev-ai

No issues found across 1 file

_{Tip: cubic could auto-approve low-risk PRs like this, if it thinks it's safe to merge. Learn more

Re-trigger cubic}

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 106acbe3de

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

chatgpt-codex-connector · 2026-05-20T09:57:47Z

+          ) return "vendor-polyfills";
+
+          // Everything else in node_modules goes to a single misc vendor chunk
+          return "vendor-misc";


Avoid circular dependency between vendor chunks

The catch-all vendor-misc assignment creates a circular chunk graph with vendor-react (the current build emits Circular chunk: vendor-misc -> vendor-react -> vendor-misc), which means React core now depends on the misc bundle and defeats intended isolation/caching while risking brittle init order across chunks. This is introduced by routing all unmatched node_modules modules into one bucket; React’s transitive deps should stay in the React chunk (or be excluded from the misc catch-all) to break the cycle.

Useful? React with 👍 / 👎.

chatgpt-codex-connector · 2026-05-20T09:57:47Z

+          if (!id.includes("node_modules")) return;
+
+          // React core — smallest, cached permanently
+          if (/\/react\/|\/react-dom\/|\/scheduler\//.test(id)) return "vendor-react";


* Narrow React-core matcher to avoid capturing scoped /react libs

The React rule if (/\/react\/|\/react-dom\/|\/scheduler\//.test(id)) is overly broad and matches scoped packages that end with /react/ (e.g. @elevenlabs/react, @sentry/react) before their dedicated chunk rules run. With function-form manualChunks, this causes unintended dependency merging and cross-chunk links (in this build, vendor-react imports vendor-elevenlabs), which hurts caching boundaries and can force optional SDK code into the React chunk path. Restrict this matcher to the actual React packages (or move scoped */react rules ahead of it).

Useful? React with 👍 / 👎.

vercel Bot deployed to Preview May 20, 2026 03:32 View deployment

adm01-debug marked this pull request as ready for review May 20, 2026 09:52

Copilot AI review requested due to automatic review settings May 20, 2026 09:52

adm01-debug merged commit e206876 into main May 20, 2026
5 of 10 checks passed

cubic-dev-ai Bot reviewed May 20, 2026

View reviewed changes

chatgpt-codex-connector Bot reviewed May 20, 2026

View reviewed changes

adm01-debug review requested due to automatic review settings May 20, 2026 10:15

adm01-debug mentioned this pull request May 20, 2026

feat(audit): sessão Maestro 2026-05-12 — RLS 100%, FK órfãos limpos, guardas anti-órfão #147

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

perf: split vendor bundle into lazy chunks via manualChunks#145

perf: split vendor bundle into lazy chunks via manualChunks#145
adm01-debug merged 1 commit into
mainfrom
claude/fix-chunk-size

adm01-debug commented May 20, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

vercel Bot commented May 20, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot commented May 20, 2026 •

edited

Loading

Review failed

Uh oh!

Uh oh!

cubic-dev-ai Bot left a comment

Uh oh!

chatgpt-codex-connector Bot left a comment

Uh oh!

chatgpt-codex-connector Bot May 20, 2026

Uh oh!

chatgpt-codex-connector Bot May 20, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

adm01-debug commented May 20, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Result

Test plan

Summary by cubic

Summary by CodeRabbit

Uh oh!

vercel Bot commented May 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot commented May 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review failed

Walkthrough

Changes

Estimated code review effort

Uh oh!

Uh oh!

cubic-dev-ai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

adm01-debug commented May 20, 2026 •

edited by coderabbitai Bot

Loading

vercel Bot commented May 20, 2026 •

edited

Loading

coderabbitai Bot commented May 20, 2026 •

edited

Loading