release: [email protected] (#1940)

* fix(miniapp): can't unmount component instance when unload page * build(miniapp-render): publish version 1.0.1 * build(miniapp-render): publish version 1.0.1 * build(miniapp): remove perf code in prod mode * fix(miniapp): can't get pageId in element
alibaba · Jul 2, 2020 · a97c11a · a97c11a
1 parent 1c5e12f
commit a97c11a
Show file tree

Hide file tree

Showing 4 changed files with 60 additions and 54 deletions.
diff --git a/packages/miniapp-render/package.json b/packages/miniapp-render/package.json
@@ -1,6 +1,6 @@
 {
   "name": "miniapp-render",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "DOM simulator for MiniApp",
   "files": [
     "dist"

diff --git a/packages/miniapp-render/rollup.config.js b/packages/miniapp-render/rollup.config.js
@@ -36,28 +36,22 @@ function getContainerIdentifierName(platform) {
   }
 }
 
-function getRollupConfig(platform) {
+function getRollupConfig(platform, env = 'development') {
   return {
     input: 'src/index.js',
     output: [
       {
-        file: `dist/${platform}/index.js`,
-        format: 'umd',
-        name
-      },
-      {
-        file: `dist/${platform}/index.min.js`,
+        file: env === 'development' ? `dist/${platform}/index.js` : `dist/${platform}/index.min.js`,
         format: 'umd',
         name,
-        plugins: [terser()]
+        plugins: env === 'development' ? [] : [terser()]
       },
-
     ],
     plugins: [
       commonjs(),
       resolve(),
       replace({
-        'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development'),
+        'process.env.NODE_ENV': `'${env}'`,
         'CONTAINER': getContainerIdentifierName(platform)
       }),
       babel(getBabelConfig(platform)),
@@ -68,5 +62,7 @@ function getRollupConfig(platform) {
 
 export default [
   getRollupConfig('ali'),
+  getRollupConfig('ali', 'production'),
   getRollupConfig('wechat'),
+  getRollupConfig('wechat', 'production'),
 ];
diff --git a/packages/miniapp-render/src/createConfig/page.js b/packages/miniapp-render/src/createConfig/page.js
@@ -60,7 +60,9 @@ export function getBaseLifeCycles(init, config) {
                 tasks.forEach((task, index) => {
                   if (index === tasks.length - 1) {
                     callback = () => {
-                      perf.stop('setData');
+                      if (process.env.NODE_ENV === 'development') {
+                        perf.stop('setData');
+                      }
                     };
                   }
                   if (task.type === 'children') {
@@ -78,7 +80,9 @@ export function getBaseLifeCycles(init, config) {
             }
           } else {
             this.setData(tasks[0], () => {
-              perf.stop('setData');
+              if (process.env.NODE_ENV === 'development') {
+                perf.stop('setData');
+              }
             });
           }
         }
@@ -108,6 +112,7 @@ export function getBaseLifeCycles(init, config) {
       this.window.$$trigger('beforeunload');
       this.window.$$trigger('pageunload');
       this.document.body.$$recycle(); // Recycle DOM node
+      this.app && this.app.unmount(); // Manually unmount component instance
 
       cache.destroy(this.pageId);
 
@@ -125,6 +130,7 @@ export default function(init, config, lifeCycles = []) {
     data: {
       pageId,
       root: {
+        pageId,
         children: []
       }
     },

diff --git a/packages/miniapp-render/src/node/root.js b/packages/miniapp-render/src/node/root.js
@@ -55,13 +55,13 @@ function traverseTree(node, action) {
 class RootElement extends Element {
   $$init(options, tree) {
     super.$$init(options, tree);
-    this.pendingRender = false;
+    this.allowRender = true;
     this.renderStacks = [];
   }
 
   $$destroy() {
     super.$$destroy();
-    this.pendingRender = null;
+    this.allowRender = null;
     this.renderStacks = null;
   }
 
@@ -73,57 +73,61 @@ class RootElement extends Element {
   }
 
   enqueueRender(payload) {
+    if (this.renderStacks.length === 0) {
+      setTimeout(() => {
+        this.executeRender();
+      }, 0);
+    }
     this.renderStacks.push(payload);
-    if (this.pendingRender) return;
-    this.executeRender();
   }
 
   executeRender() {
-    this.pendingRender = true;
-    setTimeout(() => {
+    if (!this.allowRender) {
+      return;
+    }
+    if (process.env.NODE_ENV === 'development') {
       perf.start('setData');
-      this.pendingRender = false;
-      // type 1: { path, start, deleteCount, item? } => need to simplify item
-      // type 2: { path, value }
-      const renderObject = {};
-      const renderStacks = [];
-      const pathCache = [];
-      const internal = cache.getDocument(this.__pageId)._internal;
-      for (let i = 0, j = this.renderStacks.length; i < j; i++) {
-        const renderTask = this.renderStacks[i];
-        const path = renderTask.path;
-        const taskInfo = getProperty(internal.data, path, pathCache);
-        if (!taskInfo.parentRendered) break;
-        if (renderTask.type === 'children') {
-          const ElementNode = renderTask.item;
-          const simplifiedNode = traverseTree(ElementNode, simplify);
-          renderTask.item = simplifiedNode;
-          pathCache.push({
-            path: renderTask.path,
-            value: renderTask.item
-          });
-        }
+    }
+    // type 1: { path, start, deleteCount, item? } => need to simplify item
+    // type 2: { path, value }
+    const renderObject = {};
+    const renderStacks = [];
+    const pathCache = [];
+    const internal = cache.getDocument(this.__pageId)._internal;
+    for (let i = 0, j = this.renderStacks.length; i < j; i++) {
+      const renderTask = this.renderStacks[i];
+      const path = renderTask.path;
+      const taskInfo = getProperty(internal.data, path, pathCache);
+      if (!taskInfo.parentRendered) break;
+      if (renderTask.type === 'children') {
+        const ElementNode = renderTask.item;
+        const simplifiedNode = traverseTree(ElementNode, simplify);
+        renderTask.item = simplifiedNode;
+        pathCache.push({
+          path: renderTask.path,
+          value: renderTask.item
+        });
+      }
 
-        if (!internal.$batchedUpdates) {
-          // there is no need to aggregate arrays if $batchedUpdate and $spliceData exist
-          if (renderTask.type === 'children') {
-            renderObject[path] = renderObject[path] || taskInfo.value || [];
-            if (renderTask.item) {
-              renderObject[path].splice(renderTask.start, renderTask.deleteCount, renderTask.item);
-            } else {
-              renderObject[path].splice(renderTask.start, renderTask.deleteCount);
-            }
+      if (!internal.$batchedUpdates) {
+        // there is no need to aggregate arrays if $batchedUpdate and $spliceData exist
+        if (renderTask.type === 'children') {
+          renderObject[path] = renderObject[path] || taskInfo.value || [];
+          if (renderTask.item) {
+            renderObject[path].splice(renderTask.start, renderTask.deleteCount, renderTask.item);
           } else {
-            renderObject[path] = renderTask.value;
+            renderObject[path].splice(renderTask.start, renderTask.deleteCount);
           }
         } else {
-          renderStacks.push(renderTask);
+          renderObject[path] = renderTask.value;
         }
+      } else {
+        renderStacks.push(renderTask);
       }
+    }
 
-      this.$$trigger('render', { args: internal.$batchedUpdates ? renderStacks : renderObject });
-      this.renderStacks = [];
-    }, 0);
+    this.$$trigger('render', { args: internal.$batchedUpdates ? renderStacks : renderObject });
+    this.renderStacks = [];
   }
 }