diff --git a/packages/app/src/pages/session.tsx b/packages/app/src/pages/session.tsx
index 1e73ed590fc5..9e79a99e4d28 100644
--- a/packages/app/src/pages/session.tsx
+++ b/packages/app/src/pages/session.tsx
@@ -450,7 +450,8 @@ export default function Page() {
   const messagesReady = createMemo(() => {
     const id = params.id
     if (!id) return true
-    return sync.data.message[id] !== undefined
+    // Ready if messages are loaded OR the session exists in the list (show immediately, load in background)
+    return sync.data.message[id] !== undefined || sync.session.get(id) !== undefined
   })
   const historyMore = createMemo(() => {
     const id = params.id
@@ -536,12 +537,6 @@ export default function Page() {
 
   createComputed((prev) => {
     const key = sessionKey()
-    if (key !== prev) {
-      setStore("deferRender", true)
-      requestAnimationFrame(() => {
-        setTimeout(() => setStore("deferRender", false), 0)
-      })
-    }
     return key
   }, sessionKey())
 
@@ -755,7 +750,7 @@ export default function Page() {
 
   const hasScrollGesture = () => Date.now() - ui.scrollGesture < scrollGestureWindowMs
 
-  const [sessionSync] = createResource(
+  createResource(
     () => [sdk.directory, params.id] as const,
     ([directory, id]) => {
       if (refreshFrame !== undefined) cancelAnimationFrame(refreshFrame)
@@ -1124,7 +1119,7 @@ export default function Page() {
     loadingClass: string
     emptyClass: string
   }) => (
-    <Show when={!store.deferRender}>
+    <Show when={true}>
       <SessionReviewTab
         title={changesTitle()}
         empty={reviewEmpty(input)}
@@ -1789,7 +1784,6 @@ export default function Page() {
 
   return (
     <div class="relative bg-background-base size-full overflow-hidden flex flex-col">
-      {sessionSync() ?? ""}
       <SessionHeader />
       <div class="flex-1 min-h-0 flex flex-col md:flex-row">
         <Show when={!isDesktop() && !!params.id}>
@@ -1882,7 +1876,7 @@ export default function Page() {
 
           <SessionComposerRegion
             state={composer}
-            ready={!store.deferRender && messagesReady()}
+            ready={messagesReady()}
             centered={centered()}
             inputRef={(el) => {
               inputRef = el
diff --git a/packages/app/src/pages/session/composer/session-composer-region.tsx b/packages/app/src/pages/session/composer/session-composer-region.tsx
index e6bfd05ec405..1829d83daaa2 100644
--- a/packages/app/src/pages/session/composer/session-composer-region.tsx
+++ b/packages/app/src/pages/session/composer/session-composer-region.tsx
@@ -99,7 +99,6 @@ export function SessionComposerRegion(props: {
   createEffect(() => {
     route.sessionKey()
     const ready = props.ready
-    const delay = 140
 
     clear()
     setStore("ready", false)
@@ -107,10 +106,7 @@ export function SessionComposerRegion(props: {
 
     frame = requestAnimationFrame(() => {
       frame = undefined
-      timer = window.setTimeout(() => {
-        setStore("ready", true)
-        timer = undefined
-      }, delay)
+      setStore("ready", true)
     })
   })
 
diff --git a/packages/app/src/pages/session/message-timeline.tsx b/packages/app/src/pages/session/message-timeline.tsx
index 8bbaafb4e433..8f470fe65ddc 100644
--- a/packages/app/src/pages/session/message-timeline.tsx
+++ b/packages/app/src/pages/session/message-timeline.tsx
@@ -1021,6 +1021,11 @@ export function MessageTimeline(props: {
                   </Button>
                 </div>
               </Show>
+              <Show when={props.renderedUserMessages.length === 0 && props.historyLoading}>
+                <div class="flex items-center justify-center py-12">
+                  <Spinner />
+                </div>
+              </Show>
               <For each={rendered()}>
                 {(messageID) => {
                   const active = createMemo(() => activeMessageID() === messageID)