@micro-zoe/micro-app 1.0.0-beta.1 → 1.0.0-beta.2

package/lib/index.esm.js

@@ -1,4 +1,4 @@
-const version = '1.0.0-beta.1';
+const version = '1.0.0-beta.2';
 // do not use isUndefined
 const isBrowser = typeof window !== 'undefined';
 // do not use isUndefined
@@ -1171,237 +1171,584 @@ function createSourceCenter() {
 }
 var sourceCenter = createSourceCenter();
 
+const scriptTypes = ['text/javascript', 'text/ecmascript', 'application/javascript', 'application/ecmascript', 'module', 'systemjs-module', 'systemjs-importmap'];
+// whether use type='module' script
+function isTypeModule(app, scriptInfo) {
+    return scriptInfo.appSpace[app.name].module && (!app.useSandbox || app.iframe);
+}
+// special script element
+function isSpecialScript(app, scriptInfo) {
+    const attrs = scriptInfo.appSpace[app.name].attrs;
+    return attrs.has('id');
+}
 /**
- *
+ * whether to run js in inline mode
+ * scene:
+ * 1. inline config for app
+ * 2. inline attr in script element
+ * 3. module script
+ * 4. script with special attr
+ */
+function isInlineMode(app, scriptInfo) {
+    return (app.inline ||
+        scriptInfo.appSpace[app.name].inline ||
+        isTypeModule(app, scriptInfo) ||
+        isSpecialScript(app, scriptInfo) ||
+        app.iframe);
+}
+// TODO: iframe重新插入window前后不一致，通过iframe Function创建的函数无法复用
+function getEffectWindow(app) {
+    return app.iframe ? app.sandBox.microAppWindow : globalEnv.rawWindow;
+}
+// Convert string code to function
+function code2Function(app, code) {
+    const targetWindow = getEffectWindow(app);
+    return new targetWindow.Function(code);
+}
+/**
+ * If the appSpace of the current js address has other app, try to reuse parsedFunction of other app
  * @param appName app.name
- * @param linkInfo linkInfo of current address
+ * @param scriptInfo scriptInfo of current address
+ * @param currentCode pure code of current address
  */
