build(web): clean split warnings and monaco loading

web/src/components/strategy/CodeStrategyEditor.tsx

@@ -6,7 +6,7 @@ import { Suspense, lazy, useCallback, useEffect, useRef, useState } from 'react'
 import { Play, Save, Copy, RotateCcw } from 'lucide-react';
 import { getPlatformAccessToken } from '../../lib/authSession';
 import { createTradeProfile } from '../../lib/profileApi';
-import '../../lib/monacoLocalWorkers';
+import { ensureMonacoLoaderConfigured } from '../../lib/monacoLocalWorkers';
 import { tradingRuntime } from '../../lib/runtime';
 import { createRequestId } from '../../../../shared/request-id.js';
 import { Button } from '../ui/button';
@@ -82,6 +82,7 @@ export function CodeStrategyEditor({
 
   useEffect(() => {
     mountedRef.current = true;
+    void ensureMonacoLoaderConfigured();
     return () => {
       mountedRef.current = false;
       clearSavedResetTimeout();

web/src/lib/authSession.ts

@@ -1,4 +1,5 @@
 import { createRequestId } from '../../../shared/request-id.js';
+import { tradingRuntime } from './runtime';
 
 const AUTH_STORAGE_PREFIX = 'invttrdg_web';
 const ACCESS_TOKEN_KEY = `${AUTH_STORAGE_PREFIX}_access_token`;
@@ -149,12 +150,11 @@ async function platformRequest<T>(
     body?: Record<string, unknown>;
   }
 ): Promise<T> {
-  const runtimeModule = await import('./runtime');
-  const response = await fetch(`${runtimeModule.tradingRuntime.platformApiUrl}${path}`, {
+  const response = await fetch(`${tradingRuntime.platformApiUrl}${path}`, {
     method: options?.method || 'GET',
     headers: {
       'Content-Type': 'application/json',
-      'x-product-id': runtimeModule.tradingRuntime.productId,
+      'x-product-id': tradingRuntime.productId,
       'x-request-id': createRequestId('web-auth'),
       ...(options?.accessToken ? { Authorization: `Bearer ${options.accessToken}` } : {}),
     },

web/src/lib/monacoLocalWorkers.ts

@@ -1,5 +1,3 @@
-import { loader } from '@monaco-editor/react';
-import * as monaco from 'monaco-editor';
 import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';
 import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker';
 import cssWorker from 'monaco-editor/esm/vs/language/css/css.worker?worker';
@@ -24,6 +22,7 @@ const monacoGlobal = globalThis as typeof globalThis & {
   MonacoEnvironment?: {
     getWorker: (_moduleId: string, label: string) => Worker;
   };
+  __INVTTRDG_MONACO_CONFIGURED__?: boolean;
 };
 
 monacoGlobal.MonacoEnvironment = {
@@ -33,4 +32,16 @@ monacoGlobal.MonacoEnvironment = {
   },
 };
 
-loader.config({ monaco });
+export async function ensureMonacoLoaderConfigured(): Promise<void> {
+  if (monacoGlobal.__INVTTRDG_MONACO_CONFIGURED__) {
+    return;
+  }
+
+  const [{ loader }, monaco] = await Promise.all([
+    import('@monaco-editor/react'),
+    import('monaco-editor'),
+  ]);
+
+  loader.config({ monaco });
+  monacoGlobal.__INVTTRDG_MONACO_CONFIGURED__ = true;
+}

web/vite.config.ts

@@ -52,4 +52,23 @@ export default defineConfig({
     setupFiles: ['./src/test/setup.ts'],
     include: ['src/**/*.test.ts', 'src/**/*.test.tsx', 'src/**/*.dom.test.tsx'],
   },
+  build: {
+    chunkSizeWarningLimit: 5000,
+    rollupOptions: {
+      output: {
+        manualChunks(id) {
+          if (id.includes('monaco-editor') || id.includes('@monaco-editor')) {
+            return 'monaco-vendor';
+          }
+          if (id.includes('/node_modules/lucide-react/')) {
+            return 'ui-vendor';
+          }
+          if (id.includes('/node_modules/')) {
+            return 'vendor';
+          }
+          return undefined;
+        },
+      },
+    },
+  },
 })