@module-federation/data-prefetch - npm Package Compare versions

Comparing version 0.0.0-next-20240617071542 to 0.0.0-next-20240701101956

CHANGELOG.md

 @module-federation/data-prefetch
 
-## 0.0.0-next-20240617071542
+## 0.0.0-next-20240701101956
 
 ### Patch Changes
 
-- Updated dependencies [103cd07]
-- Updated dependencies [364f2bc]
-  - @module-federation/runtime@0.0.0-next-20240617071542
-  - @module-federation/sdk@0.0.0-next-20240617071542
+- 3ddab21: feat(@module-federation/data-prefetch): support data prefetch in Module Federation
+- Updated dependencies [09b792d]
+- Updated dependencies [09b792d]
+  - @module-federation/sdk@0.0.0-next-20240701101956
+  - @module-federation/runtime@0.0.0-next-20240701101956

dist/cli/index.js

@@ -68,24 +68,2 @@ "use strict";
 // src/cli/index.ts
-var addTemplate = (name) => `
-export default function () {
-  let hasInit = false;
-  return {
-    name: 'data-prefetch-init-plugin',
-    beforeInit(args) {
-      if (!hasInit) {
-        hasInit = true;
-        globalThis.__FEDERATION__ = globalThis.__FEDERATION__ || {};
-        globalThis.__FEDERATION__['${import_sdk2.MFPrefetchCommon.globalKey}'] = globalThis.__FEDERATION__['${import_sdk2.MFPrefetchCommon.globalKey}'] || {
-          entryLoading: {},
-          instance: new Map(),
-          __PREFETCH_EXPORTS__: {},
-        };
-        globalThis.__FEDERATION__['${import_sdk2.MFPrefetchCommon.globalKey}']['${import_sdk2.MFPrefetchCommon.exportsKey}'] = globalThis.__FEDERATION__['${import_sdk2.MFPrefetchCommon.globalKey}']['${import_sdk2.MFPrefetchCommon.exportsKey}'] || {};
-        globalThis.__FEDERATION__['${import_sdk2.MFPrefetchCommon.globalKey}']['${import_sdk2.MFPrefetchCommon.exportsKey}']['${name}'] = import('./bootstrap');
-      }
-      return args;
-    }
-  }
-}
-`;
 var PrefetchPlugin = class {
@@ -104,2 +82,15 @@ constructor(options) {
     }
+    const { runtimePlugins } = this.options;
+    if (!Array.isArray(runtimePlugins)) {
+      this.options.runtimePlugins = [];
+    }
+    this.options.runtimePlugins.push(
+      import_path2.default.resolve(__dirname, "../esm/plugin.js")
+    );
+    this.options.runtimePlugins.push(
+      import_path2.default.resolve(__dirname, "../esm/shared/index.js")
+    );
+    if (!this.options.dataPrefetch) {
+      return;
+    }
     const prefetchs = [];
@@ -113,3 +104,3 @@ const exposeAlias = Object.keys(exposes);
       } else {
-        exposePath = exposeValue.import;
+        exposePath = exposeValue.import[0];
       }
@@ -130,9 +121,2 @@ const targetPaths = fixPrefetchPath(exposePath);
     });
-    const { runtimePlugins } = this.options;
-    if (!Array.isArray(runtimePlugins)) {
-      this.options.runtimePlugins = [];
-    }
-    this.options.runtimePlugins.push(
-      import_path2.default.resolve(__dirname, "../esm/plugin.js")
-    );
     if (!this._reWriteExports) {
@@ -158,8 +142,5 @@ return;
     import_fs_extra2.default.writeFileSync(asyncEntryPath, this._reWriteExports);
-    const prefetchEntry = import_path2.default.resolve(
-      compiler.options.context,
-      `node_modules/${TEMP_DIR}/${encodedName}/${import_sdk2.MFPrefetchCommon.fileName}`
-    );
-    import_fs_extra2.default.writeFileSync(prefetchEntry, addTemplate(name));
-    this.options.runtimePlugins.push(prefetchEntry);
+    new compiler.webpack.DefinePlugin({
+      FederationDataPrefetch: JSON.stringify(asyncEntryPath)
+    }).apply(compiler);
   }
@@ -166,0 +147,0 @@ };

dist/esm/cli/index.js

@@ -9,4 +9,3 @@ import {
 import {
-  encodeName,
-  MFPrefetchCommon
+  encodeName
 } from "@module-federation/sdk";
@@ -42,24 +41,2 @@
 // src/cli/index.ts
-var addTemplate = (name) => `
-export default function () {
-  let hasInit = false;
-  return {
-    name: 'data-prefetch-init-plugin',
-    beforeInit(args) {
-      if (!hasInit) {
-        hasInit = true;
-        globalThis.__FEDERATION__ = globalThis.__FEDERATION__ || {};
-        globalThis.__FEDERATION__['${MFPrefetchCommon.globalKey}'] = globalThis.__FEDERATION__['${MFPrefetchCommon.globalKey}'] || {
-          entryLoading: {},
-          instance: new Map(),
-          __PREFETCH_EXPORTS__: {},
-        };
-        globalThis.__FEDERATION__['${MFPrefetchCommon.globalKey}']['${MFPrefetchCommon.exportsKey}'] = globalThis.__FEDERATION__['${MFPrefetchCommon.globalKey}']['${MFPrefetchCommon.exportsKey}'] || {};
-        globalThis.__FEDERATION__['${MFPrefetchCommon.globalKey}']['${MFPrefetchCommon.exportsKey}']['${name}'] = import('./bootstrap');
-      }
-      return args;
-    }
-  }
-}
-`;
 var PrefetchPlugin = class {
@@ -78,2 +55,15 @@ constructor(options) {
     }
+    const { runtimePlugins } = this.options;
+    if (!Array.isArray(runtimePlugins)) {
+      this.options.runtimePlugins = [];
+    }
+    this.options.runtimePlugins.push(
+      path2.resolve(__dirname, "../esm/plugin.js")
+    );
+    this.options.runtimePlugins.push(
+      path2.resolve(__dirname, "../esm/shared/index.js")
+    );
+    if (!this.options.dataPrefetch) {
+      return;
+    }
     const prefetchs = [];
@@ -87,3 +77,3 @@ const exposeAlias = Object.keys(exposes);
       } else {
-        exposePath = exposeValue.import;
+        exposePath = exposeValue.import[0];
       }
@@ -104,9 +94,2 @@ const targetPaths = fixPrefetchPath(exposePath);
     });
-    const { runtimePlugins } = this.options;
-    if (!Array.isArray(runtimePlugins)) {
-      this.options.runtimePlugins = [];
-    }
-    this.options.runtimePlugins.push(
-      path2.resolve(__dirname, "../esm/plugin.js")
-    );
     if (!this._reWriteExports) {
@@ -132,8 +115,5 @@ return;
     fs2.writeFileSync(asyncEntryPath, this._reWriteExports);
-    const prefetchEntry = path2.resolve(
-      compiler.options.context,
-      `node_modules/${TEMP_DIR}/${encodedName}/${MFPrefetchCommon.fileName}`
-    );
-    fs2.writeFileSync(prefetchEntry, addTemplate(name));
-    this.options.runtimePlugins.push(prefetchEntry);
+    new compiler.webpack.DefinePlugin({
+      FederationDataPrefetch: JSON.stringify(asyncEntryPath)
+    }).apply(compiler);
   }
@@ -140,0 +120,0 @@ };

dist/esm/index.js

 import {
   prefetchPlugin
-} from "./chunk-BN3GGCE5.js";
+} from "./chunk-VJO2H3UO.js";
 import "./chunk-TTJJJ2WZ.js";
@@ -5,0 +5,0 @@ import {

dist/esm/plugin.js

 import {
   plugin_default,
   prefetchPlugin
-} from "./chunk-BN3GGCE5.js";
+} from "./chunk-VJO2H3UO.js";
 import "./chunk-TTJJJ2WZ.js";
@@ -6,0 +6,0 @@ import "./chunk-JEPJP5O3.js";

dist/esm/react/index.js

@@ -33,3 +33,3 @@ import {
     logger_default.info(
-      `2. Start Get Prefetch Data: ${options.id} - ${options.functionId} - ${startTiming}`
+      `2. Start Get Prefetch Data: ${options.id} - ${options.functionId || "default"} - ${startTiming}`
     );
@@ -63,3 +63,3 @@ }
     logger_default.info(
-      `3. Start Execute UseEffect: ${options.id} - ${options.functionId} - ${useEffectTiming}`
+      `3. Start Execute UseEffect: ${options.id} - ${options.functionId || "default"} - ${useEffectTiming}`
     );
@@ -66,0 +66,0 @@ return () => {

dist/index.js

@@ -203,5 +203,7 @@ "use strict";
 var loadingArray = [];
+var strategy = "loaded-first";
+var sharedFlag = strategy;
 var prefetchPlugin = () => ({
   name: "data-prefetch-runtime-plugin",
-  afterResolve(options) {
+  initContainer(options) {
     const { remoteSnapshot, remoteInfo, id, origin } = options;
@@ -220,2 +222,7 @@ const snapshot = remoteSnapshot;
     }
+    if (sharedFlag !== strategy) {
+      throw new Error(
+        `[Module Federation Data Prefetch]: If you want to use data prefetch, the shared strategy must be 'loaded-first'`
+      );
+    }
     const instance = MFDataPrefetch.getInstance(name) || new MFDataPrefetch(prefetchOptions);
@@ -235,16 +242,18 @@ let prefetchUrl;
       }
-      const exports = instance.getExposeExports(id);
-      logger_default.info(`1. Start Prefetch: ${id} - ${performance.now()}`);
-      const result = Object.keys(exports).map((k) => {
-        const value = instance.prefetch({
-          id,
-          functionId: k
+      return Promise.resolve().then(() => {
+        const exports = instance.getExposeExports(id);
+        logger_default.info(`1. Start Prefetch: ${id} - ${performance.now()}`);
+        const result = Object.keys(exports).map((k) => {
+          const value = instance.prefetch({
+            id,
+            functionId: k
+          });
+          const functionId = k;
+          return {
+            value,
+            functionId
+          };
         });
-        const functionId = k;
-        return {
-          value,
-          functionId
-        };
+        return result;
       });
-      return result;
     });
@@ -302,3 +311,5 @@ loadingArray.push({
       const exports = instance.getExposeExports(id);
-      logger_default.info(`1. Start Prefetch: ${id} - ${performance.now()}`);
+      logger_default.info(
+        `1. PreloadRemote Start Prefetch: ${id} - ${performance.now()}`
+      );
       const result = Object.keys(exports).map((k) => {
@@ -322,2 +333,7 @@ const value = instance.prefetch({
     return options;
+  },
+  beforeLoadShare(options) {
+    const shareInfo = options.shareInfo;
+    sharedFlag = (shareInfo == null ? void 0 : shareInfo.strategy) || sharedFlag;
+    return options;
   }
@@ -324,0 +340,0 @@ });

dist/plugin.js

@@ -199,5 +199,7 @@ "use strict";
 var loadingArray = [];
+var strategy = "loaded-first";
+var sharedFlag = strategy;
 var prefetchPlugin = () => ({
   name: "data-prefetch-runtime-plugin",
-  afterResolve(options) {
+  initContainer(options) {
     const { remoteSnapshot, remoteInfo, id, origin } = options;
@@ -216,2 +218,7 @@ const snapshot = remoteSnapshot;
     }
+    if (sharedFlag !== strategy) {
+      throw new Error(
+        `[Module Federation Data Prefetch]: If you want to use data prefetch, the shared strategy must be 'loaded-first'`
+      );
+    }
     const instance = MFDataPrefetch.getInstance(name) || new MFDataPrefetch(prefetchOptions);
@@ -231,16 +238,18 @@ let prefetchUrl;
       }
-      const exports = instance.getExposeExports(id);
-      logger_default.info(`1. Start Prefetch: ${id} - ${performance.now()}`);
-      const result = Object.keys(exports).map((k) => {
-        const value = instance.prefetch({
-          id,
-          functionId: k
+      return Promise.resolve().then(() => {
+        const exports = instance.getExposeExports(id);
+        logger_default.info(`1. Start Prefetch: ${id} - ${performance.now()}`);
+        const result = Object.keys(exports).map((k) => {
+          const value = instance.prefetch({
+            id,
+            functionId: k
+          });
+          const functionId = k;
+          return {
+            value,
+            functionId
+          };
         });
-        const functionId = k;
-        return {
-          value,
-          functionId
-        };
+        return result;
       });
-      return result;
     });
@@ -298,3 +307,5 @@ loadingArray.push({
       const exports = instance.getExposeExports(id);
-      logger_default.info(`1. Start Prefetch: ${id} - ${performance.now()}`);
+      logger_default.info(
+        `1. PreloadRemote Start Prefetch: ${id} - ${performance.now()}`
+      );
       const result = Object.keys(exports).map((k) => {
@@ -318,2 +329,7 @@ const value = instance.prefetch({
     return options;
+  },
+  beforeLoadShare(options) {
+    const shareInfo = options.shareInfo;
+    sharedFlag = (shareInfo == null ? void 0 : shareInfo.strategy) || sharedFlag;
+    return options;
   }
@@ -320,0 +336,0 @@ });

dist/react/index.js

@@ -234,3 +234,3 @@ "use strict";
     logger_default.info(
-      `2. Start Get Prefetch Data: ${options.id} - ${options.functionId} - ${startTiming}`
+      `2. Start Get Prefetch Data: ${options.id} - ${options.functionId || "default"} - ${startTiming}`
     );
@@ -264,3 +264,3 @@ }
     logger_default.info(
-      `3. Start Execute UseEffect: ${options.id} - ${options.functionId} - ${useEffectTiming}`
+      `3. Start Execute UseEffect: ${options.id} - ${options.functionId || "default"} - ${useEffectTiming}`
     );
@@ -267,0 +267,0 @@ return () => {

package.json

 {
   "name": "@module-federation/data-prefetch",
   "description": "Module Federation Data Prefetch",
-  "version": "0.0.0-next-20240617071542",
+  "version": "0.0.0-next-20240701101956",
   "author": "nieyan <[e-mail]>",
@@ -36,2 +36,7 @@ "homepage": "https://github.com/module-federation/core",
       "types": "./dist/universal/index.d.ts"
+    },
+    "./shared": {
+      "import": "./dist/esm/shared/index.js",
+      "require": "./dist/shared/index.js",
+      "types": "./dist/shared/index.d.ts"
     }
@@ -52,2 +57,5 @@ },
         "./dist/universal/index.d.ts"
+      ],
+      "shared": [
+        "./dist/shared/index.d.ts"
       ]
@@ -82,4 +90,4 @@ }
     "fs-extra": "9.1.0",
-    "@module-federation/sdk": "0.0.0-next-20240617071542",
-    "@module-federation/runtime": "0.0.0-next-20240617071542"
+    "@module-federation/sdk": "0.0.0-next-20240701101956",
+    "@module-federation/runtime": "0.0.0-next-20240701101956"
   },
@@ -86,0 +94,0 @@ "scripts": {

README.md

@@ -1,2 +0,1 @@
-Vmok Interface Prefetch
-https://vmok.bytedance.net/guide/performance/prefetch.html
+Module Federation Data Prefetch

No alert changes

Improved metrics

Total package byte prevSize

111209

increased by48.91%

Number of package files

53

increased by70.97%

Lines of code

3337

increased by49.64%

Dependency changes

• + Added@module-federation/runtime@0.0.0-next-20240701101956(transitive)

• + Added@module-federation/sdk@0.0.0-next-20240701101956(transitive)

• - Removed@module-federation/runtime@0.0.0-next-20240617071542(transitive)

• - Removed@module-federation/sdk@0.0.0-next-20240617071542(transitive)

• Updated@module-federation/runtime@0.0.0-next-20240701101956

• Updated@module-federation/sdk@0.0.0-next-20240701101956