@tarojs/runtime 3.7.0-alpha.4 → 3.7.0-alpha.6

package/dist/runtime.h5.d.ts

@@ -221,6 +221,7 @@ declare class TaroNode extends TaroEventTarget {
     constructor();
     private hydrate;
     private updateChildNodes;
+    private updateSingleChild;
     get _root(): TaroRootElement | null;
     protected findIndex(refChild: TaroNode): number;
     get _path(): string;

package/dist/runtime.h5.js

@@ -519,6 +519,18 @@ class TaroNode extends TaroEventTarget {
             value: isClean ? cleanChildNodes : rerenderChildNodes
         });
     }
+    updateSingleChild(index) {
+        this.childNodes.forEach((child, childIndex) => {
+            if (isComment(child))
+                return;
+            if (index && childIndex < index)
+                return;
+            this.enqueueUpdate({
+                path: child._path,
+                value: this.hydrate(child)
+            });
+        });
+    }
     get _root() {
         var _a;
         return ((_a = this.parentNode) === null || _a === void 0 ? void 0 : _a._root) || null;
@@ -610,22 +622,24 @@ class TaroNode extends TaroEventTarget {
         //   - cleanRef: false (No need to clean eventSource, because newChild is about to be inserted)
         //   - update: true (Need to update parent.childNodes, because parent.childNodes is reordered)
         newChild.remove({ cleanRef: false });
+        let index = 0;
         // Data structure
         newChild.parentNode = this;
         if (refChild) {
             // insertBefore & replaceChild
-            const index = this.findIndex(refChild);
+            index = this.findIndex(refChild);
             this.childNodes.splice(index, 0, newChild);
         }
         else {
             // appendChild
             this.childNodes.push(newChild);
         }
+        const childNodesLength = this.childNodes.length;
         // Serialization
         if (this._root) {
             if (!refChild) {
                 // appendChild
-                const isOnlyChild = this.childNodes.length === 1;
+                const isOnlyChild = childNodesLength === 1;
                 if (isOnlyChild) {
                     this.updateChildNodes();
                 }
@@ -644,8 +658,26 @@ class TaroNode extends TaroEventTarget {
                 });
             }
             else {
-                // insertBefore
-                this.updateChildNodes();
+                // insertBefore 有两种更新模式
+                // 比方说有 A B C 三个节点，现在要在 C 前插入 D
+                // 1. 插入 D，然后更新整个父节点的 childNodes 数组
+                // setData({ cn: [A, B, D, C] })
+                // 2. 插入 D，然后更新 D 以及 D 之后每个节点的数据
+                // setData ({
+                //   cn.[2]: D,
+                //   cn.[3]: C,
+                // })
+                // 由于微信解析 ’cn.[2]‘ 这些路径的时候也需要消耗时间，
+                // 所以根据 insertBefore 插入的位置来做不同的处理
+                const mark = childNodesLength * 2 / 3;
+                if (mark > index) {
+                    // 如果 insertBefore 的位置在 childNodes 的 2/3 前，则为了避免解析路径消耗过多的时间，采用第一种方式
+                    this.updateChildNodes();
+                }
+                else {
+                    // 如果 insertBefore 的位置在 childNodes 的 2/3 之后，则采用第二种方式，避免 childNodes 的全量更新
+                    this.updateSingleChild(index);
+                }
             }
         }
         MutationObserver.record({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tarojs/runtime",
-  "version": "3.7.0-alpha.4",
+  "version": "3.7.0-alpha.6",
   "description": "taro runtime for mini apps.",
   "main:h5": "dist/runtime.h5.js",
   "main": "dist/runtime.esm.js",
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "lodash-es": "4.17.21",
-    "@tarojs/shared": "3.7.0-alpha.4"
+    "@tarojs/shared": "3.7.0-alpha.6"
   },
   "devDependencies": {
     "@rollup/plugin-buble": "^0.21.3",