add debug logging to autoscroll and experiment with using microtasks

frontend/src/components/Messages.svelte

@@ -1,9 +1,11 @@
 <script>
     import { afterUpdate } from "svelte";
-    import { getItem } from "../storage.js";
+    import logger from "../logging.js";
     import { messagesStoreProvider, smallViewport } from "../stores.js";
     import Message from "./Message.svelte";
 
+    const messagesLog = logger("Messages");
+
     export let channelId;
     let scrollTarget;
     let scrollAnchor;
@@ -14,18 +16,23 @@
     $: messages = messagesStoreProvider.getStore(channelId);
 
     afterUpdate(() => {
+        messagesLog("[afterUpdate] reached, creating microtask...");
+        queueMicrotask(() => {
+            messagesLog("[afterUpdate] reached microtask");
+
             // hacky way to preserve scroll position when messages are pushed back
             if (lastScrollHeight) {
+                messagesLog("[afterUpdate] restoring scroll height...");
                 scrollTarget.scrollTop = scrollTarget.scrollHeight - lastScrollHeight;
                 lastScrollHeight = null;
                 return;
             }
             if (shouldAutoscroll && scrollAnchor) {
-            queueMicrotask(() => {
+                messagesLog("[afterUpdate] performing autoscroll...");
                 scrollAnchor.scrollIntoView(false);
-            });
             }
         });
+    });
 
     const onScroll = (e) => {
         const { scrollHeight, scrollTop, clientHeight } = e.target;
@@ -33,10 +40,13 @@
             messages.setIsCollectingOldMessages(true);
             shouldAutoscroll = true;
             isScrolledToBottom = true;
+            messagesLog("[onScroll] user is scrolled to bottom, enabling autoscroll...");
         } else {
             shouldAutoscroll = false;
             isScrolledToBottom = false;
+            messagesLog("[onScroll] user is no longer scrolled to bottom, disabling autoscroll...");
             if (scrollTop === 0) {
+                messagesLog("[onScroll] user scrolled to top, loading older messages...");
                 // load older messages if the user scrolls to the top.
                 // save the current scroll height if the server returned any messages,
                 // before commiting them to the store. this is to provide the jank scroll height
@@ -55,8 +65,10 @@
         // showSidebar is false on small viewports
         // scrolling to bottom when the virtual keyboard pops up does not work on chromium purely based on isScrolledToBottom for some reason
         if (isScrolledToBottom || $smallViewport) {
+            messagesLog("[windowDidResize] window resized, queueing microtask to scroll to bottom...");
             queueMicrotask(() => {
                 scrollAnchor.scrollIntoView(false);
+                messagesLog("[windowDidResize] scroll to bottom microtask finished.");
             });
         }
     };

frontend/src/storage.js

@@ -7,6 +7,7 @@ const defaults = {
     "state:openChannelId": -1,
     "log:Gateway": false,
     "log:Store": false,
+    "log:Messages": false,
     "ui:stateful:presistSelectedChannel": true,
     "ui:showSidebarToggle": false,
     "ui:alwaysUseMobileChatBar": false,