@alicloud/alfa-react 2.0.2 → 2.0.3-alpha.0

package/es/createAlfaWidget.js

@@ -44,7 +44,8 @@ function createAlfaWidget(option) {
   var _ref2 = option || {},
     name = _ref2.name,
     dependencies = _ref2.dependencies,
-    priority = _ref2.priority,
+    _ref2$priority = _ref2.priority,
+    priority = _ref2$priority === void 0 ? 'medium' : _ref2$priority,
     dynamicConfig = _ref2.dynamicConfig,
     manifest = _ref2.manifest,
     loading = _ref2.loading,
@@ -60,51 +61,69 @@ function createAlfaWidget(option) {
   if (!name) return function () {
     return null;
   };
-  var preLoader;
-  if (priority === 'high' && !IS_SSR) {
-    var p = loader.register(_objectSpread(_objectSpread({}, option), {}, {
-      // 必须设置 container，否则沙箱会创建插入一个新的 body
-      container: document.body,
-      dynamicConfig: typeof dynamicConfig === 'boolean' ? dynamicConfig : !manifest
-    }));
-    preLoader = /*#__PURE__*/function () {
-      var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-          while (1) switch (_context2.prev = _context2.next) {
-            case 0:
-              return _context2.abrupt("return", p);
-            case 1:
-            case "end":
-              return _context2.stop();
-          }
-        }, _callee2);
-      }));
-      return function preLoader() {
-        return _ref3.apply(this, arguments);
-      };
-    }();
-  }
+  var register;
+  // createAlfaWidget 创建的组件是否已经初始化
+  // 通过该变量判断是否还需要预加载
+  var initialized = false;
   var passedInOption = _objectSpread(_objectSpread({}, option), {}, {
+    noCache: true,
     sandbox: _objectSpread(_objectSpread({}, sandbox), {}, {
       sandBoxUrl: 'about:blank'
-    })
+    }),
+    // 必须设置 container，否则沙箱会创建插入一个新的 body
+    container: document.body,
+    dynamicConfig: typeof dynamicConfig === 'boolean' ? dynamicConfig : !manifest
   });
+  var createRegister = function createRegister() {
+    var p = loader.register(passedInOption);
+    return /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            return _context2.abrupt("return", p);
+          case 1:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+  };
+
+  // 创建延时函数
+  var createDelayPromise = function createDelayPromise() {
+    if (typeof delay === 'number') {
+      return new Promise(function (resolve) {
+        setTimeout(function () {
+          resolve();
+        }, delay);
+      });
+    }
+    if (typeof delay === 'function') {
+      var fnReturn = delay();
+      if (typeof fnReturn.then === 'function') return fnReturn;
+      if (typeof fnReturn === 'number') return fnReturn;
+    }
+    return undefined;
+  };
+  if (priority === 'high' && !IS_SSR) {
+    register = createRegister();
+  }
+  if (priority === 'medium' && !IS_SSR) {
+    // 默认优先级下，空闲时会去预加载微应用，而不是等待加载完成
+    if (typeof requestIdleCallback === 'function') {
+      requestIdleCallback(function () {
+        if (register || initialized) return;
+        register = createRegister();
+      });
+    } else {
+      setTimeout(function () {
+        if (register || initialized) return;
+        register = createRegister();
+      }, 0);
+    }
+  }
   var useDelay = function useDelay() {
-    return useMemo(function () {
-      if (typeof delay === 'number') {
-        return new Promise(function (resolve) {
-          setTimeout(function () {
-            resolve();
-          }, delay);
-        });
-      }
-      if (typeof delay === 'function') {
-        var fnReturn = delay();
-        if (typeof fnReturn.then === 'function') return fnReturn;
-        if (typeof fnReturn === 'number') return fnReturn;
-      }
-      return undefined;
-    }, []);
+    return useMemo(createDelayPromise, []);
   };
   if (priority === 'low' && !IS_SSR) {
     return function (props) {
@@ -120,13 +139,16 @@ function createAlfaWidget(option) {
         delayPromise: delayPromise,
         style: props.style || passedInOption.style,
         deps: dependencies || {},
-        customProps: _objectSpread({}, props),
-        preLoader: preLoader
+        customProps: _objectSpread({}, props)
+        // 低优先级下，不预加载
+        ,
+        preLoader: undefined
       }))));
     };
   }
   return function (props) {
     var delayPromise = useDelay();
+    initialized = true;
 
     // Compatible with old logic
     // props should not passed in errorBoundary
@@ -135,7 +157,7 @@ function createAlfaWidget(option) {
       style: props.style || passedInOption.style,
       deps: dependencies || {},
       customProps: _objectSpread({}, props),
-      preLoader: preLoader
+      preLoader: register
     })));
   };
 }

package/es/createApplication.js

@@ -84,6 +84,7 @@ export default function createApplication(loader) {
       preLoader: preLoader,
       container: container
     });
+    console.log('createApplication');
     var onSyncHistory = useCallbackRef(props.onSyncHistory || function () {});
     $syncHistory.current = syncHistory;
     $basename.current = basename;

package/es/version.js

@@ -1 +1 @@
-export var version = '2.0.2';
+export var version = '2.0.3-alpha.0';

package/lib/createAlfaWidget.js

