fix(store-sync): improve syncToZustand hydration speed (#2145)

Co-authored-by: Kevin Ingersoll <[email protected]>
latticexyz · Jan 18, 2024 · a735e14 · a735e14
1 parent e4a6189
commit a735e14
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 40 deletions.
diff --git a/.changeset/olive-bugs-add.md b/.changeset/olive-bugs-add.md
@@ -0,0 +1,5 @@
+---
+"@latticexyz/store-sync": patch
+---
+
+Improved `syncToZustand` speed of hydrating from snapshot by only applying block logs once per block instead of once per log.
diff --git a/packages/store-sync/src/zustand/createStorageAdapter.ts b/packages/store-sync/src/zustand/createStorageAdapter.ts
@@ -23,6 +23,8 @@ export function createStorageAdapter<tables extends Tables>({
     const updatedIds: string[] = [];
     const deletedIds: string[] = [];
 
+    const rawRecords = { ...store.getState().rawRecords };
+
     for (const log of logs) {
       const table = store.getState().tables[log.args.tableId];
       if (!table) {
@@ -41,29 +43,23 @@ export function createStorageAdapter<tables extends Tables>({
           id,
           log,
         });
+        rawRecords[id] = {
+          id,
+          tableId: log.args.tableId,
+          keyTuple: log.args.keyTuple,
+          staticData: log.args.staticData,
+          encodedLengths: log.args.encodedLengths,
+          dynamicData: log.args.dynamicData,
+        };
         updatedIds.push(id);
-        store.setState({
-          rawRecords: {
-            ...store.getState().rawRecords,
-            [id]: {
-              id,
-              tableId: log.args.tableId,
-              keyTuple: log.args.keyTuple,
-              staticData: log.args.staticData,
-              encodedLengths: log.args.encodedLengths,
-              dynamicData: log.args.dynamicData,
-            },
-          },
-        });
       } else if (log.eventName === "Store_SpliceStaticData") {
         debug("splicing static data", {
           namespace: table.namespace,
           name: table.name,
           id,
           log,
         });
-        updatedIds.push(id);
-        const previousRecord = (store.getState().rawRecords[id] as RawRecord | undefined) ?? {
+        const previousRecord = (rawRecords[id] as RawRecord | undefined) ?? {
           id,
           tableId: log.args.tableId,
           keyTuple: log.args.keyTuple,
@@ -72,24 +68,19 @@ export function createStorageAdapter<tables extends Tables>({
           dynamicData: "0x",
         };
         const staticData = spliceHex(previousRecord.staticData, log.args.start, size(log.args.data), log.args.data);
-        store.setState({
-          rawRecords: {
-            ...store.getState().rawRecords,
-            [id]: {
-              ...previousRecord,
-              staticData,
-            },
-          },
-        });
+        rawRecords[id] = {
+          ...previousRecord,
+          staticData,
+        };
+        updatedIds.push(id);
       } else if (log.eventName === "Store_SpliceDynamicData") {
         debug("splicing dynamic data", {
           namespace: table.namespace,
           name: table.name,
           id,
           log,
         });
-        updatedIds.push(id);
-        const previousRecord = (store.getState().rawRecords[id] as RawRecord | undefined) ?? {
+        const previousRecord = (rawRecords[id] as RawRecord | undefined) ?? {
           id,
           tableId: log.args.tableId,
           keyTuple: log.args.keyTuple,
@@ -99,26 +90,21 @@ export function createStorageAdapter<tables extends Tables>({
         };
         const encodedLengths = log.args.encodedLengths;
         const dynamicData = spliceHex(previousRecord.dynamicData, log.args.start, log.args.deleteCount, log.args.data);
-        store.setState({
-          rawRecords: {
-            ...store.getState().rawRecords,
-            [id]: {
-              ...previousRecord,
-              encodedLengths,
-              dynamicData,
-            },
-          },
-        });
+        rawRecords[id] = {
+          ...previousRecord,
+          encodedLengths,
+          dynamicData,
+        };
+        updatedIds.push(id);
       } else if (log.eventName === "Store_DeleteRecord") {
         debug("deleting record", {
           namespace: table.namespace,
           name: table.name,
           id,
           log,
         });
+        delete rawRecords[id];
         deletedIds.push(id);
-        const { [id]: deletedRecord, ...rawRecords } = store.getState().rawRecords;
-        store.setState({ rawRecords });
       }
     }
 
@@ -129,7 +115,7 @@ export function createStorageAdapter<tables extends Tables>({
       ...Object.fromEntries(
         updatedIds
           .map((id) => {
-            const rawRecord = store.getState().rawRecords[id];
+            const rawRecord = rawRecords[id] as RawRecord | undefined;
             if (!rawRecord) {
               console.warn("no raw record found for updated ID", id);
               return;
@@ -155,6 +141,6 @@ export function createStorageAdapter<tables extends Tables>({
       ),
     };
 
-    store.setState({ records });
+    store.setState({ rawRecords, records });
   };
 }