Do not fetch old messages on old connecting to avoid douple rendering

web/src/app/Connection.js

@@ -1,4 +1,4 @@
-import {shortTopicUrl, topicUrlWs} from "./utils";
+import {shortTopicUrl, topicUrlWs, topicUrlWsWithSince} from "./utils";
 
 const retryBackoffSeconds = [5, 10, 15, 20, 30, 45, 60, 120];
 
@@ -16,8 +16,11 @@ class Connection {
     }
 
     start() {
-        const since = (this.since === 0) ? "all" : this.since.toString();
-        const wsUrl = topicUrlWs(this.baseUrl, this.topic, since);
+        // Don't fetch old messages; we do that as a poll() when adding a subscription;
+        // we don't want to re-trigger the main view re-render potentially hundreds of times.
+        const wsUrl = (this.since === 0)
+            ? topicUrlWs(this.baseUrl, this.topic)
+            : topicUrlWsWithSince(this.baseUrl, this.topic, this.since.toString());
         console.log(`[Connection, ${this.shortUrl}] Opening connection to ${wsUrl}`);
         this.ws = new WebSocket(wsUrl);
         this.ws.onopen = (event) => {

web/src/app/utils.js

@@ -1,7 +1,8 @@
 export const topicUrl = (baseUrl, topic) => `${baseUrl}/${topic}`;
-export const topicUrlWs = (baseUrl, topic, since) => `${topicUrl(baseUrl, topic)}/ws?since=${since}`
+export const topicUrlWs = (baseUrl, topic) => `${topicUrl(baseUrl, topic)}/ws`
     .replaceAll("https://", "wss://")
     .replaceAll("http://", "ws://");
+export const topicUrlWsWithSince = (baseUrl, topic, since) => `${topicUrlWs(baseUrl, topic)}?since=${since}`;
 export const topicUrlJson = (baseUrl, topic) => `${topicUrl(baseUrl, topic)}/json`;
 export const topicUrlJsonPoll = (baseUrl, topic) => `${topicUrlJson(baseUrl, topic)}?poll=1`;
 export const shortUrl = (url) => url.replaceAll(/https?:\/\//g, "");