diff --git a/client/package.json b/client/package.json index 3d033cbcde..04069a8807 100644 --- a/client/package.json +++ b/client/package.json @@ -139,6 +139,7 @@ "postcss": "^8.4.31", "postcss-loader": "^7.1.0", "postcss-preset-env": "^8.2.0", + "rollup-plugin-visualizer": "^6.0.0", "tailwindcss": "^3.4.1", "ts-jest": "^29.2.5", "typescript": "^5.3.3", diff --git a/client/vite.config.ts b/client/vite.config.ts index 6a3b75628a..e0d7b1bebe 100644 --- a/client/vite.config.ts +++ b/client/vite.config.ts @@ -1,9 +1,10 @@ -import path, { resolve } from 'path'; +import path from 'path'; +import { defineConfig } from 'vite'; import react from '@vitejs/plugin-react'; import { VitePWA } from 'vite-plugin-pwa'; -import { defineConfig } from 'vite'; -import { nodePolyfills } from 'vite-plugin-node-polyfills'; +import { visualizer } from 'rollup-plugin-visualizer'; import { compression } from 'vite-plugin-compression2'; +import { nodePolyfills } from 'vite-plugin-node-polyfills'; import type { Plugin } from 'vite'; // https://vitejs.dev/config/ @@ -84,7 +85,15 @@ export default defineConfig({ compression({ threshold: 10240, }), - ], + process.env.VITE_BUNDLE_ANALYSIS === 'true' && + visualizer({ + filename: 'dist/bundle-analysis.html', + open: true, + gzipSize: true, + brotliSize: true, + template: 'treemap', // 'treemap' | 'sunburst' | 'network' + }), + ].filter(Boolean), publicDir: './public', build: { sourcemap: process.env.NODE_ENV === 'development', @@ -128,6 +137,41 @@ export default defineConfig({ return 'security-ui'; } + if (id.includes('@codemirror/view')) { + return 'codemirror-view'; + } + if (id.includes('@codemirror/state')) { + return 'codemirror-state'; + } + if (id.includes('@codemirror/language')) { + return 'codemirror-language'; + } + if (id.includes('@codemirror')) { + return 'codemirror-core'; + } + + if (id.includes('react-markdown') || id.includes('remark-') || id.includes('rehype-')) { + return 'markdown-processing'; + } + if (id.includes('monaco-editor') || id.includes('@monaco-editor')) { + return 'code-editor'; + } + if (id.includes('react-window') || id.includes('react-virtual')) { + return 'virtualization'; + } + if (id.includes('zod') || id.includes('yup') || id.includes('joi')) { + return 'validation'; + } + if (id.includes('axios') || id.includes('ky') || id.includes('fetch')) { + return 'http-client'; + } + if (id.includes('react-spring') || id.includes('react-transition-group')) { + return 'animations'; + } + if (id.includes('react-select') || id.includes('downshift')) { + return 'advanced-inputs'; + } + // Existing chunks if (id.includes('@radix-ui')) { return 'radix-ui'; @@ -138,7 +182,10 @@ export default defineConfig({ if (id.includes('node_modules/highlight.js')) { return 'markdown_highlight'; } - if (id.includes('node_modules/hast-util-raw') || id.includes('node_modules/katex')) { + if (id.includes('katex') || id.includes('node_modules/katex')) { + return 'math-katex'; + } + if (id.includes('node_modules/hast-util-raw')) { return 'markdown_large'; } if (id.includes('@tanstack')) { diff --git a/package-lock.json b/package-lock.json index 2bc3d00c23..8f23be19d1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2631,6 +2631,7 @@ "postcss": "^8.4.31", "postcss-loader": "^7.1.0", "postcss-preset-env": "^8.2.0", + "rollup-plugin-visualizer": "^6.0.0", "tailwindcss": "^3.4.1", "ts-jest": "^29.2.5", "typescript": "^5.3.3", @@ -36889,9 +36890,9 @@ } }, "node_modules/open": { - "version": "10.1.0", - "resolved": "https://registry.npmjs.org/open/-/open-10.1.0.tgz", - "integrity": "sha512-mnkeQ1qP5Ue2wd+aivTD3NHd/lZ96Lu0jgf0pwktLPtx6cTZiH7tyeGRRHs0zX0rbrahXPnXlUnbeXyaBBuIaw==", + "version": "10.1.2", + "resolved": "https://registry.npmjs.org/open/-/open-10.1.2.tgz", + "integrity": "sha512-cxN6aIDPz6rm8hbebcP7vrQNhvRcveZoJU72Y7vskh4oIm+BZwBECnx5nTmrlres1Qapvx27Qo1Auukpf8PKXw==", "license": "MIT", "dependencies": { "default-browser": "^5.2.1", @@ -40961,6 +40962,60 @@ "node": ">= 10.0.0" } }, + "node_modules/rollup-plugin-visualizer": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/rollup-plugin-visualizer/-/rollup-plugin-visualizer-6.0.0.tgz", + "integrity": "sha512-9aXBJh1uzI6XNmAeATox2z5MWrEPzL6hQgEMOYxTltWOy5x2ycQCec0Y9fC19sBgf3FvIF36aG9DrvUcdnXPew==", + "dev": true, + "license": "MIT", + "dependencies": { + "open": "^10.1.2", + "picomatch": "^4.0.2", + "source-map": "^0.7.4", + "yargs": "^17.5.1" + }, + "bin": { + "rollup-plugin-visualizer": "dist/bin/cli.js" + }, + "engines": { + "node": ">=18" + }, + "peerDependencies": { + "rolldown": "1.x", + "rollup": "2.x || 3.x || 4.x" + }, + "peerDependenciesMeta": { + "rolldown": { + "optional": true + }, + "rollup": { + "optional": true + } + } + }, + "node_modules/rollup-plugin-visualizer/node_modules/picomatch": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz", + "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, + "node_modules/rollup-plugin-visualizer/node_modules/source-map": { + "version": "0.7.4", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.4.tgz", + "integrity": "sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==", + "dev": true, + "license": "BSD-3-Clause", + "engines": { + "node": ">= 8" + } + }, "node_modules/router": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/router/-/router-2.2.0.tgz",