fix: load snapshot files in parallel (#8145)

akumatus · akumatus · commit 16bb00ed78cb · 2024-09-06T09:12:57.000Z
diff --git a/packages/frontend/core/src/components/affine/setting-modal/general-setting/editor/edgeless/docs/index.ts b/packages/frontend/core/src/components/affine/setting-modal/general-setting/editor/edgeless/docs/index.ts
@@ -27,20 +27,49 @@ export type DocName =
 
 const docMap = new Map<DocName, Promise<Doc | undefined>>();
 
+async function loadNote() {
+  return (await import('./note.json')).default;
+}
+
+async function loadPen() {
+  return (await import('./pen.json')).default;
+}
+
+async function loadShape() {
+  return (await import('./shape.json')).default;
+}
+
+async function loadFlow() {
+  return (await import('./flow.json')).default;
+}
+
+async function loadText() {
+  return (await import('./text.json')).default;
+}
+
+async function loadConnector() {
+  return (await import('./connector.json')).default;
+}
+
+async function loadMindmap() {
+  return (await import('./mindmap.json')).default;
+}
+
+const loaders = {
+  note: loadNote,
+  pen: loadPen,
+  shape: loadShape,
+  flow: loadFlow,
+  text: loadText,
+  connector: loadConnector,
+  mindmap: loadMindmap,
+};
+
 export async function getDocByName(name: DocName) {
-  const rawData: Record<DocName, any> = {
-    note: (await import('./note.json')).default,
-    pen: (await import('./pen.json')).default,
-    shape: (await import('./shape.json')).default,
-    flow: (await import('./flow.json')).default,
-    text: (await import('./text.json')).default,
-    connector: (await import('./connector.json')).default,
-    mindmap: (await import('./mindmap.json')).default,
-  };
   if (docMap.get(name)) {
     return docMap.get(name);
   }
-  const snapshot = rawData[name] as DocSnapshot;
+  const snapshot = (await loaders[name]()) as DocSnapshot;
   const promiseDoc = initDocFromSnapshot(snapshot);
   docMap.set(name, promiseDoc);
   return promiseDoc;
diff --git a/packages/frontend/core/src/components/affine/setting-modal/general-setting/editor/edgeless/docs/shape.json b/packages/frontend/core/src/components/affine/setting-modal/general-setting/editor/edgeless/docs/shape.json
@@ -1,14 +1,14 @@
 {
   "type": "page",
   "meta": {
-    "id": "H26C3mrHAO",
+    "id": "UpLwaWKe8S9s8krsxi3A8",
     "title": "BlockSuite Playground",
-    "createDate": 1725457623442,
+    "createDate": 1725435317986,
     "tags": []
   },
   "blocks": {
     "type": "block",
-    "id": "gMFM1yrveo",
+    "id": "mUEhyeRfVdzFKHV3w897g",
     "flavour": "affine:page",
     "version": 2,
     "props": {
@@ -24,7 +24,7 @@
     "children": [
       {
         "type": "block",
-        "id": "ICj50zYaZ-",
+        "id": "oc5oq3DFWcqVjzyevWrx6",
         "flavour": "affine:surface",
         "version": 5,
         "props": {
@@ -49,7 +49,7 @@
               "strokeStyle": "solid",
               "strokeWidth": 2,
               "textResizing": 1,
-              "xywh": "[-14.79056021743071,154.8369594850144,100.11936661988601,100.11932857954827]",
+              "xywh": "[190.275413673033,378.1994245551321,100.11936661988601,100.11932857954827]",
               "type": "shape",
               "id": "e6t9tKz8Sy"
             },
@@ -73,7 +73,7 @@
               "strokeStyle": "solid",
               "strokeWidth": 2,
               "textResizing": 1,
-              "xywh": "[145.85713815180185,171.45701762455542,131.14345570418993,66.87921230046624]",
+              "xywh": "[717.3900484965246,378.29923435003775,100.25918467911882,99.76145851000166]",
               "type": "shape",
               "id": "F8qB_zDC5Q"
             },
@@ -97,7 +97,7 @@
               "strokeStyle": "solid",
               "strokeWidth": 2,
               "textResizing": 1,
-              "xywh": "[337.5289256053383,154.8369594850144,105.1083470248982,101.65945505340866]",
+              "xywh": "[364.3172984791928,376.3029173497159,105.1083470248982,104.78589902189475]",
               "type": "shape",
               "id": "mPR44JBpcd"
             },
@@ -121,7 +121,7 @@
               "strokeStyle": "solid",
               "strokeWidth": 2,
               "textResizing": 1,
-              "xywh": "[503.16560437958293,165.36299989942228,99.95316838431143,80.60737422459296]",
+              "xywh": "[543.3481636903648,382.77123494325747,99.95316838431143,93.33554571739376]",
               "type": "shape",
               "id": "cmtluc3FWR"
             },
@@ -145,7 +145,7 @@
               "strokeStyle": "solid",
               "strokeWidth": 2,
               "textResizing": 1,
-              "xywh": "[663.6471045132407,172.22708086148566,131.14345570418993,66.87921230046624]",
+              "xywh": "[16.1402039335359,378.4574848297732,100.2126915532233,99.60320803026627]",
               "type": "shape",
               "id": "knt_TKvACR"
             }
@@ -154,28 +154,21 @@
         "children": [
           {
             "type": "block",
-            "id": "GuSXhkqpUl",
+            "id": "NSlTmqVn2NsIJCDvzIoUF",
             "flavour": "affine:frame",
             "version": 1,
             "props": {
               "title": {
                 "$blocksuite:internal:text$": true,
                 "delta": [
                   {
-                    "insert": "Frame 1"
+                    "insert": "Shapes"
                   }
                 ]
               },
               "background": "--affine-palette-transparent",
-              "xywh": "[-140.35546875000006,60.96746826171875,1079.28125,307.06640625]",
-              "index": "a0",
-              "childElementIds": {
-                "e6t9tKz8Sy": true,
-                "F8qB_zDC5Q": true,
-                "mPR44JBpcd": true,
-                "cmtluc3FWR": true,
-                "knt_TKvACR": true
-              }
+              "xywh": "[-23.859796066464128,332.87664265400565,881.5090292421075,190.55181066780085]",
+              "index": "a0"
             },
             "children": []
           }
diff --git a/packages/frontend/core/src/components/affine/setting-modal/general-setting/editor/edgeless/docs/text.json b/packages/frontend/core/src/components/affine/setting-modal/general-setting/editor/edgeless/docs/text.json
@@ -1,14 +1,14 @@
 {
   "type": "page",
   "meta": {
-    "id": "VKd9Ksg2BG",
+    "id": "NJwLoscdk4",
     "title": "BlockSuite Playground",
-    "createDate": 1725454903728,
+    "createDate": 1725610138401,
     "tags": []
   },
   "blocks": {
     "type": "block",
-    "id": "rhCCfuveZ8",
+    "id": "W-A_1geJy3",
     "flavour": "affine:page",
     "version": 2,
     "props": {
@@ -24,7 +24,7 @@
     "children": [
       {
         "type": "block",
-        "id": "1Gr7rOSQE0",
+        "id": "KNi1ipoyX6",
         "flavour": "affine:surface",
         "version": 5,
         "props": {
@@ -33,25 +33,43 @@
         "children": [
           {
             "type": "block",
-            "id": "wTA9OwLHan",
+            "id": "bv-d4LA-Nr",
             "flavour": "affine:edgeless-text",
             "version": 1,
             "props": {
-              "xywh": "[272.7708206176758,163.16667556762695,245.12498474121088,56]",
-              "index": "a1",
+              "xywh": "[18.221401559354234,201.98389611782602,800.6283921393511,489.15472412109375]",
+              "index": "a0",
               "color": "--affine-palette-line-blue",
               "fontFamily": "blocksuite:surface:Inter",
               "fontStyle": "normal",
               "fontWeight": "400",
               "textAlign": "left",
-              "scale": 1,
+              "scale": 5.435052533564726,
               "rotate": 0,
               "hasMaxWidth": true
             },
             "children": [
               {
                 "type": "block",
-                "id": "ig8oN3BQrC",
+                "id": "vkzwo90EHS",
+                "flavour": "affine:paragraph",
+                "version": 1,
+                "props": {
+                  "type": "text",
+                  "text": {
+                    "$blocksuite:internal:text$": true,
+                    "delta": [
+                      {
+                        "insert": "To Shape,"
+                      }
+                    ]
+                  }
+                },
+                "children": []
+              },
+              {
+                "type": "block",
+                "id": "0ugn1XiO-U",
                 "flavour": "affine:paragraph",
                 "version": 1,
                 "props": {
@@ -60,7 +78,7 @@
                     "$blocksuite:internal:text$": true,
                     "delta": [
                       {
-                        "insert": "To shape, Not to Adapt."
+                        "insert": "Not to Adopt."
                       }
                     ]
                   }
@@ -71,7 +89,7 @@
           },
           {
             "type": "block",
-            "id": "d3qe5CuEDW",
+            "id": "mkbmK_R1sC",
             "flavour": "affine:frame",
             "version": 1,
             "props": {
@@ -84,10 +102,10 @@
                 ]
               },
               "background": "--affine-palette-transparent",
-              "xywh": "[207.38800048828125,138.71615600585938,328.28125,106.92578125]",
-              "index": "a0",
+              "xywh": "[-21.778598440645766,126.5612581783729,880.6283921393511,640]",
+              "index": "a1",
               "childElementIds": {
-                "wTA9OwLHan": true
+                "bv-d4LA-Nr": true
               }
             },
             "children": []
diff --git a/packages/frontend/core/src/components/affine/setting-modal/general-setting/editor/edgeless/snapshot.tsx b/packages/frontend/core/src/components/affine/setting-modal/general-setting/editor/edgeless/snapshot.tsx
@@ -99,6 +99,7 @@ export const EdgelessSnapshot = (props: Props) => {
   useEffect(() => {
     // eslint-disable-next-line @typescript-eslint/no-floating-promises
     renderEditor();
+    return () => editorHostRef.current?.remove();
   }, [renderEditor]);
 
   // observe editor settings change
