perf(P6A.T1): lazy-load ImageAnnotator/Whiteboard/WatchTogether/GameModal

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

apps/desktop/src/pages/ConversationPage.tsx

@@ -1,6 +1,6 @@
 import { parseMessagePayload, pinMessage, unpinMessage } from '@chat-app/shared/chat';
 import { extractErrorCode } from '@chat-app/shared/i18n';
-import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import { lazy, Suspense, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useParams } from 'react-router-dom';
 
@@ -26,7 +26,9 @@ import {
   SpinnerIcon,
   XIcon,
 } from '../components/icons';
-import { ImageAnnotator } from '../components/ImageAnnotator';
+const ImageAnnotator = lazy(() =>
+  import('../components/ImageAnnotator').then((m) => ({ default: m.ImageAnnotator })),
+);
 import { InCallPanel } from '../components/InCallPanel';
 import { IncomingCallPanel } from '../components/IncomingCallPanel';
 import { CallPreviewPanel } from '../components/CallPreviewPanel';
@@ -49,9 +51,15 @@ import {
   createWatchTogetherPayload,
   createGamePayload,
 } from '../lib/conversationFeatures';
-import { WhiteboardModal } from '../components/WhiteboardModal';
-import { WatchTogetherModal } from '../components/WatchTogetherModal';
-import { GameModal } from '../components/GameModal';
+const WhiteboardModal = lazy(() =>
+  import('../components/WhiteboardModal').then((m) => ({ default: m.WhiteboardModal })),
+);
+const WatchTogetherModal = lazy(() =>
+  import('../components/WatchTogetherModal').then((m) => ({ default: m.WatchTogetherModal })),
+);
+const GameModal = lazy(() =>
+  import('../components/GameModal').then((m) => ({ default: m.GameModal })),
+);
 import { createWhiteboard, createWatchSession, parseYouTubeUrl, createGame, type GameType } from '@chat-app/shared/chat';
 import { compressImages } from '../lib/imageCompress';
 import { ensureInstallId } from '../lib/installId';
@@ -1321,6 +1329,7 @@ export function ConversationPage() {
       />
 
       {annotatingIndex !== null && attachments[annotatingIndex] && (
+        <Suspense fallback={null}>
           <ImageAnnotator
             file={attachments[annotatingIndex]!}
             onCancel={() => setAnnotatingIndex(null)}
@@ -1329,27 +1338,34 @@ export function ConversationPage() {
               setAnnotatingIndex(null);
             }}
           />
+        </Suspense>
       )}
 
       {openWhiteboardId && (
+        <Suspense fallback={null}>
           <WhiteboardModal
             whiteboardId={openWhiteboardId}
             onClose={() => setOpenWhiteboardId(null)}
           />
+        </Suspense>
       )}
 
       {openWatchSessionId && (
+        <Suspense fallback={null}>
           <WatchTogetherModal
             sessionId={openWatchSessionId}
             onClose={() => setOpenWatchSessionId(null)}
           />
+        </Suspense>
       )}
 
       {openGameId && (
+        <Suspense fallback={null}>
           <GameModal
             gameId={openGameId}
             onClose={() => setOpenGameId(null)}
           />
+        </Suspense>
       )}
 
       {gameDialogOpen && (