@@ -56,7 +56,8 @@ function createAlfaWidget(option) {
   var _ref2 = option || {},
     name = _ref2.name,
     dependencies = _ref2.dependencies,
-    priority = _ref2.priority,
+    _ref2$priority = _ref2.priority,
+    priority = _ref2$priority === void 0 ? 'medium' : _ref2$priority,
     dynamicConfig = _ref2.dynamicConfig,
     manifest = _ref2.manifest,
     loading = _ref2.loading,
@@ -72,51 +73,69 @@ function createAlfaWidget(option) {
   if (!name) return function () {
     return null;
   };
-  var preLoader;
-  if (priority === 'high' && !_utils.IS_SSR) {
-    var p = loader.register(_objectSpread(_objectSpread({}, option), {}, {
-      // 必须设置 container，否则沙箱会创建插入一个新的 body
-      container: document.body,
-      dynamicConfig: typeof dynamicConfig === 'boolean' ? dynamicConfig : !manifest
-    }));
-    preLoader = /*#__PURE__*/function () {
-      var _ref3 = (0, _asyncToGenerator2.default)(/*#__PURE__*/_regenerator.default.mark(function _callee2() {
-        return _regenerator.default.wrap(function _callee2$(_context2) {
-          while (1) switch (_context2.prev = _context2.next) {
-            case 0:
-              return _context2.abrupt("return", p);
-            case 1:
-            case "end":
-              return _context2.stop();
-          }
-        }, _callee2);
-      }));
-      return function preLoader() {
-        return _ref3.apply(this, arguments);
-      };
-    }();
-  }
+  var register;
+  // createAlfaWidget 创建的组件是否已经初始化
+  // 通过该变量判断是否还需要预加载
+  var initialized = false;
   var passedInOption = _objectSpread(_objectSpread({}, option), {}, {
+    noCache: true,
     sandbox: _objectSpread(_objectSpread({}, sandbox), {}, {
       sandBoxUrl: 'about:blank'
-    })
+    }),
+    // 必须设置 container，否则沙箱会创建插入一个新的 body
+    container: document.body,
+    dynamicConfig: typeof dynamicConfig === 'boolean' ? dynamicConfig : !manifest
   });
+  var createRegister = function createRegister() {
+    var p = loader.register(passedInOption);
+    return /*#__PURE__*/(0, _asyncToGenerator2.default)(/*#__PURE__*/_regenerator.default.mark(function _callee2() {
+      return _regenerator.default.wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            return _context2.abrupt("return", p);
+          case 1:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+  };
+
+  // 创建延时函数
+  var createDelayPromise = function createDelayPromise() {
+    if (typeof delay === 'number') {
+      return new Promise(function (resolve) {
+        setTimeout(function () {
+          resolve();
+        }, delay);
+      });
+    }
+    if (typeof delay === 'function') {
+      var fnReturn = delay();
+      if (typeof fnReturn.then === 'function') return fnReturn;
+      if (typeof fnReturn === 'number') return fnReturn;
+    }
+    return undefined;
+  };
+  if (priority === 'high' && !_utils.IS_SSR) {
+    register = createRegister();
+  }
+  if (priority === 'medium' && !_utils.IS_SSR) {
+    // 默认优先级下，空闲时会去预加载微应用，而不是等待加载完成
+    if (typeof requestIdleCallback === 'function') {
+      requestIdleCallback(function () {
+        if (register || initialized) return;
+        register = createRegister();
+      });
+    } else {
+      setTimeout(function () {
+        if (register || initialized) return;
+        register = createRegister();
+      }, 0);
+    }
+  }
   var useDelay = function useDelay() {
-    return (0, _react.useMemo)(function () {
-      if (typeof delay === 'number') {
-        return new Promise(function (resolve) {
-          setTimeout(function () {
-            resolve();
-          }, delay);
-        });
-      }
-      if (typeof delay === 'function') {
-        var fnReturn = delay();
-        if (typeof fnReturn.then === 'function') return fnReturn;
-        if (typeof fnReturn === 'number') return fnReturn;
-      }
-      return undefined;
-    }, []);
+    return (0, _react.useMemo)(createDelayPromise, []);
   };
   if (priority === 'low' && !_utils.IS_SSR) {
     return function (props) {
@@ -132,13 +151,16 @@ function createAlfaWidget(option) {
         delayPromise: delayPromise,
         style: props.style || passedInOption.style,
         deps: dependencies || {},
-        customProps: _objectSpread({}, props),
-        preLoader: preLoader
+        customProps: _objectSpread({}, props)
+        // 低优先级下，不预加载
+        ,
+        preLoader: undefined
       }))));
     };
   }
   return function (props) {
     var delayPromise = useDelay();
+    initialized = true;
 
     // Compatible with old logic
     // props should not passed in errorBoundary
@@ -147,7 +169,7 @@ function createAlfaWidget(option) {
       style: props.style || passedInOption.style,
       deps: dependencies || {},
       customProps: _objectSpread({}, props),
-      preLoader: preLoader
+      preLoader: register
     })));
   };
 }

package/lib/createApplication.js

@@ -94,6 +94,7 @@ function createApplication(loader) {
       preLoader: preLoader,
       container: container
     });
+    console.log('createApplication');
     var onSyncHistory = (0, _hooks.useCallbackRef)(props.onSyncHistory || function () {});
     $syncHistory.current = syncHistory;
     $basename.current = basename;

package/lib/version.js

@@ -4,4 +4,4 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.version = void 0;
-var version = exports.version = '2.0.2';
+var version = exports.version = '2.0.3-alpha.0';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alicloud/alfa-react",
-  "version": "2.0.2",
+  "version": "2.0.3-alpha.0",
   "description": "Alfa Framework (React Version)",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -52,7 +52,7 @@
     "lodash-es": "^4.17.21",
     "prop-types": "^15.8.1",
     "react-lazyload": "^3.2.1",
-    "@alicloud/alfa-core": "^1.5.3",
+    "@alicloud/alfa-core": "^1.5.5",
     "@alicloud/console-os-loader": "^1.4.45-alpha.1"
   },
   "peerDependencies": {

package/types/version.d.ts

@@ -1 +1 @@
-export declare const version = "2.0.2";
+export declare const version = "2.0.3-alpha.0";