diff --git a/src/hooks/useEventLoader.ts b/src/hooks/useEventLoader.ts
index 4223c60e..f25c4d88 100644
--- a/src/hooks/useEventLoader.ts
+++ b/src/hooks/useEventLoader.ts
@@ -51,22 +51,26 @@ export function useEventLoader({
     if (!eventId) return
 
     console.log('🔍 useEventLoader: Loading event:', eventId)
+    
+    // Try to get from event store first - do this synchronously before setting loading state
+    if (eventStore) {
+      const cachedEvent = eventStore.getEvent(eventId)
+      if (cachedEvent) {
+        console.log('✅ useEventLoader: Found cached event (instant load):', cachedEvent)
+        displayEvent(cachedEvent)
+        setReaderLoading(false)
+        setIsCollapsed(false)
+        setSelectedUrl(`nostr:${eventId}`)
+        return
+      }
+    }
+
+    // Event not in cache, now set loading state and fetch from relays
     setReaderLoading(true)
     setReaderContent(undefined)
     setSelectedUrl(`nostr:${eventId}`)
     setIsCollapsed(false)
 
-    // Try to get from event store first
-    if (eventStore) {
-      const cachedEvent = eventStore.getEvent(eventId)
-      if (cachedEvent) {
-        console.log('✅ useEventLoader: Found cached event:', cachedEvent)
-        displayEvent(cachedEvent)
-        setReaderLoading(false)
-        return
-      }
-    }
-
     // Otherwise fetch from relays
     if (!relayPool) {
       console.log('❌ useEventLoader: No relay pool available')