but what if i rewrote it a fourth time

persistent log for events, with collapse on next open

consume/package.json

@@ -10,6 +10,7 @@
     "preview": "bunx --bun vite preview"
   },
   "dependencies": {
+    "msgpackr": "^1.10.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "zustand": "^4.5.2"

consume/src/client.ts

@@ -1,14 +1,24 @@
+import { pack, unpack } from "msgpackr";
+
+type Emit = {
+  type: "emit";
+  id: string;
+  patches: Array<
+    { path?: undefined; value: any } | { path: string[]; value?: any }
+  >;
+};
+
 export class Client {
   ws: WebSocket;
   listeners: { [id: string]: (state: unknown) => void };
   [any: string]: any;
 
-  constructor(url = `ws://${location.host}`) {
-    this.ws = new WebSocket(url);
+  constructor() {
+    this.ws = new WebSocket(`ws://${location.host}`);
     this.listeners = {};
-
+    this.ws.binaryType = "arraybuffer";
     this.ws.addEventListener("message", (event) => {
-      const data = JSON.parse(event.data);
+      const data = unpack(event.data);
 
       switch (data.type) {
         case "emit":
@@ -17,8 +27,9 @@ export class Client {
     });
   }
 
-  handleEmit(data: { type: "emit"; id: string; state: unknown }) {
-    this.listeners[data.id](data.state);
+  handleEmit(data: Emit) {
+    // has own state,
+    this.listeners[data.id](data);
   }
 
   act(action: string, payload: any) {
@@ -45,6 +56,6 @@ export class Client {
         resolve();
       }
     });
-    this.ws.send(JSON.stringify(obj));
+    this.ws.send(pack(obj));
   }
 }

consume/src/main.tsx

@@ -46,10 +46,6 @@ const App = () => {
   const flavorText = cg.useState((s: any) => s.flavorText);
   const name = cg.useState((s: any) => s.scoreboard[0].name);
 
-  cg.ws.addEventListener("message", (event) => {
-    setLog([...log, "Received message: " + event.data]);
-  });
-
   return (
     <div className="flex flex-col w-full max-w-6xl mx-auto p-2 gap-2" id="feed">
       <div className="flex gap-2">

lib/buncg.ts

@@ -1,6 +1,6 @@
 import type { ServerWebSocket, WebSocketHandler } from "bun";
 import { open } from "lmdb";
-import { Encoder } from "msgpackr";
+import { pack, unpack } from "msgpackr";
 import Immutable from "immutable";
 
 type Input<S> = {
@@ -46,31 +46,17 @@ export type Emit = {
 
 export default class BunCG<S extends {}> {
   #filepath = "buncg.state";
-  #structs = {
-    $: Symbol.for("$structs"),
-  } as {
-    $: symbol;
-    get: () => any[];
-    set: (s: any[0]) => void;
-  };
+  #structs = Symbol.for("$structs");
   _db;
-  _encoder;
   _state: Immutable.FromJS<S>;
   _actions;
   _websocket: WebSocketHandler;
   _watchers: Watcher[];
 
   constructor(input: Input<S>) {
     this._db = open(this.#filepath, {
-      sharedStructuresKey: this.#structs.$,
-    });
-    this.#structs.get = () => this._db.get(this.#structs.$) || [];
-    this.#structs.set = (s) => this._db.putSync(this.#structs.$, s);
-    this._encoder = new Encoder({
-      getStructures: this.#structs.get,
-      saveStructures: this.#structs.set,
+      sharedStructuresKey: this.#structs,
     });
-
     this._state = Immutable.fromJS(input.state).withMutations((draft) => {
       this._db.getRange({ start: 0 }).forEach(({ value }) =>
         value.forEach((patch: PatchPathed) => {
@@ -87,9 +73,10 @@ export default class BunCG<S extends {}> {
     });
     this._actions = input.actions;
     this._websocket = {
-      message: (ws, msg: string) => {
-        console.log(`ws ~ message ~ ${msg}`);
-        const data: Message = JSON.parse(msg);
+      message: (ws, msg: Buffer) => {
+        const data: Message = unpack(msg);
+
+        console.log(`ws ~ message ~ ${data}`);
 
         switch (data.type) {
           case "action":
@@ -205,15 +192,15 @@ export default class BunCG<S extends {}> {
   }
 
   _eventsEmit(...events: Emit[]) {
-    events.forEach(({ ws, id, patches }) => {
+    events.forEach(({ ws, id, patches }) =>
       ws.send(
-        this._encoder.encode({
+        pack({
           type: "emit",
           id,
           patches,
         })
-      );
-    });
+      )
+    );
   }
 
   _persistAppend(value: Patch[]) {
@@ -227,9 +214,9 @@ export default class BunCG<S extends {}> {
 
   _persistCollapse() {
     this._db.transactionSync(() => {
-      const structs = this.#structs.get();
+      const structs = this._db.get(this.#structs) || [];
       this._db.clearSync();
-      this.#structs.set(structs);
+      this._db.putSync(this.#structs, structs);
       this._db.putSync(0, [{ value: this._state }]);
     });
   }