admin/ServerKit
1
0 Fork 0
mirror of https://github.com/jhd3197/ServerKit.git synced 2026-10-23 03:27:43 +09:00
Code Issues Packages Projects Releases Wiki Activity

Stop every page preloading charts and flow

Browse Source 
Rolldown's manualChunks shim lets a group capture its dependencies, so
recharts pulled React core into vendor-charts and @xyflow claimed
helpers i18n needs; the entry, Login included, preloaded both chunks.
Priority groups give React first claim and keep charts/flow to their
own package. Entry preload: 2.41 MB -> 1.85 MB (726 -> 573 KB gz).
This commit is contained in:
Juan Denis committed 2026-10-10 13:31:03 -04:00
1 parent fbed88ea35
commit ae3d56d260
1 file changed
+17 -15
Download Patch File Download Diff File Expand all files Collapse all files
frontend/vite.config.js
+17 -15
View File
@@ -114,21 +114,23 @@ export default defineConfig(({ mode }) => {
sourcemap: false,
rollupOptions: {
output: {
// Vite 8 bundles with rolldown, which only accepts the
// FUNCTION form of manualChunks (the object form that
// Rollup allowed throws "manualChunks is not a function").
// Match on node_modules path so each listed package — plus
// its private deps — lands in one cohesive vendor chunk.
// Anything unmatched falls through to Vite's default
// chunking, so shared deps (e.g. d3 used by both charts and
// flow) get their own common chunk instead of duplicating.
manualChunks(id) {
if (!id.includes('node_modules')) return
if (/[\\/]node_modules[\\/](react|react-dom|react-router|react-router-dom|@remix-run[\\/]router|scheduler)[\\/]/.test(id)) return 'vendor-react'
if (/[\\/]node_modules[\\/]recharts[\\/]/.test(id)) return 'vendor-charts'
if (/[\\/]node_modules[\\/]@xyflow[\\/]/.test(id)) return 'vendor-flow'
if (/[\\/]node_modules[\\/]@xterm[\\/]/.test(id)) return 'vendor-xterm'
if (/[\\/]node_modules[\\/]lucide-react[\\/]/.test(id)) return 'vendor-icons'
// A group also captures its matched modules' dependencies,
// so priority decides who claims a shared one. React must
// win: with manualChunks, recharts pulled React core into
// vendor-charts and every page (Login included) preloaded
// the chart and flow libraries. Unmatched modules fall
// through to the default chunking.
codeSplitting: {
groups: [
{ name: 'vendor-react', priority: 50, test: /[\\/]node_modules[\\/](react|react-dom|react-router|react-router-dom|@remix-run[\\/]router|scheduler)[\\/]/ },
{ name: 'vendor-icons', priority: 40, test: /[\\/]node_modules[\\/]lucide-react[\\/]/ },
{ name: 'vendor-xterm', priority: 30, test: /[\\/]node_modules[\\/]@xterm[\\/]/ },
// Only the package itself: their small shared deps
// are also used by i18n, which would otherwise
// import (and preload) the whole chunk for them.
{ name: 'vendor-flow', priority: 20, includeDependenciesRecursively: false, test: /[\\/]node_modules[\\/]@xyflow[\\/]/ },
{ name: 'vendor-charts', priority: 10, includeDependenciesRecursively: false, test: /[\\/]node_modules[\\/]recharts[\\/]/ },
],
},
},
},