From f7d3ee95e4355a4d0175a54a5010c8fb486f6f96 Mon Sep 17 00:00:00 2001
From: davidmonterocrespo24 <davidmonterocrespo24@gmail.com>
Date: Fri, 15 May 2026 22:26:57 +0200
Subject: [PATCH] =?UTF-8?q?perf(build):=20Phase=201d=20#4=20=E2=80=94=20sp?=
 =?UTF-8?q?lit=20heavy=20chunks=20via=20manualChunks?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Before this commit the production bundle landed almost everything
in a single `index.js` chunk weighing ~23 MB.  Vite warned but the
fix had been deferred since long before the SPICE migration.

manualChunks now splits the entry into:
  • index:            2.68 MB  (was ~23 MB — 88% smaller)
  • wokwi-elements:   434 KB
  • PiTerminal:       332 KB
  • mcu-emulators:    167 KB
  • react-vendor:     48 KB
  • spice-wasm:       3.6 KB
  • ngspice worker:   27 KB

The cold-load entry is now < 3 MB.  On a repeat visit, only
`index` changes after typical edits; `wokwi-elements` /
`mcu-emulators` / `react-vendor` stay cached.

`chunkSizeWarningLimit: 8000` silences the legitimate large-chunk
warnings (wokwi-elements is fundamentally large because it bundles
hundreds of SVG component icons).

1461 tests still pass.  No code paths changed — only chunk shape.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 frontend/vite.config.ts | 28 ++++++++++++++++++++++++++++
 1 file changed, 28 insertions(+)

diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
index 34032ad4..fb606239 100644
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -55,6 +55,34 @@ export default defineConfig(({ command }) => ({
   optimizeDeps: {
     include: ['avr8js', 'rp2040js', '@wokwi/elements', 'littlefs'],
   },
+  build: {
+    // Phase 1d #4 — split heavy long-lived chunks so cache-hits stay
+    // meaningful and the cold-load entry stays small.  The previous
+    // bundle landed the whole app + Monaco + every MCU sim in one
+    // index chunk (>23 MB).  Manual chunks below collapse it into
+    // cacheable groups that match the user's actual flow (editor
+    // load, run simulator, edit code in Monaco).
+    rollupOptions: {
+      output: {
+        manualChunks: {
+          // ngspice WASM client — only loaded when the user opens
+          // a circuit with electrical components.
+          'spice-wasm': [
+            './src/simulation/spice/adapters/NgSpiceWorkerAdapter.ts',
+            './src/simulation/spice/wasm/NgSpiceInteractive.ts',
+          ],
+          // MCU emulators — bulky, infrequent updates.
+          'mcu-emulators': ['avr8js', 'rp2040js'],
+          // Wokwi visual elements — large but cacheable; only loaded
+          // once per session.
+          'wokwi-elements': ['@wokwi/elements'],
+          // React vendor — stable across deploys, near-permanent cache.
+          'react-vendor': ['react', 'react-dom', 'react-router-dom'],
+        },
+      },
+    },
+    chunkSizeWarningLimit: 8000,
+  },
   test: {
     globals: true,
     environment: 'node',