@lynx-js/web-worker-runtime 0.15.7 → 0.16.1

package/CHANGELOG.md

@@ -1,5 +1,40 @@
 # @lynx-js/web-worker-runtime
 
+## 0.16.1
+
+### Patch Changes
+
+- feat: supports lazy bundle. (This feature requires `@lynx-js/lynx-core >= 0.1.3`) ([#1235](https://github.com/lynx-family/lynx-stack/pull/1235))
+
+- Updated dependencies [[`608f375`](https://github.com/lynx-family/lynx-stack/commit/608f375e20732cc4c9f141bfbf9800ba6896100b)]:
+  - @lynx-js/web-mainthread-apis@0.16.1
+  - @lynx-js/web-constants@0.16.1
+  - @lynx-js/web-worker-rpc@0.16.1
+
+## 0.16.0
+
+### Minor Changes
+
+- refactor: provide the mts a real globalThis ([#1589](https://github.com/lynx-family/lynx-stack/pull/1589))
+
+  Before this change, We create a function wrapper and a fake globalThis for Javascript code.
+
+  This caused some issues.
+
+  After this change, we will create an iframe for createing an isolated Javascript context.
+
+  This means the globalThis will be the real one.
+
+### Patch Changes
+
+- fix: the SystemInfo in bts should be assigned to the globalThis ([#1599](https://github.com/lynx-family/lynx-stack/pull/1599))
+
+- Updated dependencies [[`1a32dd8`](https://github.com/lynx-family/lynx-stack/commit/1a32dd886fe736c95639f67028cf7685377d9769), [`bb53d9a`](https://github.com/lynx-family/lynx-stack/commit/bb53d9a035f607e7c89952098d4ed77877a2e3c1), [`1a32dd8`](https://github.com/lynx-family/lynx-stack/commit/1a32dd886fe736c95639f67028cf7685377d9769), [`c1f8715`](https://github.com/lynx-family/lynx-stack/commit/c1f8715a81b2e69ff46fc363013626db4468c209)]:
+  - @lynx-js/web-mainthread-apis@0.16.0
+  - @lynx-js/web-constants@0.16.0
+  - @lynx-js/offscreen-document@0.1.4
+  - @lynx-js/web-worker-rpc@0.16.0
+
 ## 0.15.7
 
 ### Patch Changes

package/dist/backgroundThread/background-apis/createBackgroundLynx.d.ts

@@ -12,4 +12,12 @@ export declare function createBackgroundLynx(config: BackMainThreadContextConfig
         animate(operation: import("@lynx-js/web-constants").AnimationOperation, id: string, keyframes?: Record<string, any>[], timingOptions?: Record<string, any>): void;
     };
     getI18nResource: () => import("@lynx-js/web-constants").Cloneable;
+    QueryComponent: (source: string, callback: (ret: {
+        __hasReady: boolean;
+    } | {
+        code: number;
+        detail?: {
+            schema: string;
+        };
+    }) => void) => void;
 };

package/dist/backgroundThread/background-apis/createBackgroundLynx.js

@@ -31,6 +31,7 @@ export function createBackgroundLynx(config, nativeApp, mainThreadRpc, uiThreadR
             return createElement(id, uiThreadRpc);
         },
         getI18nResource: () => nativeApp.i18nResource.data,
+        QueryComponent: (source, callback) => nativeApp.queryComponent(source, callback),
     };
 }
 //# sourceMappingURL=createBackgroundLynx.js.map

package/dist/backgroundThread/background-apis/createNativeApp.js

@@ -1,4 +1,4 @@
-import { callLepusMethodEndpoint, setNativePropsEndpoint, triggerComponentEventEndpoint, selectComponentEndpoint, systemInfo, I18nResource, reportErrorEndpoint, globalDisallowedVars, } from '@lynx-js/web-constants';
+import { callLepusMethodEndpoint, setNativePropsEndpoint, triggerComponentEventEndpoint, selectComponentEndpoint, I18nResource, reportErrorEndpoint, queryComponentEndpoint, updateBTSTemplateCacheEndpoint, } from '@lynx-js/web-constants';
 import { createInvokeUIMethod } from './crossThreadHandlers/createInvokeUIMethod.js';
 import { registerPublicComponentEventHandler } from './crossThreadHandlers/registerPublicComponentEventHandler.js';
 import { registerGlobalExposureEventHandler } from './crossThreadHandlers/registerGlobalExposureEventHandler.js';
@@ -14,43 +14,24 @@ import { createGetPathInfo } from './crossThreadHandlers/createGetPathInfo.js';
 let nativeAppCount = 0;
 const sharedData = {};
 export async function createNativeApp(config) {
-    const { mainThreadRpc, uiThreadRpc, template, nativeModulesMap, timingSystem, browserConfig, } = config;
+    const { mainThreadRpc, uiThreadRpc, template, nativeModulesMap, timingSystem, } = config;
     const performanceApis = createPerformanceApis(timingSystem);
     const callLepusMethod = mainThreadRpc.createCallbackify(callLepusMethodEndpoint, 2);
     const setNativeProps = uiThreadRpc.createCall(setNativePropsEndpoint);
     const triggerComponentEvent = uiThreadRpc.createCall(triggerComponentEventEndpoint);
     const selectComponent = uiThreadRpc.createCallbackify(selectComponentEndpoint, 3);
+    const queryComponent = mainThreadRpc.createCall(queryComponentEndpoint);
     const reportError = uiThreadRpc.createCall(reportErrorEndpoint);
     const createBundleInitReturnObj = () => {
-        const entry = globalThis.module.exports;
-        return {
-            init: (lynxCoreInject) => {
-                lynxCoreInject.tt.lynxCoreInject = lynxCoreInject;
-                lynxCoreInject.tt.globalThis ??= new Proxy(lynxCoreInject, {
-                    get(target, prop) {
-                        if (typeof prop === 'string' && globalDisallowedVars.includes(prop)) {
-                            return undefined;
-                        }
-                        // @ts-expect-error
-                        return target[prop] ?? globalThis[prop];
-                    },
-                    set(target, prop, value) {
-                        // @ts-expect-error
-                        target[prop] = value;
-                        return true;
-                    },
-                    ownKeys(target) {
-                        return Reflect.ownKeys(target).filter((key) => key !== 'globalThis');
-                    },
-                });
-                Object.assign(lynxCoreInject.tt, {
-                    SystemInfo: { ...systemInfo, ...browserConfig },
-                });
-                const ret = entry?.(lynxCoreInject.tt);
-                return ret;
-            },
-        };
+        const ret = globalThis.module.exports ?? globalThis.__bundle__holder;
+        globalThis.module.exports = null;
+        globalThis.__bundle__holder = null;
+        return ret;
     };
+    const templateCache = new Map([['__Card__', template]]);
+    mainThreadRpc.registerHandler(updateBTSTemplateCacheEndpoint, (url, template) => {
+        templateCache.set(url, template);
+    });
     const i18nResource = new I18nResource();
     let release = '';
     const nativeApp = {
@@ -61,20 +42,28 @@ export async function createNativeApp(config) {
         clearTimeout: clearTimeout,
         clearInterval: clearInterval,
         nativeModuleProxy: await createNativeModules(uiThreadRpc, mainThreadRpc, nativeModulesMap),
-        loadScriptAsync: function (sourceURL, callback) {
-            const manifestUrl = template.manifest[`/${sourceURL}`];
+        loadScriptAsync: function (sourceURL, callback, entryName) {
+            entryName = entryName ?? '__Card__';
+            const manifestUrl = templateCache.get(entryName)
+                ?.manifest[`/${sourceURL}`];
             if (manifestUrl)
                 sourceURL = manifestUrl;
+            globalThis.module.exports = null;
+            globalThis.__bundle__holder = null;
             import(
             /* webpackIgnore: true */
             sourceURL).catch(callback).then(async () => {
                 callback(null, createBundleInitReturnObj());
             });
         },
-        loadScript: (sourceURL) => {
-            const manifestUrl = template.manifest[`/${sourceURL}`];
+        loadScript: (sourceURL, entryName) => {
+            entryName = entryName ?? '__Card__';
+            const manifestUrl = templateCache.get(entryName)
+                ?.manifest[`/${sourceURL}`];
             if (manifestUrl)
                 sourceURL = manifestUrl;
+            globalThis.module.exports = null;
+            globalThis.__bundle__holder = null;
             importScripts(sourceURL);
             return createBundleInitReturnObj();
         },
@@ -88,6 +77,7 @@ export async function createNativeApp(config) {
         setNativeProps,
         getPathInfo: createGetPathInfo(uiThreadRpc),
         invokeUIMethod: createInvokeUIMethod(uiThreadRpc),
+        tt: null,
         setCard(tt) {
             registerPublicComponentEventHandler(mainThreadRpc, tt);
             registerPublishEventHandler(mainThreadRpc, tt);
@@ -98,6 +88,7 @@ export async function createNativeApp(config) {
             registerUpdateI18nResource(uiThreadRpc, mainThreadRpc, i18nResource, tt);
             timingSystem.registerGlobalEmitter(tt.GlobalEventEmitter);
             tt.lynx.getCoreContext().__start();
+            nativeApp.tt = tt;
         },
         triggerComponentEvent,
         selectComponent,
@@ -111,6 +102,16 @@ export async function createNativeApp(config) {
         i18nResource,
         reportException: (err, _) => reportError(err, _, release),
         __SetSourceMapRelease: (err) => release = err.message,
+        queryComponent: (source, callback) => {
+            if (templateCache.has(source)) {
+                callback({ __hasReady: true });
+            }
+            else {
+                queryComponent(source).then(res => {
+                    callback?.(res);
+                });
+            }
+        },
     };
     return nativeApp;
 }

package/dist/backgroundThread/background-apis/startBackgroundThread.js

@@ -26,7 +26,11 @@ export function startBackgroundThread(uiThreadPort, mainThreadPort) {
         globalThis['napiLoaderOnRT' + nativeApp.id] =
             await createNapiLoader(uiThreadRpc, config.napiModulesMap);
         const nativeLynx = createBackgroundLynx(config, nativeApp, mainThreadRpc, uiThreadRpc);
-        lynxCore.then(({ loadCard, destroyCard, callDestroyLifetimeFun }) => {
+        lynxCore.then(({ loadCard, destroyCard, callDestroyLifetimeFun, nativeGlobal, loadDynamicComponent, }) => {
+            // @lynx-js/lynx-core >= 0.1.3 will export nativeGlobal and loadDynamicComponent
+            if (nativeGlobal && loadDynamicComponent) {
+                nativeGlobal.loadDynamicComponent = loadDynamicComponent;
+            }
             loadCard(nativeApp, {
                 ...config,
                 // @ts-ignore

package/dist/index.d.ts

@@ -2,4 +2,5 @@ export interface WorkerStartMessage {
     mode: 'main' | 'background';
     toPeerThread: MessagePort;
     toUIThread: MessagePort;
+    systemInfo?: Record<string, any>;
 }

package/dist/index.js

@@ -2,11 +2,18 @@
 // Licensed under the Apache License Version 2.0 that can be found in the
 // LICENSE file in the root directory of this source tree.
 import { startBackgroundThread } from './backgroundThread/index.js';
-import { startMainThreadWorker } from './mainThread/startMainThread.js';
-globalThis.onmessage = (ev) => {
-    const { mode, toPeerThread, toUIThread } = ev
+globalThis.onmessage = async (ev) => {
+    const { mode, toPeerThread, toUIThread, systemInfo } = ev
         .data;
+    if (!globalThis.SystemInfo) {
+        globalThis.SystemInfo = systemInfo;
+    }
     if (mode === 'main') {
+        const { startMainThreadWorker } = await import(
+        /* webpackChunkName: "web-worker-runtime-main-thread" */
+        /* webpackMode: "lazy-once" */
+        /* webpackPreload: true */
+        './mainThread/startMainThread.js');
         startMainThreadWorker(toUIThread, toPeerThread);
     }
     else {

package/dist/mainThread/startMainThread.js

@@ -1,14 +1,44 @@
 // Copyright 2023 The Lynx Authors. All rights reserved.
 // Licensed under the Apache License Version 2.0 that can be found in the
 // LICENSE file in the root directory of this source tree.
-import { flushElementTreeEndpoint, mainThreadStartEndpoint, postOffscreenEventEndpoint, reportErrorEndpoint, dispatchLynxViewEventEndpoint, i18nResourceMissedEventName, I18nResources, updateI18nResourcesEndpoint, multiThreadExposureChangedEndpoint, lynxUniqueIdAttribute, } from '@lynx-js/web-constants';
+import { flushElementTreeEndpoint, mainThreadStartEndpoint, postOffscreenEventEndpoint, reportErrorEndpoint, dispatchLynxViewEventEndpoint, i18nResourceMissedEventName, I18nResources, updateI18nResourcesEndpoint, multiThreadExposureChangedEndpoint, lynxUniqueIdAttribute, loadTemplateMultiThread, } from '@lynx-js/web-constants';
 import { Rpc } from '@lynx-js/web-worker-rpc';
 import { createMarkTimingInternal } from './crossThreadHandlers/createMainthreadMarkTimingInternal.js';
 import { OffscreenDocument } from '@lynx-js/offscreen-document/webworker';
 import { _onEvent } from '@lynx-js/offscreen-document/webworker';
 import { registerUpdateDataHandler } from './crossThreadHandlers/registerUpdateDataHandler.js';
+const { prepareMainThreadAPIs } = await import(
+/* webpackChunkName: "web-core-main-thread-apis" */
+/* webpackMode: "lazy-once" */
+/* webpackPreload: true */
+/* webpackPrefetch: true */
+/* webpackFetchPriority: "high" */
+'@lynx-js/web-mainthread-apis');
+function loadScriptSync(url) {
+    globalThis.module.exports = null;
+    importScripts(url);
+    const ret = globalThis.module?.exports;
+    return ret;
+}
+function loadScript(url) {
+    return new Promise((resolve, reject) => {
+        fetch(url)
+            .then(() => {
+            globalThis.module.exports = null;
+            importScripts(url);
+            const ret = globalThis.module?.exports;
+            resolve(ret);
+        }).catch(reject);
+    });
+}
+function createCurrentWorkerRealm() {
+    return {
+        globalWindow: globalThis,
+        loadScript,
+        loadScriptSync,
+    };
+}
 export async function startMainThreadWorker(uiThreadPort, backgroundThreadPort) {
-    const { prepareMainThreadAPIs } = await import('@lynx-js/web-mainthread-apis');
     const uiThreadRpc = new Rpc(uiThreadPort, 'main-to-ui');
     const backgroundThreadRpc = new Rpc(backgroundThreadPort, 'main-to-bg');
     const { markTimingInternal, flushMarkTimingInternal } = createMarkTimingInternal(backgroundThreadRpc);
@@ -20,27 +50,32 @@ export async function startMainThreadWorker(uiThreadPort, backgroundThreadPort)
             options,
         ]);
     };
-    const docu = new OffscreenDocument({
+    const document = new OffscreenDocument({
         onCommit: uiFlush,
     });
+    Object.assign(globalThis, {
+        document,
+    });
+    const mtsRealm = createCurrentWorkerRealm();
     const i18nResources = new I18nResources();
-    uiThreadRpc.registerHandler(postOffscreenEventEndpoint, docu[_onEvent]);
+    uiThreadRpc.registerHandler(postOffscreenEventEndpoint, document[_onEvent]);
     const sendMultiThreadExposureChangedEndpoint = uiThreadRpc.createCall(multiThreadExposureChangedEndpoint);
-    const { startMainThread } = prepareMainThreadAPIs(backgroundThreadRpc, docu, docu.createElement.bind(docu), (exposureChangedElementUniqueIds) => {
-        docu.commit();
+    const loadTemplate = uiThreadRpc.createCall(loadTemplateMultiThread);
+    const { startMainThread } = prepareMainThreadAPIs(backgroundThreadRpc, document, // rootDom
+    document, mtsRealm, (exposureChangedElementUniqueIds) => {
+        document.commit();
         sendMultiThreadExposureChangedEndpoint(exposureChangedElementUniqueIds
             .map(e => e.getAttribute(lynxUniqueIdAttribute))
             .filter(id => id !== null));
     }, markTimingInternal, flushMarkTimingInternal, reportError, triggerI18nResourceFallback, (initI18nResources) => {
         i18nResources.setData(initI18nResources);
         return i18nResources;
+    }, loadTemplate);
+    uiThreadRpc.registerHandler(mainThreadStartEndpoint, async (config) => {
+        await startMainThread(config);
+        registerUpdateDataHandler(uiThreadRpc, globalThis);
     });
-    uiThreadRpc.registerHandler(mainThreadStartEndpoint, (config) => {
-        startMainThread(config).then((runtime) => {
-            registerUpdateDataHandler(uiThreadRpc, runtime);
-        });
-    });
-    uiThreadRpc?.registerHandler(updateI18nResourcesEndpoint, data => {
+    uiThreadRpc.registerHandler(updateI18nResourcesEndpoint, data => {
         i18nResources.setData(data);
     });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lynx-js/web-worker-runtime",
-  "version": "0.15.7",
+  "version": "0.16.1",
   "private": false,
   "description": "",
   "keywords": [],
@@ -22,10 +22,10 @@
     "README.md"
   ],
   "dependencies": {
-    "@lynx-js/offscreen-document": "0.1.3",
-    "@lynx-js/web-constants": "0.15.7",
-    "@lynx-js/web-mainthread-apis": "0.15.7",
-    "@lynx-js/web-worker-rpc": "0.15.7"
+    "@lynx-js/offscreen-document": "0.1.4",
+    "@lynx-js/web-constants": "0.16.1",
+    "@lynx-js/web-mainthread-apis": "0.16.1",
+    "@lynx-js/web-worker-rpc": "0.16.1"
   },
   "devDependencies": {
     "@lynx-js/lynx-core": "0.1.3"