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

package/dist/runtime.cjs.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.cjs.js

@@ -599,6 +599,20 @@ var TaroNode = /*@__PURE__*/(function (TaroEventTarget) {
             value: isClean ? cleanChildNodes : rerenderChildNodes
         });
     };
+    TaroNode.prototype.updateSingleChild = function updateSingleChild (index) {
+        var this$1$1 = this;
+
+        this.childNodes.forEach(function (child, childIndex) {
+            if (isComment(child))
+                { return; }
+            if (index && childIndex < index)
+                { return; }
+            this$1$1.enqueueUpdate({
+                path: child._path,
+                value: this$1$1.hydrate(child)
+            });
+        });
+    };
     prototypeAccessors._root.get = function () {
         var _a;
         return ((_a = this.parentNode) === null || _a === void 0 ? void 0 : _a._root) || null;
@@ -692,22 +706,24 @@ var TaroNode = /*@__PURE__*/(function (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 });
+        var index = 0;
         // Data structure
         newChild.parentNode = this;
         if (refChild) {
             // insertBefore & replaceChild
-            var index = this.findIndex(refChild);
+            index = this.findIndex(refChild);
             this.childNodes.splice(index, 0, newChild);
         }
         else {
             // appendChild
             this.childNodes.push(newChild);
         }
+        var childNodesLength = this.childNodes.length;
         // Serialization
         if (this._root) {
             if (!refChild) {
                 // appendChild
-                var isOnlyChild = this.childNodes.length === 1;
+                var isOnlyChild = childNodesLength === 1;
                 if (isOnlyChild) {
                     this.updateChildNodes();
                 }
@@ -726,8 +742,26 @@ var TaroNode = /*@__PURE__*/(function (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 插入的位置来做不同的处理
+                var 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/dist/runtime.esm.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.esm.js

@@ -573,6 +573,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;
@@ -664,22 +676,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();
                 }
@@ -698,8 +712,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({