Merge pull request #8915 from 2betop/chore-editor-patch

perf: patch 逻辑改成批量处理提高性能

packages/amis-editor-core/src/manager.ts

@@ -1759,6 +1759,7 @@ export class EditorManager {
     }
     this.patching = true;
     this.patchingInvalid = false;
+    const batch: Array<{id: string; value: any}> = [];
     let patchList = (list: Array<EditorNodeType>) => {
       // 深度优先
       list.forEach((node: EditorNodeType) => {
@@ -1767,12 +1768,15 @@ export class EditorManager {
         }
 
         if (isAlive(node) && !node.isRegion) {
-          node.patch(this.store, force);
+          node.patch(this.store, force, (id, value) =>
+            batch.unshift({id, value})
+          );
         }
       });
     };
 
     patchList(this.store.root.children);
+    this.store.batchChangeValue(batch);
     this.patching = false;
     this.patchingInvalid && this.patchSchema(force);
   }

packages/amis-editor-core/src/store/editor.ts

@@ -54,6 +54,7 @@ import {EditorManagerConfig} from '../manager';
 import {EditorNode, EditorNodeType} from './node';
 import findIndex from 'lodash/findIndex';
 import {matchSorter} from 'match-sorter';
+import debounce from 'lodash/debounce';
 
 export interface SchemaHistory {
   versionId: number;
@@ -1043,6 +1044,15 @@ export const MainStore = types
     let doc: Document = document;
     let iframe: HTMLIFrameElement | undefined = undefined;
 
+    const lazyUpdateTargetName = debounce(
+      () => (self as any).updateTargetName(),
+      250,
+      {
+        leading: false,
+        trailing: true
+      }
+    );
+
     return {
       setLayer(value: any) {
         layer = value;
@@ -1122,7 +1132,7 @@ export const MainStore = types
         }
 
         this.resetHistory();
-        this.updateTargetName();
+        lazyUpdateTargetName();
       },
 
       insertSchema(event: PluginEvent<InsertEventContext>) {
@@ -1442,6 +1452,15 @@ export const MainStore = types
         }
       },
 
+      batchChangeValue(list: Array<{id: string; value: Schema}>) {
+        this.traceableSetSchema(
+          list.reduce((schema, item) => {
+            return JSONUpdate(schema, item.id, JSONPipeIn(item.value), true);
+          }, self.schema),
+          true
+        );
+      },
+
       /**
        * 更新特殊布局元素的位置（fixed、absolute）
        */
@@ -1818,7 +1837,7 @@ export const MainStore = types
           schema: schema
         });
         self.schema = schema;
-        this.updateTargetName();
+        lazyUpdateTargetName();
       },
 
       undo() {
@@ -1830,7 +1849,7 @@ export const MainStore = types
           const version = self.schemaHistory[idx - 1];
           self.versionId = version.versionId;
           self.schema = version.schema;
-          this.updateTargetName();
+          lazyUpdateTargetName();
           this.autoSelectRoot();
         }
       },
@@ -1843,7 +1862,7 @@ export const MainStore = types
           const version = self.schemaHistory[idx + 1];
           self.versionId = version.versionId;
           self.schema = version.schema;
-          this.updateTargetName();
+          lazyUpdateTargetName();
           this.autoSelectRoot();
         }
       },
@@ -1931,6 +1950,10 @@ export const MainStore = types
       setAppCorpusData(data: any = {}) {
         self.appCorpusData = data;
         this.updateAppLocaleState();
+      },
+
+      beforeDestroy() {
+        lazyUpdateTargetName.cancel();
       }
     };
   });

packages/amis-editor-core/src/store/node.ts

@@ -629,7 +629,11 @@ export const EditorNode = types
         self.folded = !self.folded;
       },
 
-      patch(store: any, force = false) {
+      patch(
+        store: any,
+        force = false,
+        setPatchInfo?: (id: string, value: any) => void
+      ) {
         // 避免重复 patch
         if (self.patched && !force) {
           return;
@@ -675,13 +679,9 @@ export const EditorNode = types
           ) || patched;
 
         if (patched !== schema) {
-          root.changeValueById(
-            info.id,
-            JSONPipeIn(patched),
-            undefined,
-            true,
-            true
-          );
+          setPatchInfo
+            ? setPatchInfo(info.id, patched)
+            : root.changeValueById(info.id, patched, undefined, true, true);
         }
       },