perf(ui): unmount hidden session panes sooner

Author: pascalandr

packages/ui/src/components/instance/instance-shell2.tsx

@@ -482,6 +482,10 @@ const InstanceShell2: Component<InstanceShellProps> = (props) => {
 
 
   const renderRightPanel = () => {
+    if (!props.isActiveInstance) {
+      return <RightPanelFallback />
+    }
+
     if (rightPinned()) {
       return (
         <Box

packages/ui/src/components/session/session-view.tsx

@@ -328,9 +328,10 @@ export const SessionView: Component<SessionViewProps> = (props) => {
         if (!activeSession) return null
         return (
           <div ref={rootRef} class="session-view">
-            <MessageSection
-               instanceId={props.instanceId}
-               sessionId={activeSession.id}
+            <Show when={isActiveSession()} fallback={<div class="flex-1 min-h-0" />}>
+              <MessageSection
+                instanceId={props.instanceId}
+                sessionId={activeSession.id}
                 loading={messagesLoading()}
                 onRevert={handleRevert}
                 onDeleteMessagesUpTo={handleDeleteMessagesUpTo}
@@ -344,15 +345,12 @@ export const SessionView: Component<SessionViewProps> = (props) => {
                     }
                   }
                 }}
-
-
-
-
-               showSidebarToggle={props.showSidebarToggle}
-               onSidebarToggle={props.onSidebarToggle}
-               forceCompactStatusLayout={props.forceCompactStatusLayout}
-               onQuoteSelection={handleQuoteSelection}
-             />
+                showSidebarToggle={props.showSidebarToggle}
+                onSidebarToggle={props.onSidebarToggle}
+                forceCompactStatusLayout={props.forceCompactStatusLayout}
+                onQuoteSelection={handleQuoteSelection}
+              />
+            </Show>
 
 
               <Show when={isActiveSession()}>