perf(*): bound list queries, batch fetches, harden media downloads

frontend/src/lib/components/MessageList.svelte

@@ -30,6 +30,7 @@
   const SCROLL_THRESHOLD = 160;
   const STICK_OFFSET = 9;
   const IDLE_DELAY = 1500;
+  const MAX_MESSAGES = 360;
 
   let messages = $state<MessageView[]>([]);
   let loading = $state(true);
@@ -176,6 +177,27 @@
     }
   }
 
+  function trimTail() {
+    if (messages.length <= MAX_MESSAGES) {
+      return;
+    }
+    messages = messages.slice(0, MAX_MESSAGES);
+    hasNewer = true;
+  }
+
+  async function trimHead() {
+    if (messages.length <= MAX_MESSAGES || container === null) {
+      return;
+    }
+    const el = container;
+    const prevHeight = el.scrollHeight;
+    const prevTop = el.scrollTop;
+    messages = messages.slice(messages.length - MAX_MESSAGES);
+    hasMore = true;
+    await tick();
+    el.scrollTop = prevTop + (el.scrollHeight - prevHeight);
+  }
+
   async function loadOlder() {
     if (
       loadingOlder ||
@@ -204,6 +226,7 @@
         ensurePeers(fresh);
         await tick();
         el.scrollTop = prevTop + (el.scrollHeight - prevHeight);
+        trimTail();
       }
     } finally {
       loadingOlder = false;
@@ -230,6 +253,7 @@
         messages = [...messages, ...fresh];
         ensurePeers(fresh);
         await tick();
+        await trimHead();
       }
     } finally {
       loadingNewer = false;
@@ -321,6 +345,7 @@
     const stick = isNearBottom();
     messages = [...messages, message];
     ensurePeers([message]);
+    await trimHead();
     if (stick) {
       await tick();
       scrollToBottom();
@@ -391,6 +416,7 @@
       ...appended,
     ];
     ensurePeers(fresh);
+    await trimHead();
     if (appended.length > 0 && stick) {
       await tick();
       scrollToBottom();