perf: reduce duplicate app initialization and heavy view imports

Deduplicates concurrent app initialization in the config store
Lazy-loads VS Code-only app surfaces
Avoids broad view barrel imports for better chunk isolation

packages/ui/src/App.tsx

@@ -1,8 +1,6 @@
 import React from 'react';
 import { MainLayout } from '@/components/layout/MainLayout';
-import { VSCodeLayout } from '@/components/layout/VSCodeLayout';
-import { AgentManagerView } from '@/components/views/agent-manager';
-import { ChatView } from '@/components/views';
+import { ChatView } from '@/components/views/ChatView';
 import { FireworksProvider } from '@/contexts/FireworksContext';
 import { Toaster } from '@/components/ui/sonner';
 import { Button } from '@/components/ui/button';
@@ -65,6 +63,14 @@ const OnboardingScreen = lazyWithChunkRecovery(() =>
   import('@/components/onboarding/OnboardingScreen').then((m) => ({ default: m.OnboardingScreen })),
 );
 
+const VSCodeLayoutLazy = lazyWithChunkRecovery(() =>
+  import('@/components/layout/VSCodeLayout').then((m) => ({ default: m.VSCodeLayout })),
+);
+
+const AgentManagerViewLazy = lazyWithChunkRecovery(() =>
+  import('@/components/views/agent-manager').then((m) => ({ default: m.AgentManagerView })),
+);
+
 const AboutDialogWrapper: React.FC = () => {
   const isAboutDialogOpen = useUIStore((s) => s.isAboutDialogOpen);
   const setAboutDialogOpen = useUIStore((s) => s.setAboutDialogOpen);
@@ -236,7 +242,6 @@ function App({ apis }: AppProps) {
       : null;
   });
   const appReadyDispatchedRef = React.useRef(false);
-  const initializationInFlightRef = React.useRef(false);
   const embeddedSessionChat = React.useMemo<EmbeddedSessionChatConfig | null>(() => readEmbeddedSessionChatConfig(), []);
   const embeddedBackgroundWorkEnabled = !embeddedSessionChat || isEmbeddedVisible;
   const isMcpOAuthCallback = React.useMemo(() => isMcpOAuthCallbackPath(), []);
@@ -383,24 +388,12 @@ function App({ apis }: AppProps) {
   }, [setPlanModeEnabled]);
 
   React.useEffect(() => {
-    const init = async () => {
-      // VS Code runtime bootstraps config + sessions after the managed OpenCode instance reports "connected".
-      // Doing the default initialization here can race with startup and lead to one-shot failures.
-      if (isVSCodeRuntime) {
-        return;
-      }
-      if (initializationInFlightRef.current) {
-        return;
-      }
-      initializationInFlightRef.current = true;
-      try {
-        await initializeApp();
-      } finally {
-        initializationInFlightRef.current = false;
-      }
-    };
-
-    init();
+    // VS Code runtime bootstraps config + sessions after the managed OpenCode instance reports "connected".
+    // Doing the default initialization here can race with startup and lead to one-shot failures.
+    if (isVSCodeRuntime) {
+      return;
+    }
+    void initializeApp();
   }, [initializeApp, isVSCodeRuntime]);
 
   React.useEffect(() => {
@@ -423,18 +416,8 @@ function App({ apis }: AppProps) {
         setInitRetryExhausted(false);
         return;
       }
-      if (initializationInFlightRef.current) {
-        retryTimer = setTimeout(retryInitialization, BASE_DELAY_MS);
-        return;
-      }
-
       retryCount += 1;
-      initializationInFlightRef.current = true;
-      try {
-        await state.initializeApp();
-      } finally {
-        initializationInFlightRef.current = false;
-      }
+      await state.initializeApp();
 
       const next = useConfigStore.getState();
       if (!active) return;
@@ -760,15 +743,13 @@ function App({ apis }: AppProps) {
   }, []);
 
   const handleManualInitRetry = React.useCallback(async () => {
-    if (manualInitRetrying || initializationInFlightRef.current) return;
+    if (manualInitRetrying) return;
 
     setInitRetryExhausted(false);
     setManualInitRetrying(true);
-    initializationInFlightRef.current = true;
     try {
       await useConfigStore.getState().initializeApp();
     } finally {
-      initializationInFlightRef.current = false;
       setManualInitRetrying(false);
     }
 
@@ -882,7 +863,9 @@ function App({ apis }: AppProps) {
             <TooltipProvider delayDuration={300} skipDelayDuration={150}>
               <div className="h-full text-foreground bg-background">
                 <SyncAppEffects embeddedBackgroundWorkEnabled={embeddedBackgroundWorkEnabled} />
-                <AgentManagerView />
+                <React.Suspense fallback={<div className="h-full" />}>
+                  <AgentManagerViewLazy />
+                </React.Suspense>
                 <Toaster />
               </div>
             </TooltipProvider>
@@ -900,7 +883,9 @@ function App({ apis }: AppProps) {
               <TooltipProvider delayDuration={300} skipDelayDuration={150}>
                 <div className="h-full text-foreground bg-background">
                   <SyncAppEffects embeddedBackgroundWorkEnabled={embeddedBackgroundWorkEnabled} />
-                  <VSCodeLayout />
+                  <React.Suspense fallback={<div className="h-full" />}>
+                    <VSCodeLayoutLazy />
+                  </React.Suspense>
                   <Toaster />
                 </div>
               </TooltipProvider>