Update

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'
         }
     }
-
 });