diff --git a/package-lock.json b/package-lock.json index 00e8237..5f8ab3a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -88,6 +88,7 @@ "prettier": "^3.4.2", "prettier-plugin-organize-imports": "^4.1.0", "prettier-plugin-tailwindcss": "^0.6.11", + "rollup-plugin-visualizer": "^6.0.3", "typescript-eslint": "^8.23.0" }, "optionalDependencies": { @@ -4528,6 +4529,16 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/define-lazy-prop": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz", + "integrity": "sha512-Ds09qNh8yw3khSjiJjiUInaGX9xlqZDY7JVryGxdxV7NPeuqQfplOpQ66yJFZut3jLa5zOwkXw1g9EI2uKh4Og==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, "node_modules/define-properties": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.1.tgz", @@ -5849,6 +5860,22 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-docker": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz", + "integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==", + "dev": true, + "license": "MIT", + "bin": { + "is-docker": "cli.js" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/is-extglob": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", @@ -6114,6 +6141,19 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-wsl": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz", + "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==", + "dev": true, + "license": "MIT", + "dependencies": { + "is-docker": "^2.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/isarray": { "version": "2.0.5", "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz", @@ -6918,6 +6958,24 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/open": { + "version": "8.4.2", + "resolved": "https://registry.npmjs.org/open/-/open-8.4.2.tgz", + "integrity": "sha512-7x81NCL719oNbsq/3mh+hVrAWmFuEYUqrq/Iw3kUzH8ReypT9QQ0BLoJS7/G9k6N81XjW4qHWtjWwe/9eLy1EQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "define-lazy-prop": "^2.0.0", + "is-docker": "^2.1.1", + "is-wsl": "^2.2.0" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/optionator": { "version": "0.9.4", "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz", @@ -7692,6 +7750,50 @@ "fsevents": "~2.3.2" } }, + "node_modules/rollup-plugin-visualizer": { + "version": "6.0.3", + "resolved": "https://registry.npmjs.org/rollup-plugin-visualizer/-/rollup-plugin-visualizer-6.0.3.tgz", + "integrity": "sha512-ZU41GwrkDcCpVoffviuM9Clwjy5fcUxlz0oMoTXTYsK+tcIFzbdacnrr2n8TXcHxbGKKXtOdjxM2HUS4HjkwIw==", + "dev": true, + "license": "MIT", + "dependencies": { + "open": "^8.0.0", + "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 || ^1.0.0-beta", + "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/node_modules/@rollup/rollup-linux-x64-gnu": { "version": "4.43.0", "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.43.0.tgz", @@ -7993,6 +8095,16 @@ "react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-rc" } }, + "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/source-map-js": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz", diff --git a/package.json b/package.json index babf81a..de23995 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "prettier": "^3.4.2", "prettier-plugin-organize-imports": "^4.1.0", "prettier-plugin-tailwindcss": "^0.6.11", + "rollup-plugin-visualizer": "^6.0.3", "typescript-eslint": "^8.23.0" }, "dependencies": { diff --git a/resources/js/pages/home/home.tsx b/resources/js/pages/home/home.tsx index b760aff..7c2fcd3 100644 --- a/resources/js/pages/home/home.tsx +++ b/resources/js/pages/home/home.tsx @@ -4,7 +4,7 @@ import FlashMessages from '@/modules/flash/flash-messages'; const Home = () => { return ( -
+
diff --git a/vite.config.ts b/vite.config.ts index 35bae97..5659e26 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -3,6 +3,7 @@ import react from '@vitejs/plugin-react'; import laravel from 'laravel-vite-plugin'; import { resolve } from 'node:path'; import { defineConfig } from 'vite'; +import { visualizer } from "rollup-plugin-visualizer"; export default defineConfig({ plugins: [ @@ -13,10 +14,18 @@ export default defineConfig({ }), react(), tailwindcss(), + // visualizer({ + // filename: 'dist/stats.html', + // open: true, // Automatically open in browser + // gzipSize: true, // Show gzipped sizes + // brotliSize: true, // Show brotli compressed sizes + // template: 'treemap', // Can be 'treemap', 'sunburst', 'network' + // }) ], esbuild: { jsx: 'automatic', - //drop: ["console", "debugger"], + // Uncomment for production to remove console logs + // drop: ["console", "debugger"], }, resolve: { alias: { @@ -27,12 +36,99 @@ export default defineConfig({ optimizeDeps: { exclude: ['@ffmpeg/ffmpeg', '@ffmpeg/util'] }, + build: { + rollupOptions: { + output: { + manualChunks: { + // React MUST be first and separate to avoid dependency issues + 'react-vendor': ['react', 'react-dom'], + // Heavy libraries that can be safely separated + 'ffmpeg': ['@ffmpeg/ffmpeg', '@ffmpeg/util'], + 'motion': ['motion'], + 'canvas': ['konva', 'react-konva', 'react-konva-utils'], + 'charts': ['recharts'], + + // UI libraries that depend on React + 'radix-ui': [ + '@radix-ui/react-accordion', + '@radix-ui/react-alert-dialog', + '@radix-ui/react-aspect-ratio', + '@radix-ui/react-avatar', + '@radix-ui/react-checkbox', + '@radix-ui/react-collapsible', + '@radix-ui/react-context-menu', + '@radix-ui/react-dialog', + '@radix-ui/react-dropdown-menu', + '@radix-ui/react-hover-card', + '@radix-ui/react-label', + '@radix-ui/react-menubar', + '@radix-ui/react-navigation-menu', + '@radix-ui/react-popover', + '@radix-ui/react-progress', + '@radix-ui/react-radio-group', + '@radix-ui/react-scroll-area', + '@radix-ui/react-select', + '@radix-ui/react-separator', + '@radix-ui/react-slider', + '@radix-ui/react-slot', + '@radix-ui/react-switch', + '@radix-ui/react-tabs', + '@radix-ui/react-toggle', + '@radix-ui/react-toggle-group', + '@radix-ui/react-tooltip' + ], + + // Form libraries + 'forms': ['react-hook-form', '@hookform/resolvers', 'zod'], + + // UI utilities + 'ui-utils': [ + 'tailwind-merge', + 'class-variance-authority', + 'clsx', + 'lucide-react', + 'sonner', + 'cmdk', + 'next-themes' + ], + + // Other React components + 'react-components': [ + 'react-day-picker', + 'react-error-boundary', + 'embla-carousel-react', + 'react-resizable-panels' + ], + + // Non-React utilities + 'utils': [ + 'date-fns', + 'axios', + 'mitt', + 'zustand', + 'embla-carousel-autoplay' + ], + + // Inertia + 'inertia': ['@inertiajs/react'] + } + } + }, + // Temporarily increase limit while optimizing + chunkSizeWarningLimit: 1000, + + // Additional optimizations + minify: 'esbuild', + target: 'es2020', + + // Enable source maps for better debugging (optional) + sourcemap: false, + }, server: { headers: { - 'Cross-Origin-Opener-Policy': 'same-origin', - 'Cross-Origin-Embedder-Policy': 'require-corp' + 'Cross-Origin-Opener-Policy': 'same-origin', + 'Cross-Origin-Embedder-Policy': 'require-corp' } } - });