@module-federation/runtime 0.1.18 → 0.1.19

package/dist/index.cjs.js

@@ -563,7 +563,8 @@ function normalizePreloadExposes(exposes) {
         return expose;
     });
 }
-function preloadAssets(remoteInfo, host, assets) {
+function preloadAssets(remoteInfo, host, assets, // It is used to distinguish preload from load remote parallel loading
+useLinkPreload = true) {
     const { cssAssets, jsAssetsWithoutEntry, entryAssets } = assets;
     if (host.options.inBrowser) {
         entryAssets.forEach((asset)=>{
@@ -615,40 +616,96 @@ function preloadAssets(remoteInfo, host, assets) {
                 });
             }
         });
-        const fragment = document.createDocumentFragment();
-        cssAssets.forEach((cssUrl)=>{
-            const { link: cssEl, needAttach } = sdk.createLink(cssUrl, ()=>{}, {
-                rel: 'preload',
-                as: 'style'
-            }, (url)=>{
-                const res = host.loaderHook.lifecycle.createLink.emit({
-                    url
+        if (useLinkPreload) {
+            cssAssets.forEach((cssUrl)=>{
+                const { link: cssEl, needAttach } = sdk.createLink({
+                    url: cssUrl,
+                    cb: ()=>{},
+                    attrs: {
+                        rel: 'preload',
+                        as: 'style',
+                        crossorigin: 'anonymous'
+                    },
+                    createLinkHook: (url)=>{
+                        const res = host.loaderHook.lifecycle.createLink.emit({
+                            url
+                        });
+                        if (res instanceof HTMLLinkElement) {
+                            return res;
+                        }
+                        return;
+                    }
                 });
-                if (res instanceof HTMLLinkElement) {
-                    return res;
-                }
-                return;
+                needAttach && document.head.appendChild(cssEl);
             });
-            needAttach && fragment.appendChild(cssEl);
-        });
-        jsAssetsWithoutEntry.forEach((jsUrl)=>{
-            const { link: linkEl, needAttach } = sdk.createLink(jsUrl, ()=>{
-            // noop
-            }, {
-                rel: 'preload',
-                as: 'script'
-            }, (url)=>{
-                const res = host.loaderHook.lifecycle.createLink.emit({
-                    url
+        } else {
+            cssAssets.forEach((cssUrl)=>{
+                const { link: cssEl, needAttach } = sdk.createLink({
+                    url: cssUrl,
+                    cb: ()=>{},
+                    attrs: {
+                        rel: 'stylesheet',
+                        type: 'text/css'
+                    },
+                    createLinkHook: (url)=>{
+                        const res = host.loaderHook.lifecycle.createLink.emit({
+                            url
+                        });
+                        if (res instanceof HTMLLinkElement) {
+                            return res;
+                        }
+                        return;
+                    },
+                    needDeleteLink: false
                 });
-                if (res instanceof HTMLLinkElement) {
-                    return res;
-                }
-                return;
+                needAttach && document.head.appendChild(cssEl);
             });
-            needAttach && document.head.appendChild(linkEl);
-        });
-        document.head.appendChild(fragment);
+        }
+        if (useLinkPreload) {
+            jsAssetsWithoutEntry.forEach((jsUrl)=>{
+                const { link: linkEl, needAttach } = sdk.createLink({
+                    url: jsUrl,
+                    cb: ()=>{},
+                    attrs: {
+                        rel: 'preload',
+                        as: 'script',
+                        crossorigin: 'anonymous'
+                    },
+                    createLinkHook: (url)=>{
+                        const res = host.loaderHook.lifecycle.createLink.emit({
+                            url
+                        });
+                        if (res instanceof HTMLLinkElement) {
+                            return res;
+                        }
+                        return;
+                    }
+                });
+                needAttach && document.head.appendChild(linkEl);
+            });
+        } else {
+            jsAssetsWithoutEntry.forEach((jsUrl)=>{
+                const { script: scriptEl, needAttach } = sdk.createScript({
+                    url: jsUrl,
+                    cb: ()=>{},
+                    attrs: {
+                        crossorigin: 'anonymous',
+                        fetchpriority: 'high'
+                    },
+                    createScriptHook: (url)=>{
+                        const res = host.loaderHook.lifecycle.createScript.emit({
+                            url
+                        });
+                        if (res instanceof HTMLScriptElement) {
+                            return res;
+                        }
+                        return;
+                    },
+                    needDeleteScript: true
+                });
+                needAttach && document.head.appendChild(scriptEl);
+            });
+        }
     }
 }
 
@@ -711,7 +768,7 @@ function snapshotPlugin() {
                     globalSnapshot
                 });
                 if (assets) {
-                    preloadAssets(remoteInfo, origin, assets);
+                    preloadAssets(remoteInfo, origin, assets, false);
                 }
                 return _extends$4({}, args, {
                     remoteSnapshot
@@ -1913,7 +1970,7 @@ class FederationHost {
             // maybe will change, temporarily for internal use only
             initContainer: new AsyncWaterfallHook('initContainer')
         });
-        this.version = "0.1.18";
+        this.version = "0.1.19";
         this.moduleCache = new Map();
         this.loaderHook = new PluginSystem({
             // FIXME: may not be suitable , not open to the public yet

package/dist/index.esm.js

@@ -1,6 +1,6 @@
 import { g as getGlobalHostPlugins, a as globalLoading, D as DEFAULT_REMOTE_TYPE, b as DEFAULT_SCOPE, c as getRemoteEntryExports, d as assert, s as safeToString, e as getFMId, i as isObject, f as error, w as warn, h as isPlainObject, j as isRemoteInfoWithEntry, k as isPureRemoteEntry, l as isBrowserEnv, m as getInfoWithoutType, n as getPreloaded, o as setPreloaded, p as getRegisteredShare, q as arrayOptions, r as getGlobalSnapshotInfoByModuleInfo, t as addGlobalSnapshot, u as setGlobalSnapshotInfoByModuleInfo, v as getGlobalSnapshot, G as Global, x as formatShareConfigs, y as getTargetSharedOptions, z as getGlobalShareScope, A as addUniqueItem, B as getBuilderId, C as setGlobalFederationConstructor, E as getGlobalFederationInstance, F as getGlobalFederationConstructor, H as setGlobalFederationInstance } from './share.esm.js';
 export { I as registerGlobalPlugins } from './share.esm.js';
-import { loadScriptNode, loadScript, composeKeyWithSeparator, createLink, getResourceUrl, isManifestProvider, generateSnapshotFromManifest, warn as warn$1, isBrowserEnv as isBrowserEnv$1 } from '@module-federation/sdk';
+import { loadScriptNode, loadScript, composeKeyWithSeparator, createLink, createScript, getResourceUrl, isManifestProvider, generateSnapshotFromManifest, warn as warn$1, isBrowserEnv as isBrowserEnv$1 } from '@module-federation/sdk';
 export { loadScript, loadScriptNode } from '@module-federation/sdk';
 
 // Function to match a remote with its name and expose
@@ -561,7 +561,8 @@ function normalizePreloadExposes(exposes) {
         return expose;
     });
 }
-function preloadAssets(remoteInfo, host, assets) {
+function preloadAssets(remoteInfo, host, assets, // It is used to distinguish preload from load remote parallel loading
+useLinkPreload = true) {
     const { cssAssets, jsAssetsWithoutEntry, entryAssets } = assets;
     if (host.options.inBrowser) {
         entryAssets.forEach((asset)=>{
@@ -613,40 +614,96 @@ function preloadAssets(remoteInfo, host, assets) {
                 });
             }
         });
-        const fragment = document.createDocumentFragment();
-        cssAssets.forEach((cssUrl)=>{
-            const { link: cssEl, needAttach } = createLink(cssUrl, ()=>{}, {
-                rel: 'preload',
-                as: 'style'
-            }, (url)=>{
-                const res = host.loaderHook.lifecycle.createLink.emit({
-                    url
+        if (useLinkPreload) {
+            cssAssets.forEach((cssUrl)=>{
+                const { link: cssEl, needAttach } = createLink({
+                    url: cssUrl,
+                    cb: ()=>{},
+                    attrs: {
+                        rel: 'preload',
+                        as: 'style',
+                        crossorigin: 'anonymous'
+                    },
+                    createLinkHook: (url)=>{
+                        const res = host.loaderHook.lifecycle.createLink.emit({
+                            url
+                        });
+                        if (res instanceof HTMLLinkElement) {
+                            return res;
+                        }
+                        return;
+                    }
                 });
-                if (res instanceof HTMLLinkElement) {
-                    return res;
-                }
-                return;
+                needAttach && document.head.appendChild(cssEl);
             });
-            needAttach && fragment.appendChild(cssEl);
-        });
-        jsAssetsWithoutEntry.forEach((jsUrl)=>{
-            const { link: linkEl, needAttach } = createLink(jsUrl, ()=>{
-            // noop
-            }, {
-                rel: 'preload',
-                as: 'script'
-            }, (url)=>{
-                const res = host.loaderHook.lifecycle.createLink.emit({
-                    url
+        } else {
+            cssAssets.forEach((cssUrl)=>{
+                const { link: cssEl, needAttach } = createLink({
+                    url: cssUrl,
+                    cb: ()=>{},
+                    attrs: {
+                        rel: 'stylesheet',
+                        type: 'text/css'
+                    },
+                    createLinkHook: (url)=>{
+                        const res = host.loaderHook.lifecycle.createLink.emit({
+                            url
+                        });
+                        if (res instanceof HTMLLinkElement) {
+                            return res;
+                        }
+                        return;
+                    },
+                    needDeleteLink: false
                 });
-                if (res instanceof HTMLLinkElement) {
-                    return res;
-                }
-                return;
+                needAttach && document.head.appendChild(cssEl);
             });
-            needAttach && document.head.appendChild(linkEl);
-        });
-        document.head.appendChild(fragment);
+        }
+        if (useLinkPreload) {
+            jsAssetsWithoutEntry.forEach((jsUrl)=>{
+                const { link: linkEl, needAttach } = createLink({
+                    url: jsUrl,
+                    cb: ()=>{},
+                    attrs: {
+                        rel: 'preload',
+                        as: 'script',
+                        crossorigin: 'anonymous'
+                    },
+                    createLinkHook: (url)=>{
+                        const res = host.loaderHook.lifecycle.createLink.emit({
+                            url
+                        });
+                        if (res instanceof HTMLLinkElement) {
+                            return res;
+                        }
+                        return;
+                    }
+                });
+                needAttach && document.head.appendChild(linkEl);
+            });
+        } else {
+            jsAssetsWithoutEntry.forEach((jsUrl)=>{
+                const { script: scriptEl, needAttach } = createScript({
+                    url: jsUrl,
+                    cb: ()=>{},
+                    attrs: {
+                        crossorigin: 'anonymous',
+                        fetchpriority: 'high'
+                    },
+                    createScriptHook: (url)=>{
+                        const res = host.loaderHook.lifecycle.createScript.emit({
+                            url
+                        });
+                        if (res instanceof HTMLScriptElement) {
+                            return res;
+                        }
+                        return;
+                    },
+                    needDeleteScript: true
+                });
+                needAttach && document.head.appendChild(scriptEl);
+            });
+        }
     }
 }
 
@@ -709,7 +766,7 @@ function snapshotPlugin() {
                     globalSnapshot
                 });
                 if (assets) {
-                    preloadAssets(remoteInfo, origin, assets);
+                    preloadAssets(remoteInfo, origin, assets, false);
                 }
                 return _extends$4({}, args, {
                     remoteSnapshot
@@ -1911,7 +1968,7 @@ class FederationHost {
             // maybe will change, temporarily for internal use only
             initContainer: new AsyncWaterfallHook('initContainer')
         });
-        this.version = "0.1.18";
+        this.version = "0.1.19";
         this.moduleCache = new Map();
         this.loaderHook = new PluginSystem({
             // FIXME: may not be suitable , not open to the public yet

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@module-federation/runtime",
-  "version": "0.1.18",
+  "version": "0.1.19",
   "author": "zhouxiao <codingzx@gmail.com>",
   "main": "./index.cjs.js",
   "module": "./index.esm.js",

package/dist/share.cjs.js

@@ -190,7 +190,7 @@ function getGlobalFederationConstructor() {
 function setGlobalFederationConstructor(FederationConstructor, isDebug = isDebugMode()) {
     if (isDebug) {
         globalThis.__FEDERATION__.__DEBUG_CONSTRUCTOR__ = FederationConstructor;
-        globalThis.__FEDERATION__.__DEBUG_CONSTRUCTOR_VERSION__ = "0.1.18";
+        globalThis.__FEDERATION__.__DEBUG_CONSTRUCTOR_VERSION__ = "0.1.19";
     }
 }
 // eslint-disable-next-line @typescript-eslint/ban-types

package/dist/share.esm.js

@@ -188,7 +188,7 @@ function getGlobalFederationConstructor() {
 function setGlobalFederationConstructor(FederationConstructor, isDebug = isDebugMode()) {
     if (isDebug) {
         globalThis.__FEDERATION__.__DEBUG_CONSTRUCTOR__ = FederationConstructor;
-        globalThis.__FEDERATION__.__DEBUG_CONSTRUCTOR_VERSION__ = "0.1.18";
+        globalThis.__FEDERATION__.__DEBUG_CONSTRUCTOR_VERSION__ = "0.1.19";
     }
 }
 // eslint-disable-next-line @typescript-eslint/ban-types

package/dist/src/utils/preload.d.ts

@@ -3,4 +3,4 @@ import { FederationHost } from '../core';
 export declare function defaultPreloadArgs(preloadConfig: PreloadRemoteArgs | depsPreloadArg): PreloadConfig;
 export declare function formatPreloadArgs(remotes: Array<Remote>, preloadArgs: Array<PreloadRemoteArgs>): PreloadOptions;
 export declare function normalizePreloadExposes(exposes?: string[]): string[];
-export declare function preloadAssets(remoteInfo: RemoteInfo, host: FederationHost, assets: PreloadAssets): void;
+export declare function preloadAssets(remoteInfo: RemoteInfo, host: FederationHost, assets: PreloadAssets, useLinkPreload?: boolean): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@module-federation/runtime",
-  "version": "0.1.18",
+  "version": "0.1.19",
   "author": "zhouxiao <codingzx@gmail.com>",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.esm.js",
@@ -45,6 +45,6 @@
     }
   },
   "dependencies": {
-    "@module-federation/sdk": "0.1.18"
+    "@module-federation/sdk": "0.1.19"
   }
 }