-function getExistParseCode(appName, prefix, linkInfo) {
-    const appSpace = linkInfo.appSpace;
+function getExistParseResult(app, scriptInfo, currentCode) {
+    const appSpace = scriptInfo.appSpace;
     for (const item in appSpace) {
-        if (item !== appName) {
+        if (item !== app.name) {
             const appSpaceData = appSpace[item];
-            if (appSpaceData.parsedCode) {
-                return appSpaceData.parsedCode.replace(new RegExp(createPrefix(item, true), 'g'), prefix);
+            if (appSpaceData.parsedCode === currentCode && appSpaceData.parsedFunction) {
+                return appSpaceData.parsedFunction;
             }
         }
     }
 }
-// transfer the attributes on the link to convertStyle
-function setConvertStyleAttr(convertStyle, attrs) {
+/**
+ * get parsedFunction from exist data or parsedCode
+ * @returns parsedFunction
+ */
+function getParsedFunction(app, scriptInfo, parsedCode) {
+    return getExistParseResult(app, scriptInfo, parsedCode) || code2Function(app, parsedCode);
+}
+// Prevent randomly created strings from repeating
+function getUniqueNonceSrc() {
+    const nonceStr = createNonceSrc();
+    if (sourceCenter.script.hasInfo(nonceStr)) {
+        return getUniqueNonceSrc();
+    }
+    return nonceStr;
+}
+// transfer the attributes on the script to convertScript
+function setConvertScriptAttr(convertScript, attrs) {
     attrs.forEach((value, key) => {
-        if (key === 'rel')
+        if ((key === 'type' && value === 'module') || key === 'defer' || key === 'async')
             return;
-        if (key === 'href')
-            key = 'data-origin-href';
-        convertStyle.setAttribute(key, value);
+        if (key === 'src')
+            key = 'data-origin-src';
+        globalEnv.rawSetAttribute.call(convertScript, key, value);
     });
 }
+// wrap code in sandbox
+function isWrapInSandBox(app, scriptInfo) {
+    return app.useSandbox && !isTypeModule(app, scriptInfo);
+}
+function getSandboxType(app, scriptInfo) {
+    return isWrapInSandBox(app, scriptInfo) ? app.iframe ? 'iframe' : 'with' : 'disable';
+}
 /**
- * Extract link elements
- * @param link link element
- * @param parent parent element of link
+ * Extract script elements
+ * @param script script element
+ * @param parent parent element of script
  * @param app app
- * @param microAppHead micro-app-head element
  * @param isDynamic dynamic insert
  */
-function extractLinkFromHtml(link, parent, app, isDynamic = false) {
-    const rel = link.getAttribute('rel');
-    let href = link.getAttribute('href');
+function extractScriptElement(script, parent, app, isDynamic = false) {
+    var _a;
     let replaceComment = null;
-    if (rel === 'stylesheet' && href) {
-        href = CompletionPath(href, app.url);
-        let linkInfo = sourceCenter.link.getInfo(href);
+    let src = script.getAttribute('src');
+    if (src)
+        src = CompletionPath(src, app.url);
+    if (script.hasAttribute('exclude') || checkExcludeUrl(src, app.name)) {
+        replaceComment = document.createComment('script element with exclude attribute removed by micro-app');
+    }
+    else if ((script.type &&
+        !scriptTypes.includes(script.type)) ||
+        script.hasAttribute('ignore') ||
+        checkIgnoreUrl(src, app.name)) {
+        // 配置为忽略的脚本，清空 rawDocument.currentScript，避免被忽略的脚本内获取 currentScript 出错
+        if ((_a = globalEnv.rawDocument) === null || _a === void 0 ? void 0 : _a.currentScript) {
+            delete globalEnv.rawDocument.currentScript;
+        }
+        return null;
+    }
+    else if ((globalEnv.supportModuleScript && script.noModule) ||
+        (!globalEnv.supportModuleScript && script.type === 'module')) {
+        replaceComment = document.createComment(`${script.noModule ? 'noModule' : 'module'} script ignored by micro-app`);
+    }
+    else if (src) { // remote script
+        let scriptInfo = sourceCenter.script.getInfo(src);
         const appSpaceData = {
-            attrs: getAttributes(link),
+            async: script.hasAttribute('async'),
+            defer: script.defer || script.type === 'module',
+            module: script.type === 'module',
+            inline: script.hasAttribute('inline'),
+            pure: script.hasAttribute('pure'),
+            attrs: getAttributes(script),
         };
-        if (!linkInfo) {
-            linkInfo = {
+        if (!scriptInfo) {
+            scriptInfo = {
                 code: '',
+                isExternal: true,
                 appSpace: {
                     [app.name]: appSpaceData,
                 }
             };
         }
         else {
-            linkInfo.appSpace[app.name] = linkInfo.appSpace[app.name] || appSpaceData;
+            /**
+             * Reuse when appSpace exists
+             * NOTE:
+             * 1. The same static script, appSpace must be the same (in fact, it may be different when url change)
+             * 2. The same dynamic script, appSpace may be the same, but we still reuse appSpace, which should pay attention
+             */
+            scriptInfo.appSpace[app.name] = scriptInfo.appSpace[app.name] || appSpaceData;
         }
-        sourceCenter.link.setInfo(href, linkInfo);
+        sourceCenter.script.setInfo(src, scriptInfo);
         if (!isDynamic) {
-            app.source.links.add(href);
-            replaceComment = document.createComment(`link element with href=${href} move to micro-app-head as style element`);
-            linkInfo.appSpace[app.name].placeholder = replaceComment;
+            app.source.scripts.add(src);
+            replaceComment = document.createComment(`script with src='${src}' extract by micro-app`);
         }
         else {
-            return { address: href, linkInfo };
+            return { address: src, scriptInfo };
         }
     }
-    else if (rel && ['prefetch', 'preload', 'prerender', 'icon', 'apple-touch-icon'].includes(rel)) {
-        // preload prefetch icon ....
-        if (isDynamic) {
-            replaceComment = document.createComment(`link element with rel=${rel}${href ? ' & href=' + href : ''} removed by micro-app`);
+    else if (script.textContent) { // inline script
+        /**
+         * NOTE:
+         * 1. Each inline script is unique
+         * 2. Every dynamic created inline script will be re-executed
+         * ACTION:
+         * 1. Delete dynamic inline script info after exec
+         * 2. Delete static inline script info when destroy
+         */
+        const nonceStr = getUniqueNonceSrc();
+        const scriptInfo = {
+            code: script.textContent,
+            isExternal: false,
+            appSpace: {
+                [app.name]: {
+                    async: false,
+                    defer: script.type === 'module',
+                    module: script.type === 'module',
+                    inline: script.hasAttribute('inline'),
+                    pure: script.hasAttribute('pure'),
+                    attrs: getAttributes(script),
+                }
+            }
+        };
+        if (!isDynamic) {
+            app.source.scripts.add(nonceStr);
+            sourceCenter.script.setInfo(nonceStr, scriptInfo);
+            replaceComment = document.createComment('inline script extract by micro-app');
         }
         else {
-            parent.removeChild(link);
+            // Because each dynamic script is unique, it is not put into sourceCenter
+            return { address: nonceStr, scriptInfo };
         }
     }
-    else if (href) {
-        // dns-prefetch preconnect modulepreload search ....
-        link.setAttribute('href', CompletionPath(href, app.url));
+    else if (!isDynamic) {
+        /**
+         * script with empty src or empty script.textContent remove in static html
+         * & not removed if it created by dynamic
+         */
+        replaceComment = document.createComment('script element removed by micro-app');
     }
     if (isDynamic) {
         return { replaceComment };
     }
-    else if (replaceComment) {
-        return parent.replaceChild(replaceComment, link);
+    else {
+        return parent === null || parent === void 0 ? void 0 : parent.replaceChild(replaceComment, script);
     }
 }
 /**
- * Get link remote resources
- * @param wrapElement htmlDom
- * @param app app
- * @param microAppHead micro-app-head
+ * get assets plugins
+ * @param appName app name
  */
-function fetchLinksFromHtml(wrapElement, app, microAppHead, fiberStyleResult) {
-    const styleList = Array.from(app.source.links);
-    const fetchLinkPromise = styleList.map((address) => {
-        const linkInfo = sourceCenter.link.getInfo(address);
-        return linkInfo.code ? linkInfo.code : fetchSource(address, app.name);
-    });
-    const fiberLinkTasks = fiberStyleResult ? [] : null;
-    promiseStream(fetchLinkPromise, (res) => {
-        injectFiberTask(fiberLinkTasks, () => fetchLinkSuccess(styleList[res.index], res.data, microAppHead, app));
-    }, (err) => {
-        logError(err, app.name);
-    }, () => {
-        /**
-         * 1. If fiberStyleResult exist, fiberLinkTasks must exist
-         * 2. Download link source while processing style
-         * 3. Process style first, and then process link
-         */
-        if (fiberStyleResult) {
-            fiberStyleResult.then(() => {
-                fiberLinkTasks.push(() => Promise.resolve(app.onLoad(wrapElement)));
-                serialExecFiberTasks(fiberLinkTasks);
-            });
-        }
-        else {
-            app.onLoad(wrapElement);
-        }
+function getAssetsPlugins(appName) {
+    var _a, _b, _c;
+    const globalPlugins = ((_a = microApp.options.plugins) === null || _a === void 0 ? void 0 : _a.global) || [];
+    const modulePlugins = ((_c = (_b = microApp.options.plugins) === null || _b === void 0 ? void 0 : _b.modules) === null || _c === void 0 ? void 0 : _c[appName]) || [];
+    return [...globalPlugins, ...modulePlugins];
+}
+/**
+ * whether the address needs to be excluded
+ * @param address css or js link
+ * @param plugins microApp plugins
+ */
+function checkExcludeUrl(address, appName) {
+    if (!address)
+        return false;
+    const plugins = getAssetsPlugins(appName) || [];
+    return plugins.some(plugin => {
+        if (!plugin.excludeChecker)
+            return false;
+        return plugin.excludeChecker(address);
     });
 }
 /**
- * Fetch link succeeded, replace placeholder with style tag
- * NOTE:
- * 1. Only exec when init, no longer exec when remount
- * 2. Only handler html link element, not dynamic link or style
- * 3. The same prefix can reuse parsedCode
- * 4. Async exec with requestIdleCallback in prefetch or fiber
- * 5. appSpace[app.name].placeholder/attrs must exist
- * @param address resource address
- * @param code link source code
- * @param microAppHead micro-app-head
- * @param app app instance
+ * whether the address needs to be ignore
+ * @param address css or js link
+ * @param plugins microApp plugins
  */
-function fetchLinkSuccess(address, code, microAppHead, app) {
-    /**
-     * linkInfo must exist, but linkInfo.code not
-     * so we set code to linkInfo.code
-     */
-    const linkInfo = sourceCenter.link.getInfo(address);
-    linkInfo.code = code;
-    const appSpaceData = linkInfo.appSpace[app.name];
-    const placeholder = appSpaceData.placeholder;
+function checkIgnoreUrl(address, appName) {
+    if (!address)
+        return false;
+    const plugins = getAssetsPlugins(appName) || [];
+    return plugins.some(plugin => {
+        if (!plugin.ignoreChecker)
+            return false;
+        return plugin.ignoreChecker(address);
+    });
+}
+/**
+ *  Get remote resources of script
+ * @param wrapElement htmlDom
+ * @param app app
+ */
+function fetchScriptsFromHtml(wrapElement, app) {
+    const scriptList = Array.from(app.source.scripts);
+    const fetchScriptPromise = [];
+    const fetchScriptPromiseInfo = [];
+    for (const address of scriptList) {
+        const scriptInfo = sourceCenter.script.getInfo(address);
+        const appSpaceData = scriptInfo.appSpace[app.name];
+        if ((!appSpaceData.defer && !appSpaceData.async) || (app.isPrefetch && !app.isPrerender)) {
+            fetchScriptPromise.push(scriptInfo.code ? scriptInfo.code : fetchSource(address, app.name));
+            fetchScriptPromiseInfo.push([address, scriptInfo]);
+        }
+    }
+    const fiberScriptTasks = app.isPrefetch || app.fiber ? [] : null;
+    if (fetchScriptPromise.length) {
+        promiseStream(fetchScriptPromise, (res) => {
+            injectFiberTask(fiberScriptTasks, () => fetchScriptSuccess(fetchScriptPromiseInfo[res.index][0], fetchScriptPromiseInfo[res.index][1], res.data, app));
+        }, (err) => {
+            logError(err, app.name);
+        }, () => {
+            if (fiberScriptTasks) {
+                fiberScriptTasks.push(() => Promise.resolve(app.onLoad(wrapElement)));
+                serialExecFiberTasks(fiberScriptTasks);
+            }
+            else {
+                app.onLoad(wrapElement);
+            }
+        });
+    }
+    else {
+        app.onLoad(wrapElement);
+    }
+}
+/**
+ * fetch js succeeded, record the code value
+ * @param address script address
+ * @param scriptInfo resource script info
+ * @param data code
+ */
+function fetchScriptSuccess(address, scriptInfo, code, app) {
+    // reset scriptInfo.code
+    scriptInfo.code = code;
     /**
-     * When prefetch app is replaced by a new app in the processing phase, since the linkInfo is common, when the linkInfo of the prefetch app is processed, it may have already been processed.
-     * This causes placeholder to be possibly null
-     * e.g.
-     * 1. prefetch app.url different from <micro-app></micro-app>
-     * 2. prefetch param different from <micro-app></micro-app>
+     * Pre parse script for prefetch, improve rendering performance
+     * NOTE:
+     * 1. if global parseResult exist, skip this step
+     * 2. if app is inline or script is esmodule, skip this step
+     * 3. if global parseResult not exist, the current script occupies the position, when js is reused, parseResult is reference
      */
-    if (placeholder) {
-        const convertStyle = pureCreateElement('style');
-        handleConvertStyle(app, address, convertStyle, linkInfo, appSpaceData.attrs);
-        if (placeholder.parentNode) {
-            placeholder.parentNode.replaceChild(convertStyle, placeholder);
-        }
-        else {
-            microAppHead.appendChild(convertStyle);
+    if (app.isPrefetch && app.prefetchLevel === 2) {
+        const appSpaceData = scriptInfo.appSpace[app.name];
+        /**
+         * When prefetch app is replaced by a new app in the processing phase, since the scriptInfo is common, when the scriptInfo of the prefetch app is processed, it may have already been processed.
+         * This causes parsedCode to already exist when preloading ends
+         * e.g.
+         * 1. prefetch app.url different from <micro-app></micro-app>
+         * 2. prefetch param different from <micro-app></micro-app>
+         */
+        if (!appSpaceData.parsedCode) {
+            appSpaceData.parsedCode = bindScope(address, app, code, scriptInfo);
+            appSpaceData.sandboxType = getSandboxType(app, scriptInfo);
+            if (!isInlineMode(app, scriptInfo)) {
+                try {
+                    appSpaceData.parsedFunction = getParsedFunction(app, scriptInfo, appSpaceData.parsedCode);
+                }
+                catch (err) {
+                    logError('Something went wrong while handling preloaded resources', app.name, '\n', err);
+                }
+            }
         }
-        // clear placeholder
-        appSpaceData.placeholder = null;
     }
 }
 /**
- * Get parsedCode, update convertStyle
- * Actions:
- * 1. get scope css (through scopedCSS or oldData)
- * 2. record parsedCode
- * 3. set parsedCode to convertStyle if need
- * @param app app instance
- * @param address resource address
- * @param convertStyle converted style
- * @param linkInfo linkInfo in sourceCenter
- * @param attrs attrs of link
+ * Execute js in the mount lifecycle
+ * @param app app
+ * @param initHook callback for umd mode
  */
-function handleConvertStyle(app, address, convertStyle, linkInfo, attrs) {
-    if (app.scopecss) {
-        const appSpaceData = linkInfo.appSpace[app.name];
-        appSpaceData.prefix = appSpaceData.prefix || createPrefix(app.name);
-        if (!appSpaceData.parsedCode) {
-            const existParsedCode = getExistParseCode(app.name, appSpaceData.prefix, linkInfo);
-            if (!existParsedCode) {
-                convertStyle.textContent = linkInfo.code;
-                scopedCSS(convertStyle, app, address);
+function execScripts(app, initHook) {
+    const fiberScriptTasks = app.fiber ? [] : null;
+    const scriptList = Array.from(app.source.scripts);
+    const deferScriptPromise = [];
+    const deferScriptInfo = [];
+    for (const address of scriptList) {
+        const scriptInfo = sourceCenter.script.getInfo(address);
+        const appSpaceData = scriptInfo.appSpace[app.name];
+        // Notice the second render
+        if (appSpaceData.defer || appSpaceData.async) {
+            // TODO: defer和module彻底分开，不要混在一起
+            if (scriptInfo.isExternal && !scriptInfo.code && !(app.iframe && appSpaceData.module)) {
+                deferScriptPromise.push(fetchSource(address, app.name));
             }
             else {
-                convertStyle.textContent = existParsedCode;
+                deferScriptPromise.push(scriptInfo.code);
             }
-            appSpaceData.parsedCode = convertStyle.textContent;
+            deferScriptInfo.push([address, scriptInfo]);
+            isTypeModule(app, scriptInfo) && (initHook.moduleCount = initHook.moduleCount ? ++initHook.moduleCount : 1);
         }
         else {
-            convertStyle.textContent = appSpaceData.parsedCode;
+            injectFiberTask(fiberScriptTasks, () => {
+                runScript(address, app, scriptInfo);
+                initHook(false);
+            });
         }
     }
+    if (deferScriptPromise.length) {
+        promiseStream(deferScriptPromise, (res) => {
+            const scriptInfo = deferScriptInfo[res.index][1];
+            scriptInfo.code = scriptInfo.code || res.data;
+        }, (err) => {
+            initHook.errorCount = initHook.errorCount ? ++initHook.errorCount : 1;
+            logError(err, app.name);
+        }, () => {
+            deferScriptInfo.forEach(([address, scriptInfo]) => {
+                if (isString(scriptInfo.code)) {
+                    injectFiberTask(fiberScriptTasks, () => {
+                        runScript(address, app, scriptInfo, initHook);
+                        !isTypeModule(app, scriptInfo) && initHook(false);
+                    });
+                }
+            });
+            /**
+             * Fiber wraps js in requestIdleCallback and executes it in sequence
+             * NOTE:
+             * 1. In order to ensure the execution order, wait for all js loaded and then execute
+             * 2. If js create a dynamic script, it may be errors in the execution order, because the subsequent js is wrapped in requestIdleCallback, even putting dynamic script in requestIdleCallback doesn't solve it
+             *
+             * BUG: NOTE.2 - execution order problem
+             */
+            if (fiberScriptTasks) {
+                fiberScriptTasks.push(() => Promise.resolve(initHook(isUndefined(initHook.moduleCount) ||
+                    initHook.errorCount === deferScriptPromise.length)));
+                serialExecFiberTasks(fiberScriptTasks);
+            }
+            else {
+                initHook(isUndefined(initHook.moduleCount) ||
+                    initHook.errorCount === deferScriptPromise.length);
+            }
+        });
+    }
     else {
-        convertStyle.textContent = linkInfo.code;
+        if (fiberScriptTasks) {
+            fiberScriptTasks.push(() => Promise.resolve(initHook(true)));
+            serialExecFiberTasks(fiberScriptTasks);
+        }
+        else {
+            initHook(true);
+        }
     }
-    setConvertStyleAttr(convertStyle, attrs);
 }
 /**
- * Handle css of dynamic link
- * @param address link address
+ * run code
+ * @param address script address
  * @param app app
- * @param linkInfo linkInfo
- * @param originLink origin link element
+ * @param scriptInfo script info
+ * @param callback callback of module script
  */
-function formatDynamicLink(address, app, linkInfo, originLink) {
-    const convertStyle = pureCreateElement('style');
-    const handleDynamicLink = () => {
-        handleConvertStyle(app, address, convertStyle, linkInfo, linkInfo.appSpace[app.name].attrs);
-        dispatchOnLoadEvent(originLink);
-    };
-    if (linkInfo.code) {
-        defer(handleDynamicLink);
+function runScript(address, app, scriptInfo, callback, replaceElement) {
+    try {
+        actionsBeforeRunScript(app);
+        const appSpaceData = scriptInfo.appSpace[app.name];
+        const sandboxType = getSandboxType(app, scriptInfo);
+        /**
+         * NOTE:
+         * 1. plugins and wrapCode will only be executed once
+         * 2. if parsedCode not exist, parsedFunction is not exist
+         * 3. if parsedCode exist, parsedFunction does not necessarily exist
+         */
+        if (!appSpaceData.parsedCode || appSpaceData.sandboxType !== sandboxType) {
+            appSpaceData.parsedCode = bindScope(address, app, scriptInfo.code, scriptInfo);
+            appSpaceData.sandboxType = sandboxType;
+            appSpaceData.parsedFunction = null;
+        }
+        if (isInlineMode(app, scriptInfo)) {
+            const scriptElement = replaceElement || pureCreateElement('script');
+            runCode2InlineScript(address, appSpaceData.parsedCode, isTypeModule(app, scriptInfo), scriptElement, appSpaceData.attrs, callback);
+            if (!replaceElement) {
+                // TEST IGNORE
+                const parent = app.iframe ? app.sandBox.microBody : app.querySelector('micro-app-body');
+                parent === null || parent === void 0 ? void 0 : parent.appendChild(scriptElement);
+            }
+        }
+        else {
+            runParsedFunction(app, scriptInfo);
+        }
     }
-    else {
-        fetchSource(address, app.name).then((data) => {
-            linkInfo.code = data;
-            handleDynamicLink();
-        }).catch((err) => {
-            logError(err, app.name);
-            dispatchOnErrorEvent(originLink);
-        });
+    catch (e) {
+        console.error(`[micro-app from ${replaceElement ? 'runDynamicScript' : 'runScript'}] app ${app.name}: `, e, address);
     }
-    return convertStyle;
 }
-
-class Adapter {
-    constructor() {
-        // keys that can only assigned to rawWindow
-        this.escapeSetterKeyList = [
-            'location',
-        ];
+/**
+ * Get dynamically created remote script
+ * @param address script address
+ * @param app app instance
+ * @param scriptInfo scriptInfo
+ * @param originScript origin script element
+ */
+function runDynamicRemoteScript(address, app, scriptInfo, originScript) {
+    const replaceElement = isInlineMode(app, scriptInfo) ? pureCreateElement('script') : document.createComment('dynamic script extract by micro-app');
+    const dispatchScriptOnLoadEvent = () => dispatchOnLoadEvent(originScript);
+    const runDynamicScript = () => {
+        const descriptor = Object.getOwnPropertyDescriptor(globalEnv.rawDocument, 'currentScript');
+        if (!descriptor || descriptor.configurable) {
+            Object.defineProperty(globalEnv.rawDocument, 'currentScript', {
+                value: originScript,
+                configurable: true,
+            });
+        }
+        runScript(address, app, scriptInfo, dispatchScriptOnLoadEvent, replaceElement);
+        !isTypeModule(app, scriptInfo) && dispatchScriptOnLoadEvent();
+    };
+    if (scriptInfo.code || (app.iframe && scriptInfo.appSpace[app.name].module)) {
+        defer(runDynamicScript);
+    }
+    else {
+        fetchSource(address, app.name).then((code) => {
+            scriptInfo.code = code;
+            runDynamicScript();
+        }).catch((err) => {
+            logError(err, app.name);
+            dispatchOnErrorEvent(originScript);
+        });
+    }
+    return replaceElement;
+}
+/**
+ * Get dynamically created inline script
+ * @param address script address
+ * @param app app instance
+ * @param scriptInfo scriptInfo
+ */
+function runDynamicInlineScript(address, app, scriptInfo) {
+    const replaceElement = isInlineMode(app, scriptInfo) ? pureCreateElement('script') : document.createComment('dynamic script extract by micro-app');
+    runScript(address, app, scriptInfo, void 0, replaceElement);
+    return replaceElement;
+}
+/**
+ * common handle for inline script
+ * @param address script address
+ * @param code bound code
+ * @param module type='module' of script
+ * @param scriptElement target script element
+ * @param attrs attributes of script element
+ * @param callback callback of module script
+ */
+function runCode2InlineScript(address, code, module, scriptElement, attrs, callback) {
+    if (module) {
+        // module script is async, transform it to a blob for subsequent operations
+        if (isInlineScript(address)) {
+            const blob = new Blob([code], { type: 'text/javascript' });
+            scriptElement.src = URL.createObjectURL(blob);
+        }
+        else {
+            scriptElement.src = address;
+        }
+        globalEnv.rawSetAttribute.call(scriptElement, 'type', 'module');
+        if (callback) {
+            callback.moduleCount && callback.moduleCount--;
+            /**
+             * module script will execute onload method only after it insert to document/iframe
+             */
+            scriptElement.onload = callback.bind(scriptElement, callback.moduleCount === 0);
+        }
+    }
+    else {
+        scriptElement.textContent = code;
+    }
+    setConvertScriptAttr(scriptElement, attrs);
+}
+// init & run code2Function
+function runParsedFunction(app, scriptInfo) {
+    const appSpaceData = scriptInfo.appSpace[app.name];
+    if (!appSpaceData.parsedFunction) {
+        appSpaceData.parsedFunction = getParsedFunction(app, scriptInfo, appSpaceData.parsedCode);
+    }
+    appSpaceData.parsedFunction.call(getEffectWindow(app));
+}
+/**
+ * bind js scope
+ * @param app app
+ * @param code code
+ * @param scriptInfo source script info
+ */
+function bindScope(address, app, code, scriptInfo) {
+    // TODO: 1、cache 2、esm code is null
+    if (isPlainObject(microApp.options.plugins)) {
+        code = usePlugins(address, code, app.name, microApp.options.plugins);
+    }
+    if (isWrapInSandBox(app, scriptInfo)) {
+        return app.iframe ? `(function(window,self,global,location){;${code}\n${isInlineScript(address) ? '' : `//# sourceURL=${address}\n`}}).call(window.__MICRO_APP_SANDBOX__.proxyWindow,window.__MICRO_APP_SANDBOX__.proxyWindow,window.__MICRO_APP_SANDBOX__.proxyWindow,window.__MICRO_APP_SANDBOX__.proxyWindow,window.__MICRO_APP_SANDBOX__.proxyLocation);` : `;(function(proxyWindow){with(proxyWindow.__MICRO_APP_WINDOW__){(function(${globalKeyToBeCached}){;${code}\n${isInlineScript(address) ? '' : `//# sourceURL=${address}\n`}}).call(proxyWindow,${globalKeyToBeCached})}})(window.__MICRO_APP_PROXY_WINDOW__);`;
+    }
+    return code;
+}
+/**
+ * actions before run script
+ */
+function actionsBeforeRunScript(app) {
+    setActiveProxyWindow(app);
+}
+/**
+ * set active sandBox.proxyWindow to window.__MICRO_APP_PROXY_WINDOW__
+ */
+function setActiveProxyWindow(app) {
+    if (app.sandBox) {
+        globalEnv.rawWindow.__MICRO_APP_PROXY_WINDOW__ = app.sandBox.proxyWindow;
+    }
+}
+/**
+ * Call the plugin to process the file
+ * @param address script address
+ * @param code code
+ * @param appName app name
+ * @param plugins plugin list
+ */
+function usePlugins(address, code, appName, plugins) {
+    var _a;
+    const newCode = processCode(plugins.global, code, address);
+    return processCode((_a = plugins.modules) === null || _a === void 0 ? void 0 : _a[appName], newCode, address);
+}
+function processCode(configs, code, address) {
+    if (!isArray(configs)) {
+        return code;
+    }
+    return configs.reduce((preCode, config) => {
+        if (isPlainObject(config) && isFunction(config.loader)) {
+            return config.loader(preCode, address);
+        }
+        return preCode;
+    }, code);
+}
+
+class Adapter {
+    constructor() {
+        // keys that can only assigned to rawWindow
+        this.escapeSetterKeyList = [
+            'location',
+        ];
         // keys that can escape to rawWindow
         this.staticEscapeProperties = [
             'System',
@@ -1521,7 +1868,10 @@ function patchElementTree(container, appName) {
 function updateElementInfo(node, appName) {
     var _a, _b;
     const proxyWindow = (_b = (_a = appInstanceMap.get(appName)) === null || _a === void 0 ? void 0 : _a.sandBox) === null || _b === void 0 ? void 0 : _b.proxyWindow;
-    if (proxyWindow && isNode(node) && !node.__MICRO_APP_NAME__) {
+    if (isNode(node) &&
+        !node.__MICRO_APP_NAME__ &&
+        !node.__PURE_ELEMENT__ &&
+        proxyWindow) {
         /**
          * TODO:
          *  1. 测试baseURI和ownerDocument在with沙箱中是否正确
@@ -1552,14 +1902,21 @@ function updateElementInfo(node, appName) {
 
 // Record element and map element
 const dynamicElementInMicroAppMap = new WeakMap();
+// Get the map element
+function getMappingNode(node) {
+    var _a;
+    return (_a = dynamicElementInMicroAppMap.get(node)) !== null && _a !== void 0 ? _a : node;
+}
 /**
  * Process the new node and format the style, link and script element
- * @param parent parent node
  * @param child new node
  * @param app app
  */
-function handleNewNode(parent, child, app) {
-    if (isStyleElement(child)) {
+function handleNewNode(child, app) {
+    if (dynamicElementInMicroAppMap.has(child)) {
+        return dynamicElementInMicroAppMap.get(child);
+    }
+    else if (isStyleElement(child)) {
         if (child.hasAttribute('exclude')) {
             const replaceComment = document.createComment('style element with exclude attribute ignored by micro-app');
             dynamicElementInMicroAppMap.set(child, replaceComment);
@@ -1583,7 +1940,7 @@ function handleNewNode(parent, child, app) {
                 microApp.options.excludeAssetFilter(child.href))) {
             return child;
         }
-        const { address, linkInfo, replaceComment } = extractLinkFromHtml(child, parent, app, true);
+        const { address, linkInfo, replaceComment } = extractLinkFromHtml(child, null, app, true);
         if (address && linkInfo) {
             const replaceStyle = formatDynamicLink(address, app, linkInfo, child);
             dynamicElementInMicroAppMap.set(child, replaceStyle);
@@ -1601,7 +1958,7 @@ function handleNewNode(parent, child, app) {
             microApp.options.excludeAssetFilter(child.src)) {
             return child;
         }
-        const { replaceComment, address, scriptInfo } = extractScriptElement(child, parent, app, true) || {};
+        const { replaceComment, address, scriptInfo } = extractScriptElement(child, null, app, true) || {};
         if (address && scriptInfo) {
             // remote script or inline script
             const replaceElement = scriptInfo.isExternal ? runDynamicRemoteScript(address, app, scriptInfo, child) : runDynamicInlineScript(address, app, scriptInfo);
@@ -1705,6 +2062,9 @@ function getHijackParent(parent, targetChild, app) {
             }
             return app.querySelector('micro-app-body');
         }
+        if (app.iframe && isScriptElement(targetChild)) {
+            return app.sandBox.microBody;
+        }
     }
     return null;
 }
@@ -1717,10 +2077,25 @@ function invokeRawMethod(rawMethod, parent, targetChild, passiveChild) {
 function isPendMethod(method) {
     return method === globalEnv.rawAppend || method === globalEnv.rawPrepend;
 }
-// Get the map element
-function getMappingNode(node) {
-    var _a;
-    return (_a = dynamicElementInMicroAppMap.get(node)) !== null && _a !== void 0 ? _a : node;
+/**
+ * Attempt to complete the static resource address again before insert the node
+ * @param app app instance
+ * @param newChild target node
+ */
+function completePathDynamic(app, newChild) {
+    if (isElement(newChild)) {
+        if (/^(img|script)$/i.test(newChild.tagName)) {
+            if (newChild.hasAttribute('src')) {
+                globalEnv.rawSetAttribute.call(newChild, 'src', CompletionPath(newChild.getAttribute('src'), app.url));
+            }
+            if (newChild.hasAttribute('srcset')) {
+                globalEnv.rawSetAttribute.call(newChild, 'srcset', CompletionPath(newChild.getAttribute('srcset'), app.url));
+            }
+        }
+        else if (/^link$/i.test(newChild.tagName) && newChild.hasAttribute('href')) {
+            globalEnv.rawSetAttribute.call(newChild, 'href', CompletionPath(newChild.getAttribute('href'), app.url));
+        }
+    }
 }
 /**
  * method of handle new node
@@ -1738,37 +2113,11 @@ function commonElementHandler(parent, newChild, passiveChild, rawMethod) {
         newChild.__MICRO_APP_NAME__ = newChild.__MICRO_APP_NAME__ || currentAppName;
         const app = appInstanceMap.get(newChild.__MICRO_APP_NAME__);
         if (app === null || app === void 0 ? void 0 : app.container) {
-            if (isElement(newChild)) {
-                if (/^(img|script)$/i.test(newChild.tagName)) {
-                    if (newChild.hasAttribute('src')) {
-                        globalEnv.rawSetAttribute.call(newChild, 'src', CompletionPath(newChild.getAttribute('src'), app.url));
-                    }
-                    if (newChild.hasAttribute('srcset')) {
-                        globalEnv.rawSetAttribute.call(newChild, 'srcset', CompletionPath(newChild.getAttribute('srcset'), app.url));
-                    }
-                }
-                else if (/^link$/i.test(newChild.tagName) && newChild.hasAttribute('href')) {
-                    globalEnv.rawSetAttribute.call(newChild, 'href', CompletionPath(newChild.getAttribute('href'), app.url));
-                }
-            }
-            return invokePrototypeMethod(app, rawMethod, parent, handleNewNode(parent, newChild, app), passiveChild && getMappingNode(passiveChild));
-        }
-        else if (rawMethod === globalEnv.rawAppend || rawMethod === globalEnv.rawPrepend) {
-            return rawMethod.call(parent, newChild);
+            completePathDynamic(app, newChild);
+            return invokePrototypeMethod(app, rawMethod, parent, handleNewNode(newChild, app), passiveChild && getMappingNode(passiveChild));
         }
     }
-    else if (rawMethod === globalEnv.rawAppend || rawMethod === globalEnv.rawPrepend) {
-        if (!isNode(newChild) && currentAppName) {
-            const app = appInstanceMap.get(currentAppName);
-            if (app === null || app === void 0 ? void 0 : app.container) {
-                if (parent === document.head) {
-                    return rawMethod.call(app.querySelector('micro-app-head'), newChild);
-                }
-                else if (parent === document.body) {
-                    return rawMethod.call(app.querySelector('micro-app-body'), newChild);
-                }
-            }
-        }
+    if (rawMethod === globalEnv.rawAppend || rawMethod === globalEnv.rawPrepend) {
         return rawMethod.call(parent, newChild);
     }
     return rawMethod.call(parent, newChild, passiveChild);
@@ -1778,33 +2127,37 @@ function commonElementHandler(parent, newChild, passiveChild, rawMethod) {
  */
 function patchElementAndDocument() {
     patchDocument();
+    const rawRootElement = globalEnv.rawRootElement;
     // prototype methods of add element👇
-    Element.prototype.appendChild = function appendChild(newChild) {
+    rawRootElement.prototype.appendChild = function appendChild(newChild) {
         return commonElementHandler(this, newChild, null, globalEnv.rawAppendChild);
     };
-    Element.prototype.insertBefore = function insertBefore(newChild, refChild) {
+    rawRootElement.prototype.insertBefore = function insertBefore(newChild, refChild) {
         return commonElementHandler(this, newChild, refChild, globalEnv.rawInsertBefore);
     };
-    Element.prototype.replaceChild = function replaceChild(newChild, oldChild) {
+    rawRootElement.prototype.replaceChild = function replaceChild(newChild, oldChild) {
         return commonElementHandler(this, newChild, oldChild, globalEnv.rawReplaceChild);
     };
-    Element.prototype.append = function append(...nodes) {
+    rawRootElement.prototype.append = function append(...nodes) {
         let i = 0;
-        const length = nodes.length;
-        while (i < length) {
-            commonElementHandler(this, nodes[i], null, globalEnv.rawAppend);
+        while (i < nodes.length) {
+            let node = nodes[i];
+            node = isNode(node) ? node : globalEnv.rawCreateTextNode.call(globalEnv.rawDocument, node);
+            commonElementHandler(this, markElement(node), null, globalEnv.rawAppend);
             i++;
         }
     };
-    Element.prototype.prepend = function prepend(...nodes) {
+    rawRootElement.prototype.prepend = function prepend(...nodes) {
         let i = nodes.length;
         while (i > 0) {
-            commonElementHandler(this, nodes[i - 1], null, globalEnv.rawPrepend);
+            let node = nodes[i - 1];
+            node = isNode(node) ? node : globalEnv.rawCreateTextNode.call(globalEnv.rawDocument, node);
+            commonElementHandler(this, markElement(node), null, globalEnv.rawPrepend);
             i--;
         }
     };
     // prototype methods of delete element👇
-    Element.prototype.removeChild = function removeChild(oldChild) {
+    rawRootElement.prototype.removeChild = function removeChild(oldChild) {
         if (oldChild === null || oldChild === void 0 ? void 0 : oldChild.__MICRO_APP_NAME__) {
             const app = appInstanceMap.get(oldChild.__MICRO_APP_NAME__);
             if (app === null || app === void 0 ? void 0 : app.container) {
@@ -1819,8 +2172,20 @@ function patchElementAndDocument() {
         }
         return globalEnv.rawRemoveChild.call(this, oldChild);
     };
+    rawRootElement.prototype.insertAdjacentElement = function (where, element) {
+        var _a;
+        if (element === null || element === void 0 ? void 0 : element.__MICRO_APP_NAME__) {
+            const app = appInstanceMap.get(element.__MICRO_APP_NAME__);
+            if (app === null || app === void 0 ? void 0 : app.container) {
+                element = handleNewNode(element, app);
+                const realParent = (_a = getHijackParent(this, element, app)) !== null && _a !== void 0 ? _a : this;
+                return globalEnv.rawInsertAdjacentElement.call(realParent, where, element);
+            }
+        }
+        return globalEnv.rawInsertAdjacentElement.call(this, where, element);
+    };
     // patch cloneNode
-    Element.prototype.cloneNode = function cloneNode(deep) {
+    rawRootElement.prototype.cloneNode = function cloneNode(deep) {
         const clonedNode = globalEnv.rawCloneNode.call(this, deep);
         this.__MICRO_APP_NAME__ && (clonedNode.__MICRO_APP_NAME__ = this.__MICRO_APP_NAME__);
         return clonedNode;
@@ -1840,17 +2205,63 @@ function patchElementAndDocument() {
         }
         return null;
     }
-    Element.prototype.querySelector = function querySelector(selectors) {
+    rawRootElement.prototype.querySelector = function querySelector(selectors) {
         var _a;
         const target = (_a = getQueryTarget(this)) !== null && _a !== void 0 ? _a : this;
         return globalEnv.rawElementQuerySelector.call(target, selectors);
     };
-    Element.prototype.querySelectorAll = function querySelectorAll(selectors) {
+    rawRootElement.prototype.querySelectorAll = function querySelectorAll(selectors) {
         var _a;
         const target = (_a = getQueryTarget(this)) !== null && _a !== void 0 ? _a : this;
         return globalEnv.rawElementQuerySelectorAll.call(target, selectors);
     };
-    rawDefineProperty(Element.prototype, 'innerHTML', {
+    // rewrite setAttribute, complete resource address
+    rawRootElement.prototype.setAttribute = function setAttribute(key, value) {
+        const appName = this.__MICRO_APP_NAME__ || getCurrentAppName();
+        if (appName &&
+            appInstanceMap.has(appName) &&
+            (((key === 'src' || key === 'srcset') && /^(img|script|video|audio|source|embed)$/i.test(this.tagName)) ||
+                (key === 'href' && /^link$/i.test(this.tagName)))) {
+            const app = appInstanceMap.get(appName);
+            value = CompletionPath(value, app.url);
+        }
+        globalEnv.rawSetAttribute.call(this, key, value);
+    };
+    /**
+     * TODO: 兼容直接通过img.src等操作设置的资源
+     * NOTE:
+     *  1. 卸载时恢复原始值
+     *  2. 循环嵌套的情况
+     *  3. 放在global_env中统一处理
+     *  4. 是否和completePathDynamic的作用重复？
+     */
+    // const protoAttrList: Array<[HTMLElement, string]> = [
+    //   [HTMLImageElement.prototype, 'src'],
+    //   [HTMLScriptElement.prototype, 'src'],
+    //   [HTMLLinkElement.prototype, 'href'],
+    // ]
+    // protoAttrList.forEach(([target, attr]) => {
+    //   const { enumerable, configurable, get, set } = Object.getOwnPropertyDescriptor(target, attr) || {
+    //     enumerable: true,
+    //     configurable: true,
+    //   }
+    //   rawDefineProperty(target, attr, {
+    //     enumerable,
+    //     configurable,
+    //     get: function () {
+    //       return get?.call(this)
+    //     },
+    //     set: function (value) {
+    //       const currentAppName = getCurrentAppName()
+    //       if (currentAppName && appInstanceMap.has(currentAppName)) {
+    //         const app = appInstanceMap.get(currentAppName)
+    //         value = CompletionPath(value, app!.url)
+    //       }
+    //       set?.call(this, value)
+    //     },
+    //   })
+    // })
+    rawDefineProperty(rawRootElement.prototype, 'innerHTML', {
         configurable: true,
         enumerable: true,
         get() {
@@ -1866,7 +2277,9 @@ function patchElementAndDocument() {
             });
         }
     });
-    // Abandon this way at 2023.2.28 before v1.0.0-beta.0, it will cause vue2 throw error when render again
+    /**
+     * NOTE:Abandon this way at 2023.2.28 before v1.0.0-beta.0, it will cause vue2 throw error when render again
+     */
     // rawDefineProperty(Node.prototype, 'parentNode', {
     //   configurable: true,
     //   enumerable: true,
@@ -1921,33 +2334,35 @@ function patchDocument() {
         const element = globalEnv.rawCreateDocumentFragment.call(getBindTarget(this));
         return markElement(element);
     };
+    // rawRootDocument.prototype.createTextNode = function createTextNode (data: string): Text {
+    //   const element = globalEnv.rawCreateTextNode.call(getBindTarget(this), data)
+    //   return markElement(element)
+    // }
     // query element👇
     function querySelector(selectors) {
-        var _a, _b, _c;
+        var _a, _b;
         const _this = getBindTarget(this);
         const currentAppName = getCurrentAppName();
         if (!currentAppName ||
-            !((_a = appInstanceMap.get(currentAppName)) === null || _a === void 0 ? void 0 : _a.container) ||
             !selectors ||
             isUniqueElement(selectors) ||
             // see https://github.com/micro-zoe/micro-app/issues/56
             rawDocument !== _this) {
             return globalEnv.rawQuerySelector.call(_this, selectors);
         }
-        return (_c = (_b = appInstanceMap.get(currentAppName)) === null || _b === void 0 ? void 0 : _b.querySelector(selectors)) !== null && _c !== void 0 ? _c : null;
+        return (_b = (_a = appInstanceMap.get(currentAppName)) === null || _a === void 0 ? void 0 : _a.querySelector(selectors)) !== null && _b !== void 0 ? _b : null;
     }
     function querySelectorAll(selectors) {
-        var _a, _b, _c;
+        var _a, _b;
         const _this = getBindTarget(this);
         const currentAppName = getCurrentAppName();
         if (!currentAppName ||
-            !((_a = appInstanceMap.get(currentAppName)) === null || _a === void 0 ? void 0 : _a.container) ||
             !selectors ||
             isUniqueElement(selectors) ||
             rawDocument !== _this) {
             return globalEnv.rawQuerySelectorAll.call(_this, selectors);
         }
-        return (_c = (_b = appInstanceMap.get(currentAppName)) === null || _b === void 0 ? void 0 : _b.querySelectorAll(selectors)) !== null && _c !== void 0 ? _c : [];
+        return (_b = (_a = appInstanceMap.get(currentAppName)) === null || _a === void 0 ? void 0 : _a.querySelectorAll(selectors)) !== null && _b !== void 0 ? _b : [];
     }
     rawRootDocument.prototype.querySelector = querySelector;
     rawRootDocument.prototype.querySelectorAll = querySelectorAll;
@@ -2005,45 +2420,6 @@ function patchDocument() {
         }
     };
 }
-/**
- * patchSetAttribute is different from other patch
- * NOTE:
- * 1. it not dependent on sandbox
- * 2. it should exec when first micro-app-element created & release when all app unmounted
- */
-let hasRewriteSetAttribute = false;
-function patchSetAttribute() {
-    if (hasRewriteSetAttribute)
-        return;
-    hasRewriteSetAttribute = true;
-    Element.prototype.setAttribute = function setAttribute(key, value) {
-        if (/^micro-app(-\S+)?/i.test(this.tagName) && key === 'data') {
-            if (isPlainObject(value)) {
-                const cloneValue = {};
-                Object.getOwnPropertyNames(value).forEach((ownKey) => {
-                    if (!(isString(ownKey) && ownKey.indexOf('__') === 0)) {
-                        cloneValue[ownKey] = value[ownKey];
-                    }
-                });
-                this.data = cloneValue;
-            }
-            else if (value !== '[object Object]') {
-                logWarn('property data must be an object', this.getAttribute('name'));
-            }
-        }
-        else {
-            const appName = this.__MICRO_APP_NAME__ || getCurrentAppName();
-            if (appName &&
-                appInstanceMap.has(appName) &&
-                (((key === 'src' || key === 'srcset') && /^(img|script|video|audio|source|embed)$/i.test(this.tagName)) ||
-                    (key === 'href' && /^link$/i.test(this.tagName)))) {
-                const app = appInstanceMap.get(appName);
-                value = CompletionPath(value, app.url);
-            }
-            globalEnv.rawSetAttribute.call(this, key, value);
-        }
-    };
-}
 function releasePatchDocument() {
     const rawRootDocument = globalEnv.rawRootDocument;
     rawRootDocument.prototype.createElement = globalEnv.rawCreateElement;
@@ -2060,21 +2436,18 @@ function releasePatchDocument() {
 function releasePatchElementAndDocument() {
     removeDomScope();
     releasePatchDocument();
-    Element.prototype.appendChild = globalEnv.rawAppendChild;
-    Element.prototype.insertBefore = globalEnv.rawInsertBefore;
-    Element.prototype.replaceChild = globalEnv.rawReplaceChild;
-    Element.prototype.removeChild = globalEnv.rawRemoveChild;
-    Element.prototype.append = globalEnv.rawAppend;
-    Element.prototype.prepend = globalEnv.rawPrepend;
-    Element.prototype.cloneNode = globalEnv.rawCloneNode;
-    Element.prototype.querySelector = globalEnv.rawElementQuerySelector;
-    Element.prototype.querySelectorAll = globalEnv.rawElementQuerySelectorAll;
-    rawDefineProperty(Element.prototype, 'innerHTML', globalEnv.rawInnerHTMLDesc);
-}
-// exec when last child unmount
-function releasePatchSetAttribute() {
-    hasRewriteSetAttribute = false;
-    Element.prototype.setAttribute = globalEnv.rawSetAttribute;
+    const rawRootElement = globalEnv.rawRootElement;
+    rawRootElement.prototype.appendChild = globalEnv.rawAppendChild;
+    rawRootElement.prototype.insertBefore = globalEnv.rawInsertBefore;
+    rawRootElement.prototype.replaceChild = globalEnv.rawReplaceChild;
+    rawRootElement.prototype.removeChild = globalEnv.rawRemoveChild;
+    rawRootElement.prototype.append = globalEnv.rawAppend;
+    rawRootElement.prototype.prepend = globalEnv.rawPrepend;
+    rawRootElement.prototype.cloneNode = globalEnv.rawCloneNode;
+    rawRootElement.prototype.querySelector = globalEnv.rawElementQuerySelector;
+    rawRootElement.prototype.querySelectorAll = globalEnv.rawElementQuerySelectorAll;
+    rawRootElement.prototype.setAttribute = globalEnv.rawSetAttribute;
+    rawDefineProperty(rawRootElement.prototype, 'innerHTML', globalEnv.rawInnerHTMLDesc);
 }
 // Set the style of micro-app-head and micro-app-body
 let hasRejectMicroAppStyle = false;
@@ -2103,23 +2476,24 @@ function initGlobalEnv() {
         const rawWindow = window.rawWindow || Function('return window')();
         const rawDocument = window.rawDocument || Function('return document')();
         const rawRootDocument = rawWindow.Document || Function('return Document')();
-        const supportModuleScript = isSupportModuleScript();
-        /**
-         * save patch raw methods
-         * pay attention to this binding
-         */
-        const rawSetAttribute = Element.prototype.setAttribute;
-        const rawAppendChild = Element.prototype.appendChild;
-        const rawInsertBefore = Element.prototype.insertBefore;
-        const rawReplaceChild = Element.prototype.replaceChild;
-        const rawRemoveChild = Element.prototype.removeChild;
-        const rawAppend = Element.prototype.append;
-        const rawPrepend = Element.prototype.prepend;
-        const rawCloneNode = Element.prototype.cloneNode;
-        const rawElementQuerySelector = Element.prototype.querySelector;
-        const rawElementQuerySelectorAll = Element.prototype.querySelectorAll;
-        const rawInnerHTMLDesc = Object.getOwnPropertyDescriptor(Element.prototype, 'innerHTML');
-        const rawParentNodeDesc = Object.getOwnPropertyDescriptor(Node.prototype, 'parentNode');
+        const rawRootElement = rawWindow.Element;
+        const rawRootNode = rawWindow.Node;
+        const rawRootEventTarget = rawWindow.EventTarget;
+        // save patch raw methods, pay attention to this binding
+        const rawSetAttribute = rawRootElement.prototype.setAttribute;
+        const rawAppendChild = rawRootElement.prototype.appendChild;
+        const rawInsertBefore = rawRootElement.prototype.insertBefore;
+        const rawReplaceChild = rawRootElement.prototype.replaceChild;
+        const rawRemoveChild = rawRootElement.prototype.removeChild;
+        const rawAppend = rawRootElement.prototype.append;
+        const rawPrepend = rawRootElement.prototype.prepend;
+        const rawCloneNode = rawRootElement.prototype.cloneNode;
+        const rawElementQuerySelector = rawRootElement.prototype.querySelector;
+        const rawElementQuerySelectorAll = rawRootElement.prototype.querySelectorAll;
+        const rawInsertAdjacentElement = rawRootElement.prototype.insertAdjacentElement;
+        const rawInnerHTMLDesc = Object.getOwnPropertyDescriptor(rawRootElement.prototype, 'innerHTML');
+        const rawParentNodeDesc = Object.getOwnPropertyDescriptor(rawRootNode.prototype, 'parentNode');
+        // Document proto methods
         const rawCreateElement = rawRootDocument.prototype.createElement;
         const rawCreateElementNS = rawRootDocument.prototype.createElementNS;
         const rawCreateDocumentFragment = rawRootDocument.prototype.createDocumentFragment;
@@ -2133,7 +2507,9 @@ function initGlobalEnv() {
         const ImageProxy = new Proxy(Image, {
             construct(Target, args) {
                 const elementImage = new Target(...args);
-                elementImage.__MICRO_APP_NAME__ = getCurrentAppName();
+                const currentAppName = getCurrentAppName();
+                if (currentAppName)
+                    elementImage.__MICRO_APP_NAME__ = currentAppName;
                 return elementImage;
             },
         });
@@ -2147,19 +2523,16 @@ function initGlobalEnv() {
         const rawClearTimeout = rawWindow.clearTimeout;
         const rawPushState = rawWindow.history.pushState;
         const rawReplaceState = rawWindow.history.replaceState;
-        const rawWindowAddEventListener = rawWindow.addEventListener;
-        const rawWindowRemoveEventListener = rawWindow.removeEventListener;
-        const rawDocumentAddEventListener = rawDocument.addEventListener;
-        const rawDocumentRemoveEventListener = rawDocument.removeEventListener;
-        // TODO: 统一使用 EventTarget 去掉上面四个
-        const rawAddEventListener = EventTarget.prototype.addEventListener;
-        const rawRemoveEventListener = EventTarget.prototype.removeEventListener;
+        const rawAddEventListener = rawRootEventTarget.prototype.addEventListener;
+        const rawRemoveEventListener = rawRootEventTarget.prototype.removeEventListener;
         assign(globalEnv, {
+            supportModuleScript: isSupportModuleScript(),
             // common global vars
             rawWindow,
             rawDocument,
             rawRootDocument,
-            supportModuleScript,
+            rawRootElement,
+            rawRootNode,
             // source/patch
             rawSetAttribute,
             rawAppendChild,
@@ -2171,6 +2544,7 @@ function initGlobalEnv() {
             rawCloneNode,
             rawElementQuerySelector,
             rawElementQuerySelectorAll,
+            rawInsertAdjacentElement,
             rawInnerHTMLDesc,
             rawParentNodeDesc,
             rawCreateElement,
@@ -2185,14 +2559,10 @@ function initGlobalEnv() {
             rawGetElementsByName,
             ImageProxy,
             // sandbox/effect
-            rawWindowAddEventListener,
-            rawWindowRemoveEventListener,
             rawSetInterval,
             rawSetTimeout,
             rawClearInterval,
             rawClearTimeout,
-            rawDocumentAddEventListener,
-            rawDocumentRemoveEventListener,
             rawPushState,
             rawReplaceState,
             rawAddEventListener,
@@ -2203,576 +2573,229 @@ function initGlobalEnv() {
     }
 }
 
-const scriptTypes = ['text/javascript', 'text/ecmascript', 'application/javascript', 'application/ecmascript', 'module', 'systemjs-module', 'systemjs-importmap'];
-// whether use type='module' script
-function isTypeModule(app, scriptInfo) {
-    return scriptInfo.appSpace[app.name].module && (!app.useSandbox || app.iframe);
-}
-// special script element
-function isSpecialScript(app, scriptInfo) {
-    const attrs = scriptInfo.appSpace[app.name].attrs;
-    return attrs.has('id');
-}
 /**
- * whether to run js in inline mode
- * scene:
- * 1. inline config for app
- * 2. inline attr in script element
- * 3. module script
- * 4. script with special attr
- */
-function isInlineMode(app, scriptInfo) {
-    return (app.inline ||
-        scriptInfo.appSpace[app.name].inline ||
-        isTypeModule(app, scriptInfo) ||
-        isSpecialScript(app, scriptInfo) ||
-        app.iframe);
-}
-// TODO: iframe重新插入window前后不一致，通过iframe Function创建的函数无法复用
-function getEffectWindow(app) {
-    return app.iframe ? app.sandBox.microAppWindow : globalEnv.rawWindow;
-}
-// Convert string code to function
-function code2Function(app, code) {
-    const targetWindow = getEffectWindow(app);
-    return new targetWindow.Function(code);
-}
-/**
- * If the appSpace of the current js address has other app, try to reuse parsedFunction of other app
+ *
  * @param appName app.name
- * @param scriptInfo scriptInfo of current address
- * @param currentCode pure code of current address
+ * @param linkInfo linkInfo of current address
  */
-function getExistParseResult(app, scriptInfo, currentCode) {
-    const appSpace = scriptInfo.appSpace;
-    for (const item in appSpace) {
-        if (item !== app.name) {
+function getExistParseCode(appName, prefix, linkInfo) {
+    const appSpace = linkInfo.appSpace;
+    for (const item in appSpace) {
+        if (item !== appName) {
             const appSpaceData = appSpace[item];
-            if (appSpaceData.parsedCode === currentCode && appSpaceData.parsedFunction) {
-                return appSpaceData.parsedFunction;
+            if (appSpaceData.parsedCode) {
+                return appSpaceData.parsedCode.replace(new RegExp(createPrefix(item, true), 'g'), prefix);
             }
         }
     }
 }
-/**
- * get parsedFunction from exist data or parsedCode
- * @returns parsedFunction
- */
-function getParsedFunction(app, scriptInfo, parsedCode) {
-    return getExistParseResult(app, scriptInfo, parsedCode) || code2Function(app, parsedCode);
-}
-// Prevent randomly created strings from repeating
-function getUniqueNonceSrc() {
-    const nonceStr = createNonceSrc();
-    if (sourceCenter.script.hasInfo(nonceStr)) {
-        return getUniqueNonceSrc();
-    }
-    return nonceStr;
-}
-// transfer the attributes on the script to convertScript
-function setConvertScriptAttr(convertScript, attrs) {
+// transfer the attributes on the link to convertStyle
+function setConvertStyleAttr(convertStyle, attrs) {
     attrs.forEach((value, key) => {
-        if ((key === 'type' && value === 'module') || key === 'defer' || key === 'async')
+        if (key === 'rel')
             return;
-        if (key === 'src')
-            key = 'data-origin-src';
-        convertScript.setAttribute(key, value);
+        if (key === 'href')
+            key = 'data-origin-href';
+        globalEnv.rawSetAttribute.call(convertStyle, key, value);
     });
 }
-// wrap code in sandbox
-function isWrapInSandBox(app, scriptInfo) {
-    return app.useSandbox && !isTypeModule(app, scriptInfo);
-}
-function getSandboxType(app, scriptInfo) {
-    return isWrapInSandBox(app, scriptInfo) ? app.iframe ? 'iframe' : 'with' : 'disable';
-}
 /**
- * Extract script elements
- * @param script script element
- * @param parent parent element of script
+ * Extract link elements
+ * @param link link element
+ * @param parent parent element of link
  * @param app app
+ * @param microAppHead micro-app-head element
  * @param isDynamic dynamic insert
  */
-function extractScriptElement(script, parent, app, isDynamic = false) {
-    var _a;
+function extractLinkFromHtml(link, parent, app, isDynamic = false) {
+    const rel = link.getAttribute('rel');
+    let href = link.getAttribute('href');
     let replaceComment = null;
-    let src = script.getAttribute('src');
-    if (src)
-        src = CompletionPath(src, app.url);
-    if (script.hasAttribute('exclude') || checkExcludeUrl(src, app.name)) {
-        replaceComment = document.createComment('script element with exclude attribute removed by micro-app');
-    }
-    else if ((script.type &&
-        !scriptTypes.includes(script.type)) ||
-        script.hasAttribute('ignore') ||
-        checkIgnoreUrl(src, app.name)) {
-        // 配置为忽略的脚本，清空 rawDocument.currentScript，避免被忽略的脚本内获取 currentScript 出错
-        if ((_a = globalEnv.rawDocument) === null || _a === void 0 ? void 0 : _a.currentScript) {
-            delete globalEnv.rawDocument.currentScript;
-        }
-        return null;
-    }
-    else if ((globalEnv.supportModuleScript && script.noModule) ||
-        (!globalEnv.supportModuleScript && script.type === 'module')) {
-        replaceComment = document.createComment(`${script.noModule ? 'noModule' : 'module'} script ignored by micro-app`);
-    }
-    else if (src) { // remote script
-        let scriptInfo = sourceCenter.script.getInfo(src);
+    if (rel === 'stylesheet' && href) {
+        href = CompletionPath(href, app.url);
+        let linkInfo = sourceCenter.link.getInfo(href);
         const appSpaceData = {
-            async: script.hasAttribute('async'),
-            defer: script.defer || script.type === 'module',
-            module: script.type === 'module',
-            inline: script.hasAttribute('inline'),
-            pure: script.hasAttribute('pure'),
-            attrs: getAttributes(script),
+            attrs: getAttributes(link),
         };
-        if (!scriptInfo) {
-            scriptInfo = {
+        if (!linkInfo) {
+            linkInfo = {
                 code: '',
-                isExternal: true,
                 appSpace: {
                     [app.name]: appSpaceData,
                 }
             };
         }
-        else {
-            /**
-             * Reuse when appSpace exists
-             * NOTE:
-             * 1. The same static script, appSpace must be the same (in fact, it may be different when url change)
-             * 2. The same dynamic script, appSpace may be the same, but we still reuse appSpace, which should pay attention
-             */
-            scriptInfo.appSpace[app.name] = scriptInfo.appSpace[app.name] || appSpaceData;
-        }
-        sourceCenter.script.setInfo(src, scriptInfo);
-        if (!isDynamic) {
-            app.source.scripts.add(src);
-            replaceComment = document.createComment(`script with src='${src}' extract by micro-app`);
-        }
-        else {
-            return { address: src, scriptInfo };
-        }
-    }
-    else if (script.textContent) { // inline script
-        /**
-         * NOTE:
-         * 1. Each inline script is unique
-         * 2. Every dynamic created inline script will be re-executed
-         * ACTION:
-         * 1. Delete dynamic inline script info after exec
-         * 2. Delete static inline script info when destroy
-         */
-        const nonceStr = getUniqueNonceSrc();
-        const scriptInfo = {
-            code: script.textContent,
-            isExternal: false,
-            appSpace: {
-                [app.name]: {
-                    async: false,
-                    defer: script.type === 'module',
-                    module: script.type === 'module',
-                    inline: script.hasAttribute('inline'),
-                    pure: script.hasAttribute('pure'),
-                    attrs: getAttributes(script),
-                }
-            }
-        };
-        if (!isDynamic) {
-            app.source.scripts.add(nonceStr);
-            sourceCenter.script.setInfo(nonceStr, scriptInfo);
-            replaceComment = document.createComment('inline script extract by micro-app');
-        }
-        else {
-            // Because each dynamic script is unique, it is not put into sourceCenter
-            return { address: nonceStr, scriptInfo };
-        }
-    }
-    else if (!isDynamic) {
-        /**
-         * script with empty src or empty script.textContent remove in static html
-         * & not removed if it created by dynamic
-         */
-        replaceComment = document.createComment('script element removed by micro-app');
-    }
-    if (isDynamic) {
-        return { replaceComment };
-    }
-    else {
-        return parent.replaceChild(replaceComment, script);
-    }
-}
-/**
- * get assets plugins
- * @param appName app name
- */
-function getAssetsPlugins(appName) {
-    var _a, _b, _c;
-    const globalPlugins = ((_a = microApp.options.plugins) === null || _a === void 0 ? void 0 : _a.global) || [];
-    const modulePlugins = ((_c = (_b = microApp.options.plugins) === null || _b === void 0 ? void 0 : _b.modules) === null || _c === void 0 ? void 0 : _c[appName]) || [];
-    return [...globalPlugins, ...modulePlugins];
-}
-/**
- * whether the address needs to be excluded
- * @param address css or js link
- * @param plugins microApp plugins
- */
-function checkExcludeUrl(address, appName) {
-    if (!address)
-        return false;
-    const plugins = getAssetsPlugins(appName) || [];
-    return plugins.some(plugin => {
-        if (!plugin.excludeChecker)
-            return false;
-        return plugin.excludeChecker(address);
-    });
-}
-/**
- * whether the address needs to be ignore
- * @param address css or js link
- * @param plugins microApp plugins
- */
-function checkIgnoreUrl(address, appName) {
-    if (!address)
-        return false;
-    const plugins = getAssetsPlugins(appName) || [];
-    return plugins.some(plugin => {
-        if (!plugin.ignoreChecker)
-            return false;
-        return plugin.ignoreChecker(address);
-    });
-}
-/**
- *  Get remote resources of script
- * @param wrapElement htmlDom
- * @param app app
- */
-function fetchScriptsFromHtml(wrapElement, app) {
-    const scriptList = Array.from(app.source.scripts);
-    const fetchScriptPromise = [];
-    const fetchScriptPromiseInfo = [];
-    for (const address of scriptList) {
-        const scriptInfo = sourceCenter.script.getInfo(address);
-        const appSpaceData = scriptInfo.appSpace[app.name];
-        if ((!appSpaceData.defer && !appSpaceData.async) || (app.isPrefetch && !app.isPrerender)) {
-            fetchScriptPromise.push(scriptInfo.code ? scriptInfo.code : fetchSource(address, app.name));
-            fetchScriptPromiseInfo.push([address, scriptInfo]);
-        }
-    }
-    const fiberScriptTasks = app.isPrefetch || app.fiber ? [] : null;
-    if (fetchScriptPromise.length) {
-        promiseStream(fetchScriptPromise, (res) => {
-            injectFiberTask(fiberScriptTasks, () => fetchScriptSuccess(fetchScriptPromiseInfo[res.index][0], fetchScriptPromiseInfo[res.index][1], res.data, app));
-        }, (err) => {
-            logError(err, app.name);
-        }, () => {
-            if (fiberScriptTasks) {
-                fiberScriptTasks.push(() => Promise.resolve(app.onLoad(wrapElement)));
-                serialExecFiberTasks(fiberScriptTasks);
-            }
-            else {
-                app.onLoad(wrapElement);
-            }
-        });
-    }
-    else {
-        app.onLoad(wrapElement);
-    }
-}
-/**
- * fetch js succeeded, record the code value
- * @param address script address
- * @param scriptInfo resource script info
- * @param data code
- */
-function fetchScriptSuccess(address, scriptInfo, code, app) {
-    // reset scriptInfo.code
-    scriptInfo.code = code;
-    /**
-     * Pre parse script for prefetch, improve rendering performance
-     * NOTE:
-     * 1. if global parseResult exist, skip this step
-     * 2. if app is inline or script is esmodule, skip this step
-     * 3. if global parseResult not exist, the current script occupies the position, when js is reused, parseResult is reference
-     */
-    if (app.isPrefetch && app.prefetchLevel === 2) {
-        const appSpaceData = scriptInfo.appSpace[app.name];
-        /**
-         * When prefetch app is replaced by a new app in the processing phase, since the scriptInfo is common, when the scriptInfo of the prefetch app is processed, it may have already been processed.
-         * This causes parsedCode to already exist when preloading ends
-         * e.g.
-         * 1. prefetch app.url different from <micro-app></micro-app>
-         * 2. prefetch param different from <micro-app></micro-app>
-         */
-        if (!appSpaceData.parsedCode) {
-            appSpaceData.parsedCode = bindScope(address, app, code, scriptInfo);
-            appSpaceData.sandboxType = getSandboxType(app, scriptInfo);
-            if (!isInlineMode(app, scriptInfo)) {
-                try {
-                    appSpaceData.parsedFunction = getParsedFunction(app, scriptInfo, appSpaceData.parsedCode);
-                }
-                catch (err) {
-                    logError('Something went wrong while handling preloaded resources', app.name, '\n', err);
-                }
-            }
-        }
-    }
-}
-/**
- * Execute js in the mount lifecycle
- * @param app app
- * @param initHook callback for umd mode
- */
-function execScripts(app, initHook) {
-    const fiberScriptTasks = app.fiber ? [] : null;
-    const scriptList = Array.from(app.source.scripts);
-    const deferScriptPromise = [];
-    const deferScriptInfo = [];
-    for (const address of scriptList) {
-        const scriptInfo = sourceCenter.script.getInfo(address);
-        const appSpaceData = scriptInfo.appSpace[app.name];
-        // Notice the second render
-        if (appSpaceData.defer || appSpaceData.async) {
-            // TODO: defer和module彻底分开，不要混在一起
-            if (scriptInfo.isExternal && !scriptInfo.code && !(app.iframe && appSpaceData.module)) {
-                deferScriptPromise.push(fetchSource(address, app.name));
-            }
-            else {
-                deferScriptPromise.push(scriptInfo.code);
-            }
-            deferScriptInfo.push([address, scriptInfo]);
-            isTypeModule(app, scriptInfo) && (initHook.moduleCount = initHook.moduleCount ? ++initHook.moduleCount : 1);
-        }
-        else {
-            injectFiberTask(fiberScriptTasks, () => {
-                runScript(address, app, scriptInfo);
-                initHook(false);
-            });
-        }
-    }
-    if (deferScriptPromise.length) {
-        promiseStream(deferScriptPromise, (res) => {
-            const scriptInfo = deferScriptInfo[res.index][1];
-            scriptInfo.code = scriptInfo.code || res.data;
-        }, (err) => {
-            initHook.errorCount = initHook.errorCount ? ++initHook.errorCount : 1;
-            logError(err, app.name);
-        }, () => {
-            deferScriptInfo.forEach(([address, scriptInfo]) => {
-                if (isString(scriptInfo.code)) {
-                    injectFiberTask(fiberScriptTasks, () => {
-                        runScript(address, app, scriptInfo, initHook);
-                        !isTypeModule(app, scriptInfo) && initHook(false);
-                    });
-                }
-            });
-            /**
-             * Fiber wraps js in requestIdleCallback and executes it in sequence
-             * NOTE:
-             * 1. In order to ensure the execution order, wait for all js loaded and then execute
-             * 2. If js create a dynamic script, it may be errors in the execution order, because the subsequent js is wrapped in requestIdleCallback, even putting dynamic script in requestIdleCallback doesn't solve it
-             *
-             * BUG: NOTE.2 - execution order problem
-             */
-            if (fiberScriptTasks) {
-                fiberScriptTasks.push(() => Promise.resolve(initHook(isUndefined(initHook.moduleCount) ||
-                    initHook.errorCount === deferScriptPromise.length)));
-                serialExecFiberTasks(fiberScriptTasks);
-            }
-            else {
-                initHook(isUndefined(initHook.moduleCount) ||
-                    initHook.errorCount === deferScriptPromise.length);
-            }
-        });
-    }
-    else {
-        if (fiberScriptTasks) {
-            fiberScriptTasks.push(() => Promise.resolve(initHook(true)));
-            serialExecFiberTasks(fiberScriptTasks);
-        }
-        else {
-            initHook(true);
-        }
-    }
-}
-/**
- * run code
- * @param address script address
- * @param app app
- * @param scriptInfo script info
- * @param callback callback of module script
- */
-function runScript(address, app, scriptInfo, callback, replaceElement) {
-    try {
-        actionsBeforeRunScript(app);
-        const appSpaceData = scriptInfo.appSpace[app.name];
-        const sandboxType = getSandboxType(app, scriptInfo);
-        /**
-         * NOTE:
-         * 1. plugins and wrapCode will only be executed once
-         * 2. if parsedCode not exist, parsedFunction is not exist
-         * 3. if parsedCode exist, parsedFunction does not necessarily exist
-         */
-        if (!appSpaceData.parsedCode || appSpaceData.sandboxType !== sandboxType) {
-            appSpaceData.parsedCode = bindScope(address, app, scriptInfo.code, scriptInfo);
-            appSpaceData.sandboxType = sandboxType;
-            appSpaceData.parsedFunction = null;
-        }
-        if (isInlineMode(app, scriptInfo)) {
-            const scriptElement = replaceElement || pureCreateElement('script');
-            runCode2InlineScript(address, appSpaceData.parsedCode, isTypeModule(app, scriptInfo), scriptElement, appSpaceData.attrs, callback);
-            if (!replaceElement) {
-                // TEST IGNORE
-                const parent = app.iframe ? app.sandBox.microBody : app.querySelector('micro-app-body');
-                parent === null || parent === void 0 ? void 0 : parent.appendChild(scriptElement);
-            }
-        }
-        else {
-            runParsedFunction(app, scriptInfo);
-        }
-    }
-    catch (e) {
-        console.error(`[micro-app from ${replaceElement ? 'runDynamicScript' : 'runScript'}] app ${app.name}: `, e, address);
-    }
-}
-/**
- * Get dynamically created remote script
- * @param address script address
- * @param app app instance
- * @param scriptInfo scriptInfo
- * @param originScript origin script element
- */
-function runDynamicRemoteScript(address, app, scriptInfo, originScript) {
-    const replaceElement = isInlineMode(app, scriptInfo) ? pureCreateElement('script') : document.createComment('dynamic script extract by micro-app');
-    const dispatchScriptOnLoadEvent = () => dispatchOnLoadEvent(originScript);
-    const runDynamicScript = () => {
-        const descriptor = Object.getOwnPropertyDescriptor(globalEnv.rawDocument, 'currentScript');
-        if (!descriptor || descriptor.configurable) {
-            Object.defineProperty(globalEnv.rawDocument, 'currentScript', {
-                value: originScript,
-                configurable: true,
-            });
-        }
-        runScript(address, app, scriptInfo, dispatchScriptOnLoadEvent, replaceElement);
-        !isTypeModule(app, scriptInfo) && dispatchScriptOnLoadEvent();
-    };
-    if (scriptInfo.code || (app.iframe && scriptInfo.appSpace[app.name].module)) {
-        defer(runDynamicScript);
-    }
-    else {
-        fetchSource(address, app.name).then((code) => {
-            scriptInfo.code = code;
-            runDynamicScript();
-        }).catch((err) => {
-            logError(err, app.name);
-            dispatchOnErrorEvent(originScript);
-        });
-    }
-    return replaceElement;
-}
-/**
- * Get dynamically created inline script
- * @param address script address
- * @param app app instance
- * @param scriptInfo scriptInfo
- */
-function runDynamicInlineScript(address, app, scriptInfo) {
-    const replaceElement = isInlineMode(app, scriptInfo) ? pureCreateElement('script') : document.createComment('dynamic script extract by micro-app');
-    runScript(address, app, scriptInfo, void 0, replaceElement);
-    return replaceElement;
-}
-/**
- * common handle for inline script
- * @param address script address
- * @param code bound code
- * @param module type='module' of script
- * @param scriptElement target script element
- * @param attrs attributes of script element
- * @param callback callback of module script
- */
-function runCode2InlineScript(address, code, module, scriptElement, attrs, callback) {
-    if (module) {
-        // module script is async, transform it to a blob for subsequent operations
-        if (isInlineScript(address)) {
-            const blob = new Blob([code], { type: 'text/javascript' });
-            scriptElement.src = URL.createObjectURL(blob);
+        else {
+            linkInfo.appSpace[app.name] = linkInfo.appSpace[app.name] || appSpaceData;
+        }
+        sourceCenter.link.setInfo(href, linkInfo);
+        if (!isDynamic) {
+            app.source.links.add(href);
+            replaceComment = document.createComment(`link element with href=${href} move to micro-app-head as style element`);
+            linkInfo.appSpace[app.name].placeholder = replaceComment;
         }
         else {
-            scriptElement.src = address;
+            return { address: href, linkInfo };
         }
-        scriptElement.setAttribute('type', 'module');
-        if (callback) {
-            callback.moduleCount && callback.moduleCount--;
-            /**
-             * module script will execute onload method only after it insert to document/iframe
-             */
-            scriptElement.onload = callback.bind(scriptElement, callback.moduleCount === 0);
+    }
+    else if (rel && ['prefetch', 'preload', 'prerender', 'icon', 'apple-touch-icon'].includes(rel)) {
+        // preload prefetch icon ....
+        if (isDynamic) {
+            replaceComment = document.createComment(`link element with rel=${rel}${href ? ' & href=' + href : ''} removed by micro-app`);
+        }
+        else {
+            parent === null || parent === void 0 ? void 0 : parent.removeChild(link);
         }
     }
-    else {
-        scriptElement.textContent = code;
+    else if (href) {
+        // dns-prefetch preconnect modulepreload search ....
+        globalEnv.rawSetAttribute.call(link, 'href', CompletionPath(href, app.url));
     }
-    setConvertScriptAttr(scriptElement, attrs);
-}
-// init & run code2Function
-function runParsedFunction(app, scriptInfo) {
-    const appSpaceData = scriptInfo.appSpace[app.name];
-    if (!appSpaceData.parsedFunction) {
-        appSpaceData.parsedFunction = getParsedFunction(app, scriptInfo, appSpaceData.parsedCode);
+    if (isDynamic) {
+        return { replaceComment };
+    }
+    else if (replaceComment) {
+        return parent === null || parent === void 0 ? void 0 : parent.replaceChild(replaceComment, link);
     }
-    appSpaceData.parsedFunction.call(getEffectWindow(app));
 }
 /**
- * bind js scope
+ * Get link remote resources
+ * @param wrapElement htmlDom
  * @param app app
- * @param code code
- * @param scriptInfo source script info
+ * @param microAppHead micro-app-head
  */
-function bindScope(address, app, code, scriptInfo) {
-    // TODO: 1、cache 2、esm code is null
-    if (isPlainObject(microApp.options.plugins)) {
-        code = usePlugins(address, code, app.name, microApp.options.plugins);
-    }
-    if (isWrapInSandBox(app, scriptInfo)) {
-        return app.iframe ? `(function(window,self,global,location){;${code}\n${isInlineScript(address) ? '' : `//# sourceURL=${address}\n`}}).call(window.__MICRO_APP_SANDBOX__.proxyWindow,window.__MICRO_APP_SANDBOX__.proxyWindow,window.__MICRO_APP_SANDBOX__.proxyWindow,window.__MICRO_APP_SANDBOX__.proxyWindow,window.__MICRO_APP_SANDBOX__.proxyLocation);` : `;(function(proxyWindow){with(proxyWindow.__MICRO_APP_WINDOW__){(function(${globalKeyToBeCached}){;${code}\n${isInlineScript(address) ? '' : `//# sourceURL=${address}\n`}}).call(proxyWindow,${globalKeyToBeCached})}})(window.__MICRO_APP_PROXY_WINDOW__);`;
-    }
-    return code;
+function fetchLinksFromHtml(wrapElement, app, microAppHead, fiberStyleResult) {
+    const styleList = Array.from(app.source.links);
+    const fetchLinkPromise = styleList.map((address) => {
+        const linkInfo = sourceCenter.link.getInfo(address);
+        return linkInfo.code ? linkInfo.code : fetchSource(address, app.name);
+    });
+    const fiberLinkTasks = fiberStyleResult ? [] : null;
+    promiseStream(fetchLinkPromise, (res) => {
+        injectFiberTask(fiberLinkTasks, () => fetchLinkSuccess(styleList[res.index], res.data, microAppHead, app));
+    }, (err) => {
+        logError(err, app.name);
+    }, () => {
+        /**
+         * 1. If fiberStyleResult exist, fiberLinkTasks must exist
+         * 2. Download link source while processing style
+         * 3. Process style first, and then process link
+         */
+        if (fiberStyleResult) {
+            fiberStyleResult.then(() => {
+                fiberLinkTasks.push(() => Promise.resolve(app.onLoad(wrapElement)));
+                serialExecFiberTasks(fiberLinkTasks);
+            });
+        }
+        else {
+            app.onLoad(wrapElement);
+        }
+    });
 }
 /**
- * actions before run script
+ * Fetch link succeeded, replace placeholder with style tag
+ * NOTE:
+ * 1. Only exec when init, no longer exec when remount
+ * 2. Only handler html link element, not dynamic link or style
+ * 3. The same prefix can reuse parsedCode
+ * 4. Async exec with requestIdleCallback in prefetch or fiber
+ * 5. appSpace[app.name].placeholder/attrs must exist
+ * @param address resource address
+ * @param code link source code
+ * @param microAppHead micro-app-head
+ * @param app app instance
  */
-function actionsBeforeRunScript(app) {
-    setActiveProxyWindow(app);
+function fetchLinkSuccess(address, code, microAppHead, app) {
+    /**
+     * linkInfo must exist, but linkInfo.code not
+     * so we set code to linkInfo.code
+     */
+    const linkInfo = sourceCenter.link.getInfo(address);
+    linkInfo.code = code;
+    const appSpaceData = linkInfo.appSpace[app.name];
+    const placeholder = appSpaceData.placeholder;
+    /**
+     * When prefetch app is replaced by a new app in the processing phase, since the linkInfo is common, when the linkInfo of the prefetch app is processed, it may have already been processed.
+     * This causes placeholder to be possibly null
+     * e.g.
+     * 1. prefetch app.url different from <micro-app></micro-app>
+     * 2. prefetch param different from <micro-app></micro-app>
+     */
+    if (placeholder) {
+        const convertStyle = pureCreateElement('style');
+        handleConvertStyle(app, address, convertStyle, linkInfo, appSpaceData.attrs);
+        if (placeholder.parentNode) {
+            placeholder.parentNode.replaceChild(convertStyle, placeholder);
+        }
+        else {
+            microAppHead.appendChild(convertStyle);
+        }
+        // clear placeholder
+        appSpaceData.placeholder = null;
+    }
 }
 /**
- * set active sandBox.proxyWindow to window.__MICRO_APP_PROXY_WINDOW__
+ * Get parsedCode, update convertStyle
+ * Actions:
+ * 1. get scope css (through scopedCSS or oldData)
+ * 2. record parsedCode
+ * 3. set parsedCode to convertStyle if need
+ * @param app app instance
+ * @param address resource address
+ * @param convertStyle converted style
+ * @param linkInfo linkInfo in sourceCenter
+ * @param attrs attrs of link
  */
-function setActiveProxyWindow(app) {
-    if (app.sandBox) {
-        globalEnv.rawWindow.__MICRO_APP_PROXY_WINDOW__ = app.sandBox.proxyWindow;
+function handleConvertStyle(app, address, convertStyle, linkInfo, attrs) {
+    if (app.scopecss) {
+        const appSpaceData = linkInfo.appSpace[app.name];
+        appSpaceData.prefix = appSpaceData.prefix || createPrefix(app.name);
+        if (!appSpaceData.parsedCode) {
+            const existParsedCode = getExistParseCode(app.name, appSpaceData.prefix, linkInfo);
+            if (!existParsedCode) {
+                convertStyle.textContent = linkInfo.code;
+                scopedCSS(convertStyle, app, address);
+            }
+            else {
+                convertStyle.textContent = existParsedCode;
+            }
+            appSpaceData.parsedCode = convertStyle.textContent;
+        }
+        else {
+            convertStyle.textContent = appSpaceData.parsedCode;
+        }
+    }
+    else {
+        convertStyle.textContent = linkInfo.code;
     }
+    setConvertStyleAttr(convertStyle, attrs);
 }
 /**
- * Call the plugin to process the file
- * @param address script address
- * @param code code
- * @param appName app name
- * @param plugins plugin list
+ * Handle css of dynamic link
+ * @param address link address
+ * @param app app
+ * @param linkInfo linkInfo
+ * @param originLink origin link element
  */
-function usePlugins(address, code, appName, plugins) {
-    var _a;
-    const newCode = processCode(plugins.global, code, address);
-    return processCode((_a = plugins.modules) === null || _a === void 0 ? void 0 : _a[appName], newCode, address);
-}
-function processCode(configs, code, address) {
-    if (!isArray(configs)) {
-        return code;
+function formatDynamicLink(address, app, linkInfo, originLink) {
+    const convertStyle = pureCreateElement('style');
+    const handleDynamicLink = () => {
+        handleConvertStyle(app, address, convertStyle, linkInfo, linkInfo.appSpace[app.name].attrs);
+        dispatchOnLoadEvent(originLink);
+    };
+    if (linkInfo.code) {
+        defer(handleDynamicLink);
     }
-    return configs.reduce((preCode, config) => {
-        if (isPlainObject(config) && isFunction(config.loader)) {
-            return config.loader(preCode, address);
-        }
-        return preCode;
-    }, code);
+    else {
+        fetchSource(address, app.name).then((data) => {
+            linkInfo.code = data;
+            handleDynamicLink();
+        }).catch((err) => {
+            logError(err, app.name);
+            dispatchOnErrorEvent(originLink);
+        });
+    }
+    return convertStyle;
 }
 
 /**
@@ -2804,7 +2827,7 @@ function flatChildren(parent, app, microAppHead, fiberStyleTasks) {
                 extractLinkFromHtml(dom, parent, app);
             }
             else if (dom.hasAttribute('href')) {
-                dom.setAttribute('href', CompletionPath(dom.getAttribute('href'), app.url));
+                globalEnv.rawSetAttribute.call(dom, 'href', CompletionPath(dom.getAttribute('href'), app.url));
             }
         }
         else if (isStyleElement(dom)) {
@@ -2819,7 +2842,7 @@ function flatChildren(parent, app, microAppHead, fiberStyleTasks) {
             extractScriptElement(dom, parent, app);
         }
         else if (isImageElement(dom) && dom.hasAttribute('src')) {
-            dom.setAttribute('src', CompletionPath(dom.getAttribute('src'), app.url));
+            globalEnv.rawSetAttribute.call(dom, 'src', CompletionPath(dom.getAttribute('src'), app.url));
         }
         /**
          * Don't remove meta and title, they have some special scenes
@@ -2871,6 +2894,40 @@ function extractSourceDom(htmlStr, app) {
     }
 }
 
+/* eslint-disable no-return-assign */
+function isBoundedFunction(value) {
+    if (isBoolean(value.__MICRO_APP_IS_BOUND_FUNCTION__))
+        return value.__MICRO_APP_IS_BOUND_FUNCTION__;
+    return value.__MICRO_APP_IS_BOUND_FUNCTION__ = isBoundFunction(value);
+}
+function isConstructorFunction(value) {
+    if (isBoolean(value.__MICRO_APP_IS_CONSTRUCTOR__))
+        return value.__MICRO_APP_IS_CONSTRUCTOR__;
+    return value.__MICRO_APP_IS_CONSTRUCTOR__ = isConstructor(value);
+}
+// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+function bindFunctionToRawTarget(value, rawTarget, key = 'WINDOW') {
+    if (isFunction(value) && !isConstructorFunction(value) && !isBoundedFunction(value)) {
+        const cacheKey = `__MICRO_APP_BOUND_${key}_FUNCTION__`;
+        if (value[cacheKey])
+            return value[cacheKey];
+        const bindRawObjectValue = value.bind(rawTarget);
+        for (const key in value) {
+            bindRawObjectValue[key] = value[key];
+        }
+        if (value.hasOwnProperty('prototype')) {
+            rawDefineProperty(bindRawObjectValue, 'prototype', {
+                value: value.prototype,
+                configurable: true,
+                enumerable: false,
+                writable: true,
+            });
+        }
+        return value[cacheKey] = bindRawObjectValue;
+    }
+    return value;
+}
+
 class EventCenter {
     constructor() {
         this.eventList = new Map();
@@ -3315,159 +3372,208 @@ function unmountNestedApp() {
 function releaseUnmountOfNestedApp() {
     if (window.__MICRO_APP_ENVIRONMENT__) {
         window.removeEventListener('unmount', unmountNestedApp, false);
-    }
-}
-// if micro-app run in micro application, delete all next generation application when unmount event received
-// unmount event will auto release by sandbox
-function initEnvOfNestedApp() {
-    if (window.__MICRO_APP_ENVIRONMENT__) {
-        releaseUnmountOfNestedApp();
-        window.addEventListener('unmount', unmountNestedApp, false);
-    }
-}
-
-/* eslint-disable no-return-assign */
-function isBoundedFunction(value) {
-    if (isBoolean(value.__MICRO_APP_IS_BOUND_FUNCTION__))
-        return value.__MICRO_APP_IS_BOUND_FUNCTION__;
-    return value.__MICRO_APP_IS_BOUND_FUNCTION__ = isBoundFunction(value);
-}
-function isConstructorFunction(value) {
-    if (isBoolean(value.__MICRO_APP_IS_CONSTRUCTOR__))
-        return value.__MICRO_APP_IS_CONSTRUCTOR__;
-    return value.__MICRO_APP_IS_CONSTRUCTOR__ = isConstructor(value);
+    }
 }
-// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
-function bindFunctionToRawTarget(value, rawTarget, key = 'WINDOW') {
-    if (isFunction(value) && !isConstructorFunction(value) && !isBoundedFunction(value)) {
-        const cacheKey = `__MICRO_APP_BOUND_${key}_FUNCTION__`;
-        if (value[cacheKey])
-            return value[cacheKey];
-        const bindRawObjectValue = value.bind(rawTarget);
-        for (const key in value) {
-            bindRawObjectValue[key] = value[key];
-        }
-        if (value.hasOwnProperty('prototype')) {
-            rawDefineProperty(bindRawObjectValue, 'prototype', {
-                value: value.prototype,
-                configurable: true,
-                enumerable: false,
-                writable: true,
-            });
-        }
-        return value[cacheKey] = bindRawObjectValue;
+// if micro-app run in micro application, delete all next generation application when unmount event received
+// unmount event will auto release by sandbox
+function initEnvOfNestedApp() {
+    if (window.__MICRO_APP_ENVIRONMENT__) {
+        releaseUnmountOfNestedApp();
+        window.addEventListener('unmount', unmountNestedApp, false);
     }
-    return value;
 }
 
-// document.onclick binding list, the binding function of each application is unique
-const documentClickListMap = new Map();
-let hasRewriteDocumentOnClick = false;
-/**
- * Rewrite document.onclick and execute it only once
- */
-function overwriteDocumentOnClick() {
-    hasRewriteDocumentOnClick = true;
-    if (Object.getOwnPropertyDescriptor(document, 'onclick')) {
-        return logWarn('Cannot redefine document property onclick');
-    }
-    const rawOnClick = document.onclick;
-    document.onclick = null;
-    let hasDocumentClickInited = false;
-    function onClickHandler(e) {
-        documentClickListMap.forEach((f) => {
-            isFunction(f) && f.call(document, e);
-        });
+function createMicroDocument(appName, proxyDocument) {
+    const { rawDocument, rawRootDocument } = globalEnv;
+    class MicroDocument {
+        static [Symbol.hasInstance](target) {
+            let proto = target;
+            while (proto = Object.getPrototypeOf(proto)) {
+                if (proto === MicroDocument.prototype) {
+                    return true;
+                }
+            }
+            return (target === proxyDocument ||
+                target instanceof rawRootDocument);
+        }
     }
-    rawDefineProperty(document, 'onclick', {
-        configurable: true,
-        enumerable: true,
-        get() {
-            const appName = getCurrentAppName();
-            return appName ? documentClickListMap.get(appName) : documentClickListMap.get('base');
+    /**
+     * TIP:
+     * 1. child class __proto__, which represents the inherit of the constructor, always points to the parent class
+     * 2. child class prototype.__proto__, which represents the inherit of methods, always points to parent class prototype
+     * e.g.
+     * class B extends A {}
+     * B.__proto__ === A // true
+     * B.prototype.__proto__ === A.prototype // true
+     */
+    Object.setPrototypeOf(MicroDocument, rawRootDocument);
+    // Object.create(rawRootDocument.prototype) will cause MicroDocument and proxyDocument methods not same when exec Document.prototype.xxx = xxx in child app
+    Object.setPrototypeOf(MicroDocument.prototype, new Proxy(rawRootDocument.prototype, {
+        get(target, key) {
+            throttleDeferForSetAppName(appName);
+            return bindFunctionToRawTarget(Reflect.get(target, key), rawDocument, 'DOCUMENT');
         },
-        set(f) {
-            const appName = getCurrentAppName();
-            if (appName) {
-                documentClickListMap.set(appName, f);
-            }
-            else {
-                documentClickListMap.set('base', f);
-            }
-            if (!hasDocumentClickInited && isFunction(f)) {
-                hasDocumentClickInited = true;
-                globalEnv.rawDocumentAddEventListener.call(globalEnv.rawDocument, 'click', onClickHandler, false);
-            }
+        set(target, key, value) {
+            Reflect.set(target, key, value);
+            return true;
         }
-    });
-    rawOnClick && (document.onclick = rawOnClick);
+    }));
+    return MicroDocument;
 }
 /**
- * The document event is globally, we need to clear these event bindings when micro application unmounted
+ * Create new document and Document
  */
-const documentEventListenerMap = new Map();
-function effectDocumentEvent() {
-    const { rawDocument, rawDocumentAddEventListener, rawDocumentRemoveEventListener, } = globalEnv;
-    !hasRewriteDocumentOnClick && overwriteDocumentOnClick();
-    document.addEventListener = function (type, listener, options) {
-        const appName = getCurrentAppName();
-        /**
-         * ignore bound function of document event in umd mode, used to solve problem of react global events
-         * update in 2022-09-02:
-         * boundFunction is no longer exclude, because events in UMD mode will not cleared from v1.0.0-alpha.4
-         * if (appName && !(appInstanceMap.get(appName)?.umdMode && isBoundFunction(listener))) {
-         */
-        if (appName) {
-            const appListenersMap = documentEventListenerMap.get(appName);
-            if (appListenersMap) {
-                const appListenerList = appListenersMap.get(type);
-                if (appListenerList) {
-                    appListenerList.add(listener);
-                }
-                else {
-                    appListenersMap.set(type, new Set([listener]));
-                }
+function createProxyDocument(appName, sandbox) {
+    const eventListenerMap = new Map();
+    const sstEventListenerMap = new Map();
+    let onClickHandler = null;
+    let sstOnClickHandler = null;
+    const { rawDocument, rawCreateElement, rawAddEventListener, rawRemoveEventListener, } = globalEnv;
+    function createElement(tagName, options) {
+        const element = rawCreateElement.call(rawDocument, tagName, options);
+        element.__MICRO_APP_NAME__ = appName;
+        return element;
+    }
+    /**
+     * TODO:
+     *  1. listener 是否需要绑定proxyDocument，否则函数中的this指向原生window
+     *  2. 相似代码提取为公共方法(with, iframe)
+     */
+    function addEventListener(type, listener, options) {
+        const listenerList = eventListenerMap.get(type);
+        if (listenerList) {
+            listenerList.add(listener);
+        }
+        else {
+            eventListenerMap.set(type, new Set([listener]));
+        }
+        listener && (listener.__MICRO_APP_MARK_OPTIONS__ = options);
+        rawAddEventListener.call(rawDocument, type, listener, options);
+    }
+    function removeEventListener(type, listener, options) {
+        const listenerList = eventListenerMap.get(type);
+        if ((listenerList === null || listenerList === void 0 ? void 0 : listenerList.size) && listenerList.has(listener)) {
+            listenerList.delete(listener);
+        }
+        rawRemoveEventListener.call(rawDocument, type, listener, options);
+    }
+    // reset snapshot data
+    const reset = () => {
+        sstEventListenerMap.clear();
+        sstOnClickHandler = null;
+    };
+    /**
+     * NOTE:
+     *  1. about timer(events & properties should record & rebuild at all modes, exclude default mode)
+     *  2. record maybe call twice when unmount prerender, keep-alive app manually with umd mode
+     * 4 modes: default-mode、umd-mode、prerender、keep-alive
+     * Solution:
+     *  1. default-mode(normal): clear events & timers, not record & rebuild anything
+     *  2. umd-mode(normal): not clear timers, record & rebuild events
+     *  3. prerender/keep-alive(default, umd): not clear timers, record & rebuild events
+     */
+    const record = () => {
+        // record onclick handler
+        sstOnClickHandler = sstOnClickHandler || onClickHandler;
+        // record document event
+        eventListenerMap.forEach((listenerList, type) => {
+            if (listenerList.size) {
+                sstEventListenerMap.set(type, new Set(listenerList));
             }
-            else {
-                documentEventListenerMap.set(appName, new Map([[type, new Set([listener])]]));
+        });
+    };
+    // rebuild event and timer before remount app
+    const rebuild = () => {
+        // rebuild onclick event
+        if (sstOnClickHandler)
+            proxyDocument.onclick = sstOnClickHandler;
+        // rebuild document event
+        sstEventListenerMap.forEach((listenerList, type) => {
+            for (const listener of listenerList) {
+                proxyDocument.addEventListener(type, listener, listener === null || listener === void 0 ? void 0 : listener.__MICRO_APP_MARK_OPTIONS__);
             }
-            listener && (listener.__MICRO_APP_MARK_OPTIONS__ = options);
+        });
+        reset();
+    };
+    // release all event listener & interval & timeout when unmount app
+    const release = () => {
+        // Clear the function bound by micro app through document.onclick
+        if (isFunction(onClickHandler)) {
+            rawRemoveEventListener.call(rawDocument, 'click', onClickHandler);
+            onClickHandler = null;
+        }
+        // Clear document binding event
+        if (eventListenerMap.size) {
+            eventListenerMap.forEach((listenerList, type) => {
+                for (const listener of listenerList) {
+                    rawRemoveEventListener.call(rawDocument, type, listener);
+                }
+            });
+            eventListenerMap.clear();
         }
-        rawDocumentAddEventListener.call(rawDocument, type, listener, options);
     };
-    document.removeEventListener = function (type, listener, options) {
-        const appName = getCurrentAppName();
-        /**
-         * update in 2022-09-02:
-         * boundFunction is no longer exclude, because events in UMD mode will not cleared from v1.0.0-alpha.4
-         * if (appName && !(appInstanceMap.get(appName)?.umdMode && isBoundFunction(listener))) {
-         */
-        if (appName) {
-            const appListenersMap = documentEventListenerMap.get(appName);
-            if (appListenersMap) {
-                const appListenerList = appListenersMap.get(type);
-                if ((appListenerList === null || appListenerList === void 0 ? void 0 : appListenerList.size) && appListenerList.has(listener)) {
-                    appListenerList.delete(listener);
+    const proxyDocument = new Proxy(rawDocument, {
+        get: (target, key) => {
+            throttleDeferForSetAppName(appName);
+            throttleDeferForParentNode(proxyDocument);
+            if (key === 'createElement')
+                return createElement;
+            if (key === Symbol.toStringTag)
+                return 'ProxyDocument';
+            if (key === 'defaultView')
+                return sandbox.proxyWindow;
+            if (key === 'onclick')
+                return onClickHandler;
+            if (key === 'addEventListener')
+                return addEventListener;
+            if (key === 'removeEventListener')
+                return removeEventListener;
+            return bindFunctionToRawTarget(Reflect.get(target, key), rawDocument, 'DOCUMENT');
+        },
+        set: (target, key, value) => {
+            if (key === 'onclick') {
+                if (isFunction(onClickHandler)) {
+                    rawRemoveEventListener.call(rawDocument, 'click', onClickHandler, false);
+                }
+                // TODO: listener 是否需要绑定proxyDocument，否则函数中的this指向原生window
+                if (isFunction(value)) {
+                    rawAddEventListener.call(rawDocument, 'click', value, false);
                 }
+                onClickHandler = value;
+            }
+            else {
+                /**
+                 * 1. Fix TypeError: Illegal invocation when set document.title
+                 * 2. If the set method returns false, and the assignment happened in strict-mode code, a TypeError will be thrown.
+                 */
+                Reflect.set(target, key, value);
             }
+            return true;
+        }
+    });
+    return {
+        proxyDocument,
+        MicroDocument: createMicroDocument(appName, proxyDocument),
+        documentEffect: {
+            reset,
+            record,
+            rebuild,
+            release,
         }
-        rawDocumentRemoveEventListener.call(rawDocument, type, listener, options);
     };
 }
-// Clear the document event agent
-function releaseEffectDocumentEvent() {
-    document.addEventListener = globalEnv.rawDocumentAddEventListener;
-    document.removeEventListener = globalEnv.rawDocumentRemoveEventListener;
-}
+
 /**
  * Rewrite side-effect events
  * @param microAppWindow micro window
  */
-function effect(appName, microAppWindow) {
+function patchWindowEffect(appName, microAppWindow) {
     const eventListenerMap = new Map();
+    const sstEventListenerMap = new Map();
     const intervalIdMap = new Map();
     const timeoutIdMap = new Map();
-    const { rawWindow, rawDocument, rawWindowAddEventListener, rawWindowRemoveEventListener, rawSetInterval, rawSetTimeout, rawClearInterval, rawClearTimeout, rawDocumentRemoveEventListener, } = globalEnv;
+    const { rawWindow, rawAddEventListener, rawRemoveEventListener, rawSetInterval, rawSetTimeout, rawClearInterval, rawClearTimeout, } = globalEnv;
+    // TODO: listener 是否需要绑定microAppWindow，否则函数中的this指向原生window
     // listener may be null, e.g test-passive
     microAppWindow.addEventListener = function (type, listener, options) {
         type = formatEventName(type, appName);
@@ -3479,7 +3585,7 @@ function effect(appName, microAppWindow) {
             eventListenerMap.set(type, new Set([listener]));
         }
         listener && (listener.__MICRO_APP_MARK_OPTIONS__ = options);
-        rawWindowAddEventListener.call(rawWindow, type, listener, options);
+        rawAddEventListener.call(rawWindow, type, listener, options);
     };
     microAppWindow.removeEventListener = function (type, listener, options) {
         type = formatEventName(type, appName);
@@ -3487,7 +3593,7 @@ function effect(appName, microAppWindow) {
         if ((listenerList === null || listenerList === void 0 ? void 0 : listenerList.size) && listenerList.has(listener)) {
             listenerList.delete(listener);
         }
-        rawWindowRemoveEventListener.call(rawWindow, type, listener, options);
+        rawRemoveEventListener.call(rawWindow, type, listener, options);
     };
     microAppWindow.setInterval = function (handler, timeout, ...args) {
         const intervalId = rawSetInterval.call(rawWindow, handler, timeout, ...args);
@@ -3507,14 +3613,9 @@ function effect(appName, microAppWindow) {
         timeoutIdMap.delete(timeoutId);
         rawClearTimeout.call(rawWindow, timeoutId);
     };
-    const sstWindowListenerMap = new Map();
-    const sstDocumentListenerMap = new Map();
-    let sstOnClickHandler;
     // reset snapshot data
     const reset = () => {
-        sstWindowListenerMap.clear();
-        sstDocumentListenerMap.clear();
-        sstOnClickHandler = null;
+        sstEventListenerMap.clear();
     };
     /**
      * NOTE:
@@ -3530,57 +3631,33 @@ function effect(appName, microAppWindow) {
         // record window event
         eventListenerMap.forEach((listenerList, type) => {
             if (listenerList.size) {
-                sstWindowListenerMap.set(type, new Set(listenerList));
+                sstEventListenerMap.set(type, new Set(listenerList));
             }
         });
-        // record onclick handler
-        sstOnClickHandler = sstOnClickHandler || documentClickListMap.get(appName);
-        // record document event
-        const documentAppListenersMap = documentEventListenerMap.get(appName);
-        if (documentAppListenersMap) {
-            documentAppListenersMap.forEach((listenerList, type) => {
-                if (listenerList.size) {
-                    sstDocumentListenerMap.set(type, new Set(listenerList));
-                }
-            });
-        }
     };
     // rebuild event and timer before remount app
     const rebuild = () => {
         // rebuild window event
-        sstWindowListenerMap.forEach((listenerList, type) => {
+        sstEventListenerMap.forEach((listenerList, type) => {
             for (const listener of listenerList) {
                 microAppWindow.addEventListener(type, listener, listener === null || listener === void 0 ? void 0 : listener.__MICRO_APP_MARK_OPTIONS__);
             }
         });
-        // rebuild onclick event
-        sstOnClickHandler && documentClickListMap.set(appName, sstOnClickHandler);
-        /**
-         * rebuild document event
-         * WARNING!!: do not delete setCurrentAppName & removeDomScope
-         */
-        setCurrentAppName(appName);
-        sstDocumentListenerMap.forEach((listenerList, type) => {
-            for (const listener of listenerList) {
-                document.addEventListener(type, listener, listener === null || listener === void 0 ? void 0 : listener.__MICRO_APP_MARK_OPTIONS__);
-            }
-        });
-        removeDomScope();
         reset();
     };
     // release all event listener & interval & timeout when unmount app
-    const release = ({ umdMode, isPrerender, keepAlive, destroy }) => {
+    const release = (clearTimer) => {
         // Clear window binding events
         if (eventListenerMap.size) {
             eventListenerMap.forEach((listenerList, type) => {
                 for (const listener of listenerList) {
-                    rawWindowRemoveEventListener.call(rawWindow, type, listener);
+                    rawRemoveEventListener.call(rawWindow, type, listener);
                 }
             });
             eventListenerMap.clear();
         }
         // default mode(not keep-alive or isPrerender)
-        if ((!umdMode && !keepAlive && !isPrerender) || destroy) {
+        if (clearTimer) {
             intervalIdMap.forEach((_, intervalId) => {
                 rawClearInterval.call(rawWindow, intervalId);
             });
@@ -3590,18 +3667,6 @@ function effect(appName, microAppWindow) {
             intervalIdMap.clear();
             timeoutIdMap.clear();
         }
-        // Clear the function bound by micro application through document.onclick
-        documentClickListMap.delete(appName);
-        // Clear document binding event
-        const documentAppListenersMap = documentEventListenerMap.get(appName);
-        if (documentAppListenersMap) {
-            documentAppListenersMap.forEach((listenerList, type) => {
-                for (const listener of listenerList) {
-                    rawDocumentRemoveEventListener.call(rawDocument, type, listener);
-                }
-            });
-            documentAppListenersMap.clear();
-        }
     };
     return {
         reset,
@@ -4814,6 +4879,7 @@ const { createMicroEventSource, clearMicroEventSource } = useMicroEventSource();
 const globalPropertyList$1 = ['window', 'self', 'globalThis'];
 class WithSandBox {
     constructor(appName, url) {
+        this.active = false;
         /**
          * Scoped global Properties(Properties that can only get and set in microAppWindow, will not escape to rawWindow)
          * Fix https://github.com/micro-zoe/micro-app/issues/234
@@ -4821,24 +4887,20 @@ class WithSandBox {
         this.scopeProperties = [];
         // Properties that can be escape to rawWindow
         this.escapeProperties = [];
-        // Properties newly added to microAppWindow
-        this.injectedKeys = new Set();
         // Properties escape to rawWindow, cleared when unmount
         this.escapeKeys = new Set();
-        // record injected values before the first execution of umdHookMount and rebuild before remount umd app
-        // private recordUmdInjectedValues?: Map<PropertyKey, unknown>
-        // sandbox state
-        this.active = false;
+        // Properties newly added to microAppWindow
+        this.injectedKeys = new Set();
         this.microAppWindow = {}; // Proxy target
         this.adapter = new Adapter();
         // get scopeProperties and escapeProperties from plugins
         this.getSpecialProperties(appName);
-        // create proxyWindow with Proxy(microAppWindow)
-        this.proxyWindow = this.createProxyWindow(appName);
-        // Rewrite global event listener & timeout
-        this.effectController = effect(appName, this.microAppWindow);
+        // rewrite window of child app
+        this.windowEffect = this.patchWithWindow(appName, this.microAppWindow);
+        // rewrite document of child app
+        this.documentEffect = this.patchWithDocument(appName, this.microAppWindow);
         // inject global properties
-        this.initStaticGlobalKeys(this.microAppWindow, appName, url);
+        this.initStaticGlobalKeys(appName, url, this.microAppWindow);
     }
     /**
      * open sandbox and perform some initial actions
@@ -4849,38 +4911,38 @@ class WithSandBox {
      * @param disablePatchRequest prevent patchRequestApi
      */
     start({ umdMode, baseroute, useMemoryRouter, defaultPage, disablePatchRequest, }) {
-        if (!this.active) {
-            this.active = true;
-            if (useMemoryRouter) {
-                if (isUndefined(this.microAppWindow.location)) {
-                    this.setMicroAppRouter(this.microAppWindow, this.microAppWindow.__MICRO_APP_NAME__, this.microAppWindow.__MICRO_APP_URL__);
-                }
-                this.initRouteState(defaultPage);
-                // unique listener of popstate event for sub app
-                this.removeHistoryListener = addHistoryListener(this.microAppWindow.__MICRO_APP_NAME__);
-            }
-            else {
-                this.microAppWindow.__MICRO_APP_BASE_ROUTE__ = this.microAppWindow.__MICRO_APP_BASE_URL__ = baseroute;
-            }
-            /**
-             * Target: Ensure default mode action exactly same to first time when render again
-             * 1. The following globalKey maybe modified when render, reset them when render again in default mode
-             * 2. Umd mode will not delete any keys during sandBox.stop, ignore umd mode
-             * 3. When sandbox.start called for the first time, it must be the default mode
-             */
-            if (!umdMode) {
-                this.initGlobalKeysWhenStart(this.microAppWindow, this.microAppWindow.__MICRO_APP_NAME__, this.microAppWindow.__MICRO_APP_URL__, disablePatchRequest);
-            }
-            if (++globalEnv.activeSandbox === 1) {
-                patchElementAndDocument();
-                patchHistory();
-            }
-            if (++WithSandBox.activeCount === 1) {
-                effectDocumentEvent();
-                initEnvOfNestedApp();
+        if (this.active)
+            return;
+        this.active = true;
+        if (useMemoryRouter) {
+            if (isUndefined(this.microAppWindow.location)) {
+                this.setMicroAppRouter(this.microAppWindow.__MICRO_APP_NAME__, this.microAppWindow.__MICRO_APP_URL__, this.microAppWindow);
             }
-            fixBabelPolyfill6();
+            this.initRouteState(defaultPage);
+            // unique listener of popstate event for sub app
+            this.removeHistoryListener = addHistoryListener(this.microAppWindow.__MICRO_APP_NAME__);
+        }
+        else {
+            this.microAppWindow.__MICRO_APP_BASE_ROUTE__ = this.microAppWindow.__MICRO_APP_BASE_URL__ = baseroute;
+        }
+        /**
+         * Target: Ensure default mode action exactly same to first time when render again
+         * 1. The following globalKey maybe modified when render, reset them when render again in default mode
+         * 2. Umd mode will not delete any keys during sandBox.stop, ignore umd mode
+         * 3. When sandbox.start called for the first time, it must be the default mode
+         */
+        if (!umdMode) {
+            this.initGlobalKeysWhenStart(this.microAppWindow.__MICRO_APP_NAME__, this.microAppWindow.__MICRO_APP_URL__, this.microAppWindow, disablePatchRequest);
         }
+        if (++globalEnv.activeSandbox === 1) {
+            patchElementAndDocument();
+            patchHistory();
+        }
+        if (++WithSandBox.activeCount === 1) {
+            // effectDocumentEvent()
+            initEnvOfNestedApp();
+        }
+        fixBabelPolyfill6();
     }
     /**
      * close sandbox and perform some clean up actions
@@ -4890,39 +4952,61 @@ class WithSandBox {
      * @param clearData clear data from base app
      */
     stop({ umdMode, keepRouteState, destroy, clearData, }) {
-        if (this.active) {
-            this.recordAndReleaseEffect({ clearData, destroy }, !umdMode || destroy);
-            if (this.removeHistoryListener) {
-                this.clearRouteState(keepRouteState);
-                // release listener of popstate
-                this.removeHistoryListener();
-            }
-            /**
-             * NOTE:
-             *  1. injectedKeys and escapeKeys must be placed at the back
-             *  2. if key in initial microAppWindow, and then rewrite, this key will be delete from microAppWindow when stop, and lost when restart
-             *  3. umd mode will not delete global keys
-             */
-            if (!umdMode || destroy) {
-                clearMicroEventSource(this.microAppWindow.__MICRO_APP_NAME__);
-                this.injectedKeys.forEach((key) => {
-                    Reflect.deleteProperty(this.microAppWindow, key);
-                });
-                this.injectedKeys.clear();
-                this.escapeKeys.forEach((key) => {
-                    Reflect.deleteProperty(globalEnv.rawWindow, key);
-                });
-                this.escapeKeys.clear();
-            }
-            if (--globalEnv.activeSandbox === 0) {
-                releasePatchElementAndDocument();
-                releasePatchHistory();
-            }
-            if (--WithSandBox.activeCount === 0) {
-                releaseEffectDocumentEvent();
-            }
-            this.active = false;
+        if (!this.active)
+            return;
+        this.recordAndReleaseEffect({ umdMode, clearData, destroy }, !umdMode || destroy);
+        if (this.removeHistoryListener) {
+            this.clearRouteState(keepRouteState);
+            // release listener of popstate
+            this.removeHistoryListener();
         }
+        /**
+         * NOTE:
+         *  1. injectedKeys and escapeKeys must be placed at the back
+         *  2. if key in initial microAppWindow, and then rewrite, this key will be delete from microAppWindow when stop, and lost when restart
+         *  3. umd mode will not delete global keys
+         */
+        if (!umdMode || destroy) {
+            clearMicroEventSource(this.microAppWindow.__MICRO_APP_NAME__);
+            this.injectedKeys.forEach((key) => {
+                Reflect.deleteProperty(this.microAppWindow, key);
+            });
+            this.injectedKeys.clear();
+            this.escapeKeys.forEach((key) => {
+                Reflect.deleteProperty(globalEnv.rawWindow, key);
+            });
+            this.escapeKeys.clear();
+        }
+        if (--globalEnv.activeSandbox === 0) {
+            releasePatchElementAndDocument();
+            releasePatchHistory();
+        }
+        if (--WithSandBox.activeCount === 0) ;
+        this.active = false;
+    }
+    /**
+     * inject global properties to microAppWindow
+     * @param appName app name
+     * @param url app url
+     * @param microAppWindow micro window
+     */
+    initStaticGlobalKeys(appName, url, microAppWindow) {
+        microAppWindow.__MICRO_APP_ENVIRONMENT__ = true;
+        microAppWindow.__MICRO_APP_NAME__ = appName;
+        microAppWindow.__MICRO_APP_URL__ = url;
+        microAppWindow.__MICRO_APP_PUBLIC_PATH__ = getEffectivePath(url);
+        microAppWindow.__MICRO_APP_BASE_ROUTE__ = '';
+        microAppWindow.__MICRO_APP_WINDOW__ = microAppWindow;
+        microAppWindow.__MICRO_APP_PRE_RENDER__ = false;
+        microAppWindow.__MICRO_APP_UMD_MODE__ = false;
+        microAppWindow.rawWindow = globalEnv.rawWindow;
+        microAppWindow.rawDocument = globalEnv.rawDocument;
+        microAppWindow.microApp = assign(new EventCenterForMicroApp(appName), {
+            removeDomScope,
+            pureCreateElement,
+            router,
+        });
+        this.setMappingPropertiesWithRawDescriptor(microAppWindow);
     }
     /**
      * Record global effect and then release (effect: global event, timeout, data listener)
@@ -4953,7 +5037,8 @@ class WithSandBox {
      *  2. unmount prerender app manually
      */
     resetEffectSnapshot() {
-        this.effectController.reset();
+        this.windowEffect.reset();
+        this.documentEffect.reset();
         resetDataCenterSnapshot(this.microAppWindow.microApp);
     }
     /**
@@ -4964,20 +5049,14 @@ class WithSandBox {
      * 3. after init prerender app
      */
     recordEffectSnapshot() {
-        // this.microAppWindow.__MICRO_APP_UMD_MODE__ = true
-        this.effectController.record();
+        this.windowEffect.record();
+        this.documentEffect.record();
         recordDataCenterSnapshot(this.microAppWindow.microApp);
-        // this.recordUmdInjectedValues = new Map<PropertyKey, unknown>()
-        // this.injectedKeys.forEach((key: PropertyKey) => {
-        //   this.recordUmdInjectedValues!.set(key, Reflect.get(this.microAppWindow, key))
-        // })
     }
     // rebuild umd snapshot before remount umd app
     rebuildEffectSnapshot() {
-        // this.recordUmdInjectedValues!.forEach((value: unknown, key: PropertyKey) => {
-        //   Reflect.set(this.proxyWindow, key, value)
-        // })
-        this.effectController.rebuild();
+        this.windowEffect.rebuild();
+        this.documentEffect.rebuild();
         rebuildDataCenterSnapshot(this.microAppWindow.microApp);
     }
     /**
@@ -4986,19 +5065,17 @@ class WithSandBox {
      * 1. unmount of default/umd app
      * 2. hidden keep-alive app
      * 3. after init prerender app
+     * @param umdMode is umd mode
      * @param clearData clear data from base app
      * @param isPrerender is prerender app
      * @param keepAlive is keep-alive app
      * @param destroy completely destroy
      */
-    releaseGlobalEffect({ clearData = false, isPrerender = false, keepAlive = false, destroy = false, }) {
+    releaseGlobalEffect({ umdMode = false, clearData = false, isPrerender = false, keepAlive = false, destroy = false, }) {
         var _a, _b, _c;
-        this.effectController.release({
-            umdMode: this.proxyWindow.__MICRO_APP_UMD_MODE__,
-            isPrerender,
-            keepAlive,
-            destroy,
-        });
+        // default mode(not keep-alive or isPrerender)
+        this.windowEffect.release((!umdMode && !keepAlive && !isPrerender) || destroy);
+        this.documentEffect.release();
         (_a = this.microAppWindow.microApp) === null || _a === void 0 ? void 0 : _a.clearDataListener();
         (_b = this.microAppWindow.microApp) === null || _b === void 0 ? void 0 : _b.clearGlobalDataListener();
         if (clearData) {
@@ -5034,54 +5111,52 @@ class WithSandBox {
         }
     }
     // create proxyWindow with Proxy(microAppWindow)
-    createProxyWindow(appName) {
+    createProxyWindow(appName, microAppWindow) {
         const rawWindow = globalEnv.rawWindow;
-        const descriptorTargetMap = new Map();
-        return new Proxy(this.microAppWindow, {
-            get: (target, key) => {
-                throttleDeferForSetAppName(appName);
-                if (Reflect.has(target, key) ||
-                    (isString(key) && /^__MICRO_APP_/.test(key)) ||
-                    this.scopeProperties.includes(key))
-                    return Reflect.get(target, key);
-                return bindFunctionToRawTarget(Reflect.get(rawWindow, key), rawWindow);
-            },
-            set: (target, key, value) => {
-                if (this.active) {
-                    /**
-                     * TODO:
-                     * 1、location域名相同，子应用内部跳转时的处理
-                     */
-                    if (this.adapter.escapeSetterKeyList.includes(key)) {
-                        Reflect.set(rawWindow, key, value);
-                    }
-                    else if (
-                    // target.hasOwnProperty has been rewritten
-                    !rawHasOwnProperty.call(target, key) &&
-                        rawHasOwnProperty.call(rawWindow, key) &&
-                        !this.scopeProperties.includes(key)) {
-                        const descriptor = Object.getOwnPropertyDescriptor(rawWindow, key);
-                        const { configurable, enumerable, writable, set } = descriptor;
-                        // set value because it can be set
-                        rawDefineProperty(target, key, {
-                            value,
-                            configurable,
-                            enumerable,
-                            writable: writable !== null && writable !== void 0 ? writable : !!set,
-                        });
-                        this.injectedKeys.add(key);
-                    }
-                    else {
-                        !Reflect.has(target, key) && this.injectedKeys.add(key);
-                        Reflect.set(target, key, value);
-                    }
-                    if ((this.escapeProperties.includes(key) ||
-                        (this.adapter.staticEscapeProperties.includes(key) &&
-                            !Reflect.has(rawWindow, key))) &&
-                        !this.scopeProperties.includes(key)) {
-                        !Reflect.has(rawWindow, key) && this.escapeKeys.add(key);
-                        Reflect.set(rawWindow, key, value);
-                    }
+        const descriptorTargetMap = new Map();
+        return new Proxy(microAppWindow, {
+            get: (target, key) => {
+                throttleDeferForSetAppName(appName);
+                if (Reflect.has(target, key) ||
+                    (isString(key) && /^__MICRO_APP_/.test(key)) ||
+                    this.scopeProperties.includes(key))
+                    return Reflect.get(target, key);
+                return bindFunctionToRawTarget(Reflect.get(rawWindow, key), rawWindow);
+            },
+            set: (target, key, value) => {
+                /**
+                 * TODO:
+                 * 1、location域名相同，子应用内部跳转时的处理
+                 */
+                if (this.adapter.escapeSetterKeyList.includes(key)) {
+                    Reflect.set(rawWindow, key, value);
+                }
+                else if (
+                // target.hasOwnProperty has been rewritten
+                !rawHasOwnProperty.call(target, key) &&
+                    rawHasOwnProperty.call(rawWindow, key) &&
+                    !this.scopeProperties.includes(key)) {
+                    const descriptor = Object.getOwnPropertyDescriptor(rawWindow, key);
+                    const { configurable, enumerable, writable, set } = descriptor;
+                    // set value because it can be set
+                    rawDefineProperty(target, key, {
+                        value,
+                        configurable,
+                        enumerable,
+                        writable: writable !== null && writable !== void 0 ? writable : !!set,
+                    });
+                    this.injectedKeys.add(key);
+                }
+                else {
+                    !Reflect.has(target, key) && this.injectedKeys.add(key);
+                    Reflect.set(target, key, value);
+                }
+                if ((this.escapeProperties.includes(key) ||
+                    (this.adapter.staticEscapeProperties.includes(key) &&
+                        !Reflect.has(rawWindow, key))) &&
+                    !this.scopeProperties.includes(key)) {
+                    !Reflect.has(rawWindow, key) && this.escapeKeys.add(key);
+                    Reflect.set(rawWindow, key, value);
                 }
                 return true;
             },
@@ -5128,41 +5203,24 @@ class WithSandBox {
             },
         });
     }
-    // set __MICRO_APP_PRE_RENDER__ state
-    setPreRenderState(state) {
-        this.microAppWindow.__MICRO_APP_PRE_RENDER__ = state;
-    }
-    markUmdMode(state) {
-        this.microAppWindow.__MICRO_APP_UMD_MODE__ = state;
-    }
     /**
-     * inject global properties to microAppWindow
-     * @param microAppWindow micro window
+     * create proxyWindow, rewrite window event & timer of child app
      * @param appName app name
-     * @param url app url
-     * @param useMemoryRouter whether use memory router
+     * @param microAppWindow Proxy target
      */
-    initStaticGlobalKeys(microAppWindow, appName, url) {
-        microAppWindow.__MICRO_APP_ENVIRONMENT__ = true;
-        microAppWindow.__MICRO_APP_NAME__ = appName;
-        microAppWindow.__MICRO_APP_URL__ = url;
-        microAppWindow.__MICRO_APP_PUBLIC_PATH__ = getEffectivePath(url);
-        microAppWindow.__MICRO_APP_BASE_ROUTE__ = '';
-        microAppWindow.__MICRO_APP_WINDOW__ = microAppWindow;
-        microAppWindow.__MICRO_APP_PRE_RENDER__ = false;
-        microAppWindow.__MICRO_APP_UMD_MODE__ = false;
-        microAppWindow.rawWindow = globalEnv.rawWindow;
-        microAppWindow.rawDocument = globalEnv.rawDocument;
-        microAppWindow.microApp = assign(new EventCenterForMicroApp(appName), {
-            removeDomScope,
-            pureCreateElement,
-            router,
-        });
-        this.setProxyDocument(microAppWindow, appName);
-        this.setMappingPropertiesWithRawDescriptor(microAppWindow);
+    patchWithWindow(appName, microAppWindow) {
+        // create proxyWindow with Proxy(microAppWindow)
+        this.proxyWindow = this.createProxyWindow(appName, microAppWindow);
+        // rewrite global event & timeout of window
+        return patchWindowEffect(appName, microAppWindow);
     }
-    setProxyDocument(microAppWindow, appName) {
-        const { proxyDocument, MicroDocument } = this.createProxyDocument(appName);
+    /**
+     * create proxyDocument and MicroDocument, rewrite document of child app
+     * @param appName app name
+     * @param microAppWindow Proxy target
+     */
+    patchWithDocument(appName, microAppWindow) {
+        const { proxyDocument, MicroDocument, documentEffect } = createProxyDocument(appName, this);
         rawDefineProperties(microAppWindow, {
             document: {
                 configurable: false,
@@ -5181,6 +5239,14 @@ class WithSandBox {
                 },
             }
         });
+        return documentEffect;
+    }
+    // set __MICRO_APP_PRE_RENDER__ state
+    setPreRenderState(state) {
+        this.microAppWindow.__MICRO_APP_PRE_RENDER__ = state;
+    }
+    markUmdMode(state) {
+        this.microAppWindow.__MICRO_APP_UMD_MODE__ = state;
     }
     // properties associated with the native window
     setMappingPropertiesWithRawDescriptor(microAppWindow) {
@@ -5193,6 +5259,7 @@ class WithSandBox {
             topValue = rawWindow.top;
             parentValue = rawWindow.parent;
         }
+        // TODO: 用rawDefineProperties
         rawDefineProperty(microAppWindow, 'top', this.createDescriptorForMicroAppWindow('top', topValue));
         rawDefineProperty(microAppWindow, 'parent', this.createDescriptorForMicroAppWindow('parent', parentValue));
         globalPropertyList$1.forEach((key) => {
@@ -5216,15 +5283,15 @@ class WithSandBox {
      * @param url app url
      * @param disablePatchRequest prevent rewrite request method of child app
      */
-    initGlobalKeysWhenStart(microAppWindow, appName, url, disablePatchRequest) {
+    initGlobalKeysWhenStart(appName, url, microAppWindow, disablePatchRequest) {
         microAppWindow.hasOwnProperty = (key) => rawHasOwnProperty.call(microAppWindow, key) || rawHasOwnProperty.call(globalEnv.rawWindow, key);
-        this.setHijackProperty(microAppWindow, appName);
+        this.setHijackProperty(appName, microAppWindow);
         if (!disablePatchRequest)
-            this.patchRequestApi(microAppWindow, appName, url);
+            this.patchRequestApi(appName, url, microAppWindow);
         this.setScopeProperties(microAppWindow);
     }
     // set hijack Properties to microAppWindow
-    setHijackProperty(microAppWindow, appName) {
+    setHijackProperty(appName, microAppWindow) {
         let modifiedEval, modifiedImage;
         rawDefineProperties(microAppWindow, {
             eval: {
@@ -5252,7 +5319,7 @@ class WithSandBox {
         });
     }
     // rewrite fetch, XMLHttpRequest, EventSource
-    patchRequestApi(microAppWindow, appName, url) {
+    patchRequestApi(appName, url, microAppWindow) {
         let microFetch = createMicroFetch(url);
         let microXMLHttpRequest = createMicroXMLHttpRequest(url);
         let microEventSource = createMicroEventSource(appName, url);
@@ -5302,7 +5369,7 @@ class WithSandBox {
         });
     }
     // set location & history for memory router
-    setMicroAppRouter(microAppWindow, appName, url) {
+    setMicroAppRouter(appName, url, microAppWindow) {
         const { microLocation, microHistory } = createMicroRouter(appName, url);
         rawDefineProperties(microAppWindow, {
             location: {
@@ -5352,85 +5419,26 @@ class WithSandBox {
     actionBeforeExecScripts(container) {
         this.patchStaticElement(container);
     }
-    /**
-     * Create new document and Document
-     */
-    createProxyDocument(appName) {
-        const rawDocument = globalEnv.rawDocument;
-        const rawRootDocument = globalEnv.rawRootDocument;
-        const createElement = function (tagName, options) {
-            const element = globalEnv.rawCreateElement.call(rawDocument, tagName, options);
-            element.__MICRO_APP_NAME__ = appName;
-            return element;
-        };
-        const proxyDocument = new Proxy(rawDocument, {
-            get: (target, key) => {
-                throttleDeferForSetAppName(appName);
-                throttleDeferForParentNode(proxyDocument);
-                if (key === 'createElement')
-                    return createElement;
-                if (key === Symbol.toStringTag)
-                    return 'ProxyDocument';
-                if (key === 'defaultView')
-                    return this.proxyWindow;
-                return bindFunctionToRawTarget(Reflect.get(target, key), rawDocument, 'DOCUMENT');
-            },
-            set: (target, key, value) => {
-                /**
-                 * 1. Fix TypeError: Illegal invocation when set document.title
-                 * 2. If the set method returns false, and the assignment happened in strict-mode code, a TypeError will be thrown.
-                 */
-                Reflect.set(target, key, value);
-                return true;
-            }
-        });
-        class MicroDocument {
-            static [Symbol.hasInstance](target) {
-                let proto = target;
-                while (proto = Object.getPrototypeOf(proto)) {
-                    if (proto === MicroDocument.prototype) {
-                        return true;
-                    }
-                }
-                return (target === proxyDocument ||
-                    target instanceof rawRootDocument);
-            }
-        }
-        /**
-         * TIP:
-         * 1. child class __proto__, which represents the inherit of the constructor, always points to the parent class
-         * 2. child class prototype.__proto__, which represents the inherit of methods, always points to parent class prototype
-         * e.g.
-         * class B extends A {}
-         * B.__proto__ === A // true
-         * B.prototype.__proto__ === A.prototype // true
-         */
-        Object.setPrototypeOf(MicroDocument, rawRootDocument);
-        // Object.create(rawRootDocument.prototype) will cause MicroDocument and proxyDocument methods not same when exec Document.prototype.xxx = xxx in child app
-        Object.setPrototypeOf(MicroDocument.prototype, new Proxy(rawRootDocument.prototype, {
-            get(target, key) {
-                throttleDeferForSetAppName(appName);
-                return bindFunctionToRawTarget(Reflect.get(target, key), rawDocument, 'DOCUMENT');
-            },
-            set(target, key, value) {
-                Reflect.set(target, key, value);
-                return true;
-            }
-        }));
-        return {
-            proxyDocument,
-            MicroDocument,
-        };
-    }
 }
 WithSandBox.activeCount = 0; // number of active sandbox
 
-function patchIframeRoute(appName, microAppWindow, childFullPath) {
+function patchIframeRoute(appName, url, microAppWindow, browserHost) {
+    const childStaticLocation = new URL(url);
+    const childHost = childStaticLocation.protocol + '//' + childStaticLocation.host;
+    const childFullPath = childStaticLocation.pathname + childStaticLocation.search + childStaticLocation.hash;
+    // rewrite microAppWindow.history
     const microHistory = microAppWindow.history;
     microAppWindow.rawReplaceState = microHistory.replaceState;
     assign(microHistory, createMicroHistory(appName, microAppWindow.location));
-    // exec updateMicroLocation after patch microHistory
+    /**
+     * Init microLocation before exec sandbox.start (sandbox.start will sync microLocation info to browser url)
+     * NOTE:
+     *  1. exec updateMicroLocation after patch microHistory
+     *  2.
+     */
     updateMicroLocation(appName, childFullPath, microAppWindow.location, 'prevent');
+    // create proxyLocation
+    return createMicroLocation(appName, url, microAppWindow, childStaticLocation, browserHost, childHost);
 }
 
 function patchIframeWindow(appName, microAppWindow) {
@@ -5496,15 +5504,16 @@ function patchIframeWindow(appName, microAppWindow) {
             logWarn(e, appName);
         }
     });
-    return windowEffect(microAppWindow);
+    return patchWindowEffect$1(microAppWindow);
 }
-function windowEffect(microAppWindow) {
-    const { rawWindow, rawAddEventListener, rawRemoveEventListener, } = globalEnv;
+function patchWindowEffect$1(microAppWindow) {
+    const { rawWindow, rawAddEventListener, rawRemoveEventListener } = globalEnv;
     const eventListenerMap = new Map();
-    const sstWindowListenerMap = new Map();
+    const sstEventListenerMap = new Map();
     function getEventTarget(type) {
         return scopeIframeWindowEvent.includes(type) ? microAppWindow : rawWindow;
     }
+    // TODO: listener 是否需要绑定microAppWindow，否则函数中的this指向原生window
     microAppWindow.addEventListener = function (type, listener, options) {
         const listenerList = eventListenerMap.get(type);
         if (listenerList) {
@@ -5524,7 +5533,7 @@ function windowEffect(microAppWindow) {
         rawRemoveEventListener.call(getEventTarget(type), type, listener, options);
     };
     const reset = () => {
-        sstWindowListenerMap.clear();
+        sstEventListenerMap.clear();
     };
     /**
      * NOTE:
@@ -5542,14 +5551,14 @@ function windowEffect(microAppWindow) {
         // record window event
         eventListenerMap.forEach((listenerList, type) => {
             if (listenerList.size) {
-                sstWindowListenerMap.set(type, new Set(listenerList));
+                sstEventListenerMap.set(type, new Set(listenerList));
             }
         });
     };
     // rebuild event and timer before remount app
     const rebuild = () => {
         // rebuild window event
-        sstWindowListenerMap.forEach((listenerList, type) => {
+        sstEventListenerMap.forEach((listenerList, type) => {
             for (const listener of listenerList) {
                 microAppWindow.addEventListener(type, listener, listener === null || listener === void 0 ? void 0 : listener.__MICRO_APP_MARK_OPTIONS__);
             }
@@ -5583,18 +5592,26 @@ function windowEffect(microAppWindow) {
 function patchIframeDocument(appName, microAppWindow, proxyLocation) {
     patchDocumentPrototype(appName, microAppWindow);
     patchDocumentProperties(appName, microAppWindow, proxyLocation);
-    return documentEffect(appName, microAppWindow);
+    return patchDocumentEffect(appName, microAppWindow);
 }
 function patchDocumentPrototype(appName, microAppWindow) {
     const rawDocument = globalEnv.rawDocument;
     const microRootDocument = microAppWindow.Document;
     const microDocument = microAppWindow.document;
+    const rawMicroCreateElement = microRootDocument.prototype.createElement;
+    const rawMicroCreateTextNode = microRootDocument.prototype.createTextNode;
+    const rawMicroQuerySelector = microRootDocument.prototype.querySelector;
+    const rawMicroQuerySelectorAll = microRootDocument.prototype.querySelectorAll;
+    const rawMicroGetElementById = microRootDocument.prototype.getElementById;
+    const rawMicroGetElementsByClassName = microRootDocument.prototype.getElementsByClassName;
+    const rawMicroGetElementsByTagName = microRootDocument.prototype.getElementsByTagName;
+    const rawMicroGetElementsByName = microRootDocument.prototype.getElementsByName;
     microRootDocument.prototype.createElement = function createElement(tagName, options) {
-        const element = globalEnv.rawCreateElement.call(this, tagName, options);
+        const element = rawMicroCreateElement.call(this, tagName, options);
         return updateElementInfo(element, appName);
     };
     microRootDocument.prototype.createTextNode = function createTextNode(data) {
-        const element = globalEnv.rawCreateTextNode.call(this, data);
+        const element = rawMicroCreateTextNode.call(this, data);
         return updateElementInfo(element, appName);
     };
     function getDefaultRawTarget(target) {
@@ -5603,19 +5620,21 @@ function patchDocumentPrototype(appName, microAppWindow) {
     // query element👇
     function querySelector(selectors) {
         var _a, _b;
-        if (isUniqueElement(selectors) ||
+        if (!selectors ||
+            isUniqueElement(selectors) ||
             microDocument !== this) {
             const _this = getDefaultRawTarget(this);
-            return globalEnv.rawQuerySelector.call(_this, selectors);
+            return rawMicroQuerySelector.call(_this, selectors);
         }
         return (_b = (_a = appInstanceMap.get(appName)) === null || _a === void 0 ? void 0 : _a.querySelector(selectors)) !== null && _b !== void 0 ? _b : null;
     }
     function querySelectorAll(selectors) {
         var _a, _b;
-        if (isUniqueElement(selectors) ||
+        if (!selectors ||
+            isUniqueElement(selectors) ||
             microDocument !== this) {
             const _this = getDefaultRawTarget(this);
-            return globalEnv.rawQuerySelectorAll.call(_this, selectors);
+            return rawMicroQuerySelectorAll.call(_this, selectors);
         }
         return (_b = (_a = appInstanceMap.get(appName)) === null || _a === void 0 ? void 0 : _a.querySelectorAll(selectors)) !== null && _b !== void 0 ? _b : [];
     }
@@ -5624,25 +5643,25 @@ function patchDocumentPrototype(appName, microAppWindow) {
     microRootDocument.prototype.getElementById = function getElementById(key) {
         const _this = getDefaultRawTarget(this);
         if (isInvalidQuerySelectorKey(key)) {
-            return globalEnv.rawGetElementById.call(_this, key);
+            return rawMicroGetElementById.call(_this, key);
         }
         try {
             return querySelector.call(this, `#${key}`);
         }
         catch (_a) {
-            return globalEnv.rawGetElementById.call(_this, key);
+            return rawMicroGetElementById.call(_this, key);
         }
     };
     microRootDocument.prototype.getElementsByClassName = function getElementsByClassName(key) {
         const _this = getDefaultRawTarget(this);
         if (isInvalidQuerySelectorKey(key)) {
-            return globalEnv.rawGetElementsByClassName.call(_this, key);
+            return rawMicroGetElementsByClassName.call(_this, key);
         }
         try {
             return querySelectorAll.call(this, `.${key}`);
         }
         catch (_a) {
-            return globalEnv.rawGetElementsByClassName.call(_this, key);
+            return rawMicroGetElementsByClassName.call(_this, key);
         }
     };
     microRootDocument.prototype.getElementsByTagName = function getElementsByTagName(key) {
@@ -5651,25 +5670,25 @@ function patchDocumentPrototype(appName, microAppWindow) {
         if (isUniqueElement(key) ||
             isInvalidQuerySelectorKey(key) ||
             (!((_a = appInstanceMap.get(appName)) === null || _a === void 0 ? void 0 : _a.inline) && /^script$/i.test(key))) {
-            return globalEnv.rawGetElementsByTagName.call(_this, key);
+            return rawMicroGetElementsByTagName.call(_this, key);
         }
         try {
             return querySelectorAll.call(this, key);
         }
         catch (_b) {
-            return globalEnv.rawGetElementsByTagName.call(_this, key);
+            return rawMicroGetElementsByTagName.call(_this, key);
         }
     };
     microRootDocument.prototype.getElementsByName = function getElementsByName(key) {
         const _this = getDefaultRawTarget(this);
         if (isInvalidQuerySelectorKey(key)) {
-            return globalEnv.rawGetElementsByName.call(_this, key);
+            return rawMicroGetElementsByName.call(_this, key);
         }
         try {
             return querySelectorAll.call(this, `[name=${key}]`);
         }
         catch (_a) {
-            return globalEnv.rawGetElementsByName.call(_this, key);
+            return rawMicroGetElementsByName.call(_this, key);
         }
     };
 }
@@ -5725,46 +5744,37 @@ function patchDocumentProperties(appName, microAppWindow, proxyLocation) {
             enumerable: true,
             configurable: true,
             get: () => rawDocument[tagName],
-            set: undefined,
+            set: (value) => { rawDocument[tagName] = value; },
         });
     });
 }
-function documentEffect(appName, microAppWindow) {
-    const documentEventListenerMap = new Map();
-    const sstDocumentListenerMap = new Map();
+function patchDocumentEffect(appName, microAppWindow) {
+    const { rawDocument, rawAddEventListener, rawRemoveEventListener } = globalEnv;
+    const eventListenerMap = new Map();
+    const sstEventListenerMap = new Map();
     let onClickHandler = null;
     let sstOnClickHandler = null;
     const microRootDocument = microAppWindow.Document;
     const microDocument = microAppWindow.document;
-    const { rawDocument, rawAddEventListener, rawRemoveEventListener, } = globalEnv;
     function getEventTarget(type, bindTarget) {
         return scopeIframeDocumentEvent.includes(type) ? bindTarget : rawDocument;
     }
     microRootDocument.prototype.addEventListener = function (type, listener, options) {
         const handler = isFunction(listener) ? (listener.__MICRO_APP_BOUND_FUNCTION__ = listener.__MICRO_APP_BOUND_FUNCTION__ || listener.bind(this)) : listener;
-        const appListenersMap = documentEventListenerMap.get(appName);
-        if (appListenersMap) {
-            const appListenerList = appListenersMap.get(type);
-            if (appListenerList) {
-                appListenerList.add(listener);
-            }
-            else {
-                appListenersMap.set(type, new Set([listener]));
-            }
+        const listenerList = eventListenerMap.get(type);
+        if (listenerList) {
+            listenerList.add(listener);
         }
         else {
-            documentEventListenerMap.set(appName, new Map([[type, new Set([listener])]]));
+            eventListenerMap.set(type, new Set([listener]));
         }
         listener && (listener.__MICRO_APP_MARK_OPTIONS__ = options);
         rawAddEventListener.call(getEventTarget(type, this), type, handler, options);
     };
     microRootDocument.prototype.removeEventListener = function (type, listener, options) {
-        const appListenersMap = documentEventListenerMap.get(appName);
-        if (appListenersMap) {
-            const appListenerList = appListenersMap.get(type);
-            if ((appListenerList === null || appListenerList === void 0 ? void 0 : appListenerList.size) && appListenerList.has(listener)) {
-                appListenerList.delete(listener);
-            }
+        const listenerList = eventListenerMap.get(type);
+        if ((listenerList === null || listenerList === void 0 ? void 0 : listenerList.size) && listenerList.has(listener)) {
+            listenerList.delete(listener);
         }
         const handler = (listener === null || listener === void 0 ? void 0 : listener.__MICRO_APP_BOUND_FUNCTION__) || listener;
         rawRemoveEventListener.call(getEventTarget(type, this), type, handler, options);
@@ -5816,7 +5826,7 @@ function documentEffect(appName, microAppWindow) {
         }
     });
     const reset = () => {
-        sstDocumentListenerMap.clear();
+        sstEventListenerMap.clear();
         sstOnClickHandler = null;
     };
     /**
@@ -5832,21 +5842,18 @@ function documentEffect(appName, microAppWindow) {
         // record onclick handler
         sstOnClickHandler = sstOnClickHandler || onClickHandler;
         // record document event
-        const documentAppListenersMap = documentEventListenerMap.get(appName);
-        if (documentAppListenersMap) {
-            documentAppListenersMap.forEach((listenerList, type) => {
-                if (listenerList.size) {
-                    sstDocumentListenerMap.set(type, new Set(listenerList));
-                }
-            });
-        }
+        eventListenerMap.forEach((listenerList, type) => {
+            if (listenerList.size) {
+                sstEventListenerMap.set(type, new Set(listenerList));
+            }
+        });
     };
     // rebuild event and timer before remount app
     const rebuild = () => {
         // rebuild onclick event
         if (sstOnClickHandler)
             microDocument.onclick = sstOnClickHandler;
-        sstDocumentListenerMap.forEach((listenerList, type) => {
+        sstEventListenerMap.forEach((listenerList, type) => {
             for (const listener of listenerList) {
                 microDocument.addEventListener(type, listener, listener === null || listener === void 0 ? void 0 : listener.__MICRO_APP_MARK_OPTIONS__);
             }
@@ -5854,20 +5861,19 @@ function documentEffect(appName, microAppWindow) {
         reset();
     };
     const release = () => {
-        // Clear the function bound by micro application through document.onclick
+        // Clear the function bound by micro app through document.onclick
         if (isFunction(onClickHandler)) {
             rawRemoveEventListener.call(rawDocument, 'click', onClickHandler);
             onClickHandler = null;
         }
         // Clear document binding event
-        const documentAppListenersMap = documentEventListenerMap.get(appName);
-        if (documentAppListenersMap) {
-            documentAppListenersMap.forEach((listenerList, type) => {
+        if (eventListenerMap.size) {
+            eventListenerMap.forEach((listenerList, type) => {
                 for (const listener of listenerList) {
                     rawRemoveEventListener.call(getEventTarget(type, microDocument), type, (listener === null || listener === void 0 ? void 0 : listener.__MICRO_APP_BOUND_FUNCTION__) || listener);
                 }
             });
-            documentAppListenersMap.clear();
+            eventListenerMap.clear();
         }
     };
     return {
@@ -5878,33 +5884,38 @@ function documentEffect(appName, microAppWindow) {
     };
 }
 
-function patchIframeElement(appName, url, microAppWindow, iframeSandbox) {
-    patchIframeNode(appName, microAppWindow, iframeSandbox);
+function patchIframeElement(appName, url, microAppWindow, sandbox) {
+    patchIframeNode(appName, microAppWindow, sandbox);
     patchIframeAttribute(appName, url, microAppWindow);
 }
-function patchIframeNode(appName, microAppWindow, iframeSandbox) {
-    const microDocument = microAppWindow.document;
+function patchIframeNode(appName, microAppWindow, sandbox) {
+    const rawRootElement = globalEnv.rawRootElement; // native root Element
     const rawDocument = globalEnv.rawDocument;
+    const microDocument = microAppWindow.document;
     const microRootNode = microAppWindow.Node;
     const microRootElement = microAppWindow.Element;
     // const rawMicroGetRootNode = microRootNode.prototype.getRootNode
     const rawMicroAppendChild = microRootNode.prototype.appendChild;
     const rawMicroInsertBefore = microRootNode.prototype.insertBefore;
     const rawMicroReplaceChild = microRootNode.prototype.replaceChild;
+    const rawMicroRemoveChild = microRootNode.prototype.removeChild;
+    const rawMicroAppend = microRootElement.prototype.append;
+    const rawMicroPrepend = microRootElement.prototype.prepend;
+    const rawMicroInsertAdjacentElement = microRootElement.prototype.insertAdjacentElement;
     const rawMicroCloneNode = microRootNode.prototype.cloneNode;
     const rawInnerHTMLDesc = Object.getOwnPropertyDescriptor(microRootElement.prototype, 'innerHTML');
     const rawParentNodeLDesc = Object.getOwnPropertyDescriptor(microRootNode.prototype, 'parentNode');
     const isPureNode = (target) => {
         return (isScriptElement(target) || isBaseElement(target)) && target.__PURE_ELEMENT__;
     };
-    const getRawTarget = (target) => {
-        if (target === iframeSandbox.microHead) {
+    const getRawTarget = (parent) => {
+        if (parent === sandbox.microHead) {
             return rawDocument.head;
         }
-        else if (target === iframeSandbox.microBody) {
+        else if (parent === sandbox.microBody) {
             return rawDocument.body;
         }
-        return target;
+        return parent;
     };
     microRootNode.prototype.getRootNode = function getRootNode() {
         return microDocument;
@@ -5915,46 +5926,70 @@ function patchIframeNode(appName, microAppWindow, iframeSandbox) {
     };
     microRootNode.prototype.appendChild = function appendChild(node) {
         updateElementInfo(node, appName);
-        // TODO：只有script才可以这样拦截，link、style不应该拦截
         if (isPureNode(node)) {
             return rawMicroAppendChild.call(this, node);
         }
-        const _this = getRawTarget(this);
-        if (_this !== this) {
-            return _this.appendChild(node);
-        }
-        return rawMicroAppendChild.call(_this, node);
+        return rawRootElement.prototype.appendChild.call(getRawTarget(this), node);
     };
-    // TODO: 更多场景适配
     microRootNode.prototype.insertBefore = function insertBefore(node, child) {
         updateElementInfo(node, appName);
         if (isPureNode(node)) {
             return rawMicroInsertBefore.call(this, node, child);
         }
-        const _this = getRawTarget(this);
-        if (_this !== this) {
-            if (child && !_this.contains(child)) {
-                return _this.appendChild(node);
-            }
-            return _this.insertBefore(node, child);
-        }
-        return rawMicroInsertBefore.call(_this, node, child);
+        return rawRootElement.prototype.insertBefore.call(getRawTarget(this), node, child);
     };
-    // TODO: 更多场景适配
     microRootNode.prototype.replaceChild = function replaceChild(node, child) {
         updateElementInfo(node, appName);
         if (isPureNode(node)) {
             return rawMicroReplaceChild.call(this, node, child);
         }
-        const _this = getRawTarget(this);
-        if (_this !== this) {
-            if (child && !_this.contains(child)) {
-                _this.appendChild(node);
-                return child;
-            }
-            return _this.replaceChild(node, child);
+        return rawRootElement.prototype.replaceChild.call(getRawTarget(this), node, child);
+    };
+    microRootNode.prototype.removeChild = function removeChild(oldChild) {
+        if (isPureNode(oldChild) || this.contains(oldChild)) {
+            return rawMicroRemoveChild.call(this, oldChild);
+        }
+        return rawRootElement.prototype.removeChild.call(getRawTarget(this), oldChild);
+    };
+    microRootElement.prototype.append = function append(...nodes) {
+        let i = 0;
+        let hasPureNode = false;
+        while (i < nodes.length) {
+            nodes[i] = isNode(nodes[i]) ? nodes[i] : microDocument.createTextNode(nodes[i]);
+            if (isPureNode(nodes[i]))
+                hasPureNode = true;
+            i++;
+        }
+        if (hasPureNode) {
+            return rawMicroAppend.call(this, ...nodes);
+        }
+        return rawRootElement.prototype.append.call(getRawTarget(this), ...nodes);
+    };
+    microRootElement.prototype.prepend = function prepend(...nodes) {
+        let i = 0;
+        let hasPureNode = false;
+        while (i < nodes.length) {
+            nodes[i] = isNode(nodes[i]) ? nodes[i] : microDocument.createTextNode(nodes[i]);
+            if (isPureNode(nodes[i]))
+                hasPureNode = true;
+            i++;
+        }
+        if (hasPureNode) {
+            return rawMicroPrepend.call(this, ...nodes);
+        }
+        return rawRootElement.prototype.prepend.call(getRawTarget(this), ...nodes);
+    };
+    /**
+     * The insertAdjacentElement method of the Element interface inserts a given element node at a given position relative to the element it is invoked upon.
+     * Scenes:
+     *  1. vite4 development env for style
+     */
+    microRootElement.prototype.insertAdjacentElement = function insertAdjacentElement(where, element) {
+        updateElementInfo(element, appName);
+        if (isPureNode(element)) {
+            return rawMicroInsertAdjacentElement.call(this, where, element);
         }
-        return rawMicroReplaceChild.call(_this, node, child);
+        return rawRootElement.prototype.insertAdjacentElement.call(getRawTarget(this), where, element);
     };
     // patch cloneNode
     microRootNode.prototype.cloneNode = function cloneNode(deep) {
@@ -5999,7 +6034,6 @@ function patchIframeNode(appName, microAppWindow, iframeSandbox) {
             }
             return result;
         },
-        set: undefined,
     });
     // Adapt to new image(...) scene
     const ImageProxy = new Proxy(microAppWindow.Image, {
@@ -6039,6 +6073,12 @@ function patchIframeAttribute(appName, url, microAppWindow) {
         [microAppWindow.HTMLScriptElement.prototype, 'src'],
         [microAppWindow.HTMLLinkElement.prototype, 'href'],
     ];
+    /**
+     * element.setAttribute does not trigger this actions:
+     *  1. img.src = xxx
+     *  2. script.src = xxx
+     *  3. link.href = xxx
+     */
     protoAttrList.forEach(([target, attr]) => {
         const { enumerable, configurable, get, set } = Object.getOwnPropertyDescriptor(target, attr) || {
             enumerable: true,
@@ -6071,23 +6111,30 @@ class IframeSandbox {
         };
         const rawLocation = globalEnv.rawWindow.location;
         const browserHost = rawLocation.protocol + '//' + rawLocation.host;
-        const childStaticLocation = new URL(url);
-        const childHost = childStaticLocation.protocol + '//' + childStaticLocation.host;
-        const childFullPath = childStaticLocation.pathname + childStaticLocation.search + childStaticLocation.hash;
         this.deleteIframeElement = this.createIframeElement(appName, browserHost);
         this.microAppWindow = this.iframe.contentWindow;
         this.patchIframe(this.microAppWindow, (resolve) => {
             // TODO: 优化代码
-            // exec before initStaticGlobalKeys
-            this.createProxyLocation(appName, url, this.microAppWindow, childStaticLocation, browserHost, childHost);
-            this.createProxyWindow(this.microAppWindow);
-            this.initStaticGlobalKeys(appName, url);
+            // create new html to iframe
+            this.createIframeTemplate(this.microAppWindow);
             // get escapeProperties from plugins
             this.getSpecialProperties(appName);
-            this.createIframeTemplate(this.microAppWindow);
-            patchIframeRoute(appName, this.microAppWindow, childFullPath);
+            // rewrite location & history of child app
+            this.proxyLocation = patchIframeRoute(appName, url, this.microAppWindow, browserHost);
+            // create proxy window
+            this.proxyWindow = this.createProxyWindow(this.microAppWindow);
+            /**
+             * create static properties
+             * NOTE:
+             *  1. execute as early as possible
+             *  2. run after patchIframeRoute & createProxyWindow
+             */
+            this.initStaticGlobalKeys(appName, url);
+            // rewrite window of child app
             this.windowEffect = patchIframeWindow(appName, this.microAppWindow);
+            // rewrite document of child app
             this.documentEffect = patchIframeDocument(appName, this.microAppWindow, this.proxyLocation);
+            // rewrite Node & Element of child app
             patchIframeElement(appName, url, this.microAppWindow, this);
             resolve();
         });
@@ -6124,53 +6171,80 @@ class IframeSandbox {
         });
     }
     start({ baseroute, useMemoryRouter, defaultPage, disablePatchRequest, }) {
-        if (!this.active) {
-            this.active = true;
-            // TODO: 虚拟路由升级
-            if (useMemoryRouter) {
-                this.initRouteState(defaultPage);
-                // unique listener of popstate event for sub app
-                this.removeHistoryListener = addHistoryListener(this.microAppWindow.__MICRO_APP_NAME__);
-            }
-            else {
-                this.microAppWindow.__MICRO_APP_BASE_ROUTE__ = this.microAppWindow.__MICRO_APP_BASE_URL__ = baseroute;
-            }
-            /**
-             * create base element to iframe
-             * WARNING: This will also affect a, image, link and script
-             */
-            if (!disablePatchRequest) {
-                this.createIframeBase();
-            }
-            if (++globalEnv.activeSandbox === 1) {
-                patchElementAndDocument();
-                patchHistory();
-            }
-            if (++IframeSandbox.activeCount === 1) ;
+        if (this.active)
+            return;
+        this.active = true;
+        // TODO: 虚拟路由升级
+        // eslint-disable-next-line
+        if (useMemoryRouter || true) {
+            this.initRouteState(defaultPage);
+            // unique listener of popstate event for sub app
+            this.removeHistoryListener = addHistoryListener(this.microAppWindow.__MICRO_APP_NAME__);
+        }
+        else {
+            this.microAppWindow.__MICRO_APP_BASE_ROUTE__ = this.microAppWindow.__MICRO_APP_BASE_URL__ = baseroute;
+        }
+        /**
+         * create base element to iframe
+         * WARNING: This will also affect a, image, link and script
+         */
+        if (!disablePatchRequest) {
+            this.createIframeBase();
         }
+        if (++globalEnv.activeSandbox === 1) {
+            patchElementAndDocument();
+            patchHistory();
+        }
+        if (++IframeSandbox.activeCount === 1) ;
     }
     stop({ umdMode, keepRouteState, destroy, clearData, }) {
-        if (this.active) {
-            this.recordAndReleaseEffect({ clearData }, !umdMode || destroy);
-            if (this.removeHistoryListener) {
-                this.clearRouteState(keepRouteState);
-                // release listener of popstate
-                this.removeHistoryListener();
-            }
-            if (!umdMode || destroy) {
-                this.deleteIframeElement();
-                this.escapeKeys.forEach((key) => {
-                    Reflect.deleteProperty(globalEnv.rawWindow, key);
-                });
-                this.escapeKeys.clear();
-            }
-            if (--globalEnv.activeSandbox === 0) {
-                releasePatchElementAndDocument();
-                releasePatchHistory();
-            }
-            if (--IframeSandbox.activeCount === 0) ;
-            this.active = false;
+        if (!this.active)
+            return;
+        this.recordAndReleaseEffect({ clearData }, !umdMode || destroy);
+        if (this.removeHistoryListener) {
+            this.clearRouteState(keepRouteState);
+            // release listener of popstate
+            this.removeHistoryListener();
+        }
+        if (!umdMode || destroy) {
+            this.deleteIframeElement();
+            this.escapeKeys.forEach((key) => {
+                Reflect.deleteProperty(globalEnv.rawWindow, key);
+            });
+            this.escapeKeys.clear();
         }
+        if (--globalEnv.activeSandbox === 0) {
+            releasePatchElementAndDocument();
+            releasePatchHistory();
+        }
+        if (--IframeSandbox.activeCount === 0) ;
+        this.active = false;
+    }
+    /**
+     * create static properties
+     * NOTE:
+     *  1. execute as early as possible
+     *  2. run after patchIframeRoute & createProxyWindow
+     */
+    initStaticGlobalKeys(appName, url) {
+        this.microAppWindow.__MICRO_APP_ENVIRONMENT__ = true;
+        this.microAppWindow.__MICRO_APP_NAME__ = appName;
+        this.microAppWindow.__MICRO_APP_URL__ = url;
+        this.microAppWindow.__MICRO_APP_PUBLIC_PATH__ = getEffectivePath(url);
+        this.microAppWindow.__MICRO_APP_BASE_ROUTE__ = '';
+        this.microAppWindow.__MICRO_APP_WINDOW__ = this.microAppWindow;
+        this.microAppWindow.__MICRO_APP_PRE_RENDER__ = false;
+        this.microAppWindow.__MICRO_APP_UMD_MODE__ = false;
+        this.microAppWindow.__MICRO_APP_SANDBOX__ = this;
+        this.microAppWindow.__MICRO_APP_PROXY_WINDOW__ = this.proxyWindow;
+        this.microAppWindow.rawWindow = globalEnv.rawWindow;
+        this.microAppWindow.rawDocument = globalEnv.rawDocument;
+        this.microAppWindow.microApp = assign(new EventCenterForMicroApp(appName), {
+            removeDomScope,
+            pureCreateElement,
+            location: this.proxyLocation,
+            router,
+        });
     }
     /**
      * Record global effect and then release (effect: global event, timeout, data listener)
@@ -6248,29 +6322,10 @@ class IframeSandbox {
     setPreRenderState(state) {
         this.microAppWindow.__MICRO_APP_PRE_RENDER__ = state;
     }
+    // record umdMode
     markUmdMode(state) {
         this.microAppWindow.__MICRO_APP_UMD_MODE__ = state;
     }
-    initStaticGlobalKeys(appName, url) {
-        this.microAppWindow.__MICRO_APP_ENVIRONMENT__ = true;
-        this.microAppWindow.__MICRO_APP_NAME__ = appName;
-        this.microAppWindow.__MICRO_APP_URL__ = url;
-        this.microAppWindow.__MICRO_APP_PUBLIC_PATH__ = getEffectivePath(url);
-        this.microAppWindow.__MICRO_APP_BASE_ROUTE__ = '';
-        this.microAppWindow.__MICRO_APP_WINDOW__ = this.microAppWindow;
-        this.microAppWindow.__MICRO_APP_PRE_RENDER__ = false;
-        this.microAppWindow.__MICRO_APP_UMD_MODE__ = false;
-        this.microAppWindow.__MICRO_APP_SANDBOX__ = this;
-        this.microAppWindow.__MICRO_APP_PROXY_WINDOW__ = this.proxyWindow;
-        this.microAppWindow.rawWindow = globalEnv.rawWindow;
-        this.microAppWindow.rawDocument = globalEnv.rawDocument;
-        this.microAppWindow.microApp = assign(new EventCenterForMicroApp(appName), {
-            removeDomScope,
-            pureCreateElement,
-            location: this.proxyLocation,
-            router,
-        });
-    }
     // TODO: RESTRUCTURE
     patchIframe(microAppWindow, cb) {
         const oldMicroDocument = microAppWindow.document;
@@ -6319,12 +6374,9 @@ class IframeSandbox {
         this.updateIframeBase();
         this.microHead.appendChild(this.baseElement);
     }
-    createProxyLocation(appName, url, microAppWindow, childStaticLocation, browserHost, childHost) {
-        this.proxyLocation = createMicroLocation(appName, url, microAppWindow, childStaticLocation, browserHost, childHost);
-    }
     createProxyWindow(microAppWindow) {
         const rawWindow = globalEnv.rawWindow;
-        this.proxyWindow = new Proxy(microAppWindow, {
+        return new Proxy(microAppWindow, {
             get: (target, key) => {
                 if (key === 'location') {
                     return this.proxyLocation;
@@ -6335,20 +6387,18 @@ class IframeSandbox {
                 return bindFunctionToRawTarget(Reflect.get(target, key), target);
             },
             set: (target, key, value) => {
-                if (this.active) {
-                    /**
-                     * TODO:
-                     * 1、location域名相同，子应用内部跳转时的处理
-                     * 2、和with沙箱的变量相同，提取成公共数组
-                     */
-                    if (key === 'location') {
-                        return Reflect.set(rawWindow, key, value);
-                    }
-                    Reflect.set(target, key, value);
-                    if (this.escapeProperties.includes(key)) {
-                        !Reflect.has(rawWindow, key) && this.escapeKeys.add(key);
-                        Reflect.set(rawWindow, key, value);
-                    }
+                /**
+                 * TODO:
+                 * 1、location域名相同，子应用内部跳转时的处理
+                 * 2、和with沙箱的变量相同，提取成公共数组
+                 */
+                if (key === 'location') {
+                    return Reflect.set(rawWindow, key, value);
+                }
+                Reflect.set(target, key, value);
+                if (this.escapeProperties.includes(key)) {
+                    !Reflect.has(rawWindow, key) && this.escapeKeys.add(key);
+                    Reflect.set(rawWindow, key, value);
                 }
                 return true;
             },
@@ -6677,7 +6727,7 @@ class CreateApp {
                                     this.handleMounted(this.umdHookMount(microApp.getData(this.name, true)));
                                 }
                                 catch (e) {
-                                    logError('An error occurred in function mount \n', this.name, e);
+                                    logError('An error occurred in window.mount \n', this.name, e);
                                 }
                             }
                             else if (isFinished === true) {
@@ -6692,7 +6742,7 @@ class CreateApp {
                         this.handleMounted(this.umdHookMount(microApp.getData(this.name, true)));
                     }
                     catch (e) {
-                        logError('An error occurred in function mount \n', this.name, e);
+                        logError('An error occurred in window.mount \n', this.name, e);
                     }
                 }
             }
@@ -6710,7 +6760,7 @@ class CreateApp {
             if (isPromise(umdHookMountResult)) {
                 umdHookMountResult
                     .then(() => this.dispatchMountedEvent())
-                    .catch((e) => this.onerror(e));
+                    .catch(() => this.dispatchMountedEvent());
             }
             else {
                 this.dispatchMountedEvent();
@@ -6738,7 +6788,8 @@ class CreateApp {
     }
     /**
      * unmount app
-     * NOTE: Do not add any params on account of unmountApp
+     * NOTE:
+     *  1. do not add any params on account of unmountApp
      * @param destroy completely destroy, delete cache resources
      * @param clearData clear data of dateCenter
      * @param keepRouteState keep route state when unmount, default is false
@@ -6748,33 +6799,35 @@ class CreateApp {
         var _a;
         destroy = destroy || this.state === appStates.LOAD_FAILED;
         this.setAppState(appStates.UNMOUNT);
-        // result of unmount function
         let umdHookUnmountResult = null;
-        /**
-         * send an unmount event to the micro app or call umd unmount hook
-         * before the sandbox is cleared
-         */
         try {
+            // call umd unmount hook before the sandbox is cleared
             umdHookUnmountResult = (_a = this.umdHookUnmount) === null || _a === void 0 ? void 0 : _a.call(this, microApp.getData(this.name, true));
         }
         catch (e) {
-            logError('An error occurred in function unmount \n', this.name, e);
+            logError('An error occurred in window.unmount \n', this.name, e);
         }
         // dispatch unmount event to micro app
         dispatchCustomEventToMicroApp(this, 'unmount');
         // call window.onunmount of child app
         execMicroAppGlobalHook(this.getMicroAppGlobalHook(microGlobalEvent.ONUNMOUNT), this.name, microGlobalEvent.ONUNMOUNT);
-        this.handleUnmounted(destroy, clearData, keepRouteState, umdHookUnmountResult, unmountcb);
+        this.handleUnmounted({
+            destroy,
+            clearData,
+            keepRouteState,
+            unmountcb,
+            umdHookUnmountResult,
+        });
     }
     /**
      * handle for promise umdHookUnmount
      * @param destroy completely destroy, delete cache resources
      * @param clearData clear data of dateCenter
      * @param keepRouteState keep route state when unmount, default is false
-     * @param umdHookUnmountResult result of umdHookUnmount
      * @param unmountcb callback of unmount
+     * @param umdHookUnmountResult result of umdHookUnmount
      */
-    handleUnmounted(destroy, clearData, keepRouteState, umdHookUnmountResult, unmountcb) {
+    handleUnmounted({ destroy, clearData, keepRouteState, unmountcb, umdHookUnmountResult, }) {
         const nextAction = () => this.actionsForUnmount({
             destroy,
             clearData,
@@ -6782,6 +6835,8 @@ class CreateApp {
             unmountcb,
         });
         if (isPromise(umdHookUnmountResult)) {
+            // async window.unmount will cause appName bind error in nest app
+            removeDomScope();
             umdHookUnmountResult.then(nextAction).catch(nextAction);
         }
         else {
@@ -6795,7 +6850,7 @@ class CreateApp {
      * @param keepRouteState keep route state when unmount, default is false
      * @param unmountcb callback of unmount
      */
-    actionsForUnmount({ destroy, clearData, keepRouteState, unmountcb }) {
+    actionsForUnmount({ destroy, clearData, keepRouteState, unmountcb, }) {
         var _a;
         if (this.umdMode && this.container && !destroy) {
             cloneContainer(this.container, this.source.html, false);
@@ -6812,9 +6867,6 @@ class CreateApp {
             destroy,
             clearData: clearData || destroy,
         });
-        if (!getActiveApps().length) {
-            releasePatchSetAttribute();
-        }
         // dispatch unmount event to base app
         dispatchLifecyclesEvent(this.container, this.name, lifeCycles.UNMOUNT);
         this.clearOptions(destroy);
@@ -6831,6 +6883,7 @@ class CreateApp {
             this.sandBox = null;
         if (destroy)
             this.actionsForCompletelyDestroy();
+        removeDomScope();
     }
     // actions for completely destroy
     actionsForCompletelyDestroy() {
@@ -6964,7 +7017,7 @@ function isIframeSandbox(appName) {
 function defineElement(tagName) {
     class MicroAppElement extends HTMLElement {
         constructor() {
-            super();
+            super(...arguments);
             this.isWaiting = false;
             this.cacheData = null;
             this.connectedCount = 0;
@@ -7016,8 +7069,6 @@ function defineElement(tagName) {
                     this.setAttribute('name', this.appName);
                 }
             };
-            // patchSetAttribute hijiack data attribute, it needs exec first
-            patchSetAttribute();
         }
         static get observedAttributes() {
             return ['name', 'url'];
@@ -7286,6 +7337,7 @@ function defineElement(tagName) {
          */
         handleAppMount(app) {
             app.isPrefetch = false;
+            // TODO: Can defer be removed?
             defer(() => this.mount(app));
         }
         /**
@@ -7427,6 +7479,30 @@ function defineElement(tagName) {
                 this.getAttribute('defaultPage') ||
                 '');
         }
+        /**
+         * Rewrite micro-app.setAttribute, process attr data
+         * @param key attr name
+         * @param value attr value
+         */
+        setAttribute(key, value) {
+            if (key === 'data') {
+                if (isPlainObject(value)) {
+                    const cloneValue = {};
+                    Object.getOwnPropertyNames(value).forEach((ownKey) => {
+                        if (!(isString(ownKey) && ownKey.indexOf('__') === 0)) {
+                            cloneValue[ownKey] = value[ownKey];
+                        }
+                    });
+                    this.data = cloneValue;
+                }
+                else if (value !== '[object Object]') {
+                    logWarn('property data must be an object', this.appName);
+                }
+            }
+            else {
+                globalEnv.rawSetAttribute.call(this, key, value);
+            }
+        }
         /**
          * Data from the base application
          */