@lynx-js/web-worker-runtime-canary 0.17.1 → 0.17.2-canary-20250928-a35a2452

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @lynx-js/web-worker-runtime
 
+## 0.17.2-canary-20250928082931-a35a2452e5355bda3c475f9a750a86085e0cf56a
+
+### Patch Changes
+
+- feat: support load bts chunk from remote address ([#1834](https://github.com/lynx-family/lynx-stack/pull/1834))
+
+  - re-support chunk splitting
+  - support lynx.requireModule with a json file
+  - support lynx.requireModule, lynx.requireModuleAsync with a remote url
+  - support to add a breakpoint in chrome after reloading the web page
+
+- Updated dependencies [[`a35a245`](https://github.com/lynx-family/lynx-stack/commit/a35a2452e5355bda3c475f9a750a86085e0cf56a)]:
+  - @lynx-js/web-constants@0.17.2-canary-20250928082931-a35a2452e5355bda3c475f9a750a86085e0cf56a
+  - @lynx-js/web-mainthread-apis@0.17.2-canary-20250928082931-a35a2452e5355bda3c475f9a750a86085e0cf56a
+  - @lynx-js/web-worker-rpc@0.17.2-canary-20250928082931-a35a2452e5355bda3c475f9a750a86085e0cf56a
+
 ## 0.17.1
 
 ### Patch Changes
@@ -151,14 +167,14 @@
   Usage:
 
   ```ts
-  import { pluginWebPlatform } from '@lynx-js/web-platform-rsbuild-plugin';
-  import { defineConfig } from '@rsbuild/core';
+  import { pluginWebPlatform } from "@lynx-js/web-platform-rsbuild-plugin";
+  import { defineConfig } from "@rsbuild/core";
 
   export default defineConfig({
     plugins: [
       pluginWebPlatform({
         // replace with your actual napi-modules file path
-        napiModulesPath: path.resolve(__dirname, './index.napi-modules.ts'),
+        napiModulesPath: path.resolve(__dirname, "./index.napi-modules.ts"),
       }),
     ],
   });
@@ -169,10 +185,10 @@
   ```ts
   // index.napi-modules.ts
   export default {
-    custom_module: function(NapiModules, NapiModulesCall) {
+    custom_module: function (NapiModules, NapiModulesCall) {
       return {
         async test(name) {
-          console.log('CustomModule', NapiModules, NapiModulesCall);
+          console.log("CustomModule", NapiModules, NapiModulesCall);
         },
       };
     },
@@ -224,25 +240,25 @@
   lynxView.initI18nResources = [
     {
       options: {
-        locale: 'en',
-        channel: '1',
-        fallback_url: '',
+        locale: "en",
+        channel: "1",
+        fallback_url: "",
       },
       resource: {
-        hello: 'hello',
-        lynx: 'lynx web platform1',
+        hello: "hello",
+        lynx: "lynx web platform1",
       },
     },
   ];
-  lynxView.addEventListener('i18nResourceMissed', (e) => {
+  lynxView.addEventListener("i18nResourceMissed", (e) => {
     console.log(e);
   });
 
   // mts
   _I18nResourceTranslation({
-    locale: 'en',
-    channel: '1',
-    fallback_url: '',
+    locale: "en",
+    channel: "1",
+    fallback_url: "",
   });
   ```
 
@@ -492,8 +508,8 @@
       }
     };`,
         ],
-        { type: 'text/javascript' },
-      ),
+        { type: "text/javascript" }
+      )
     ),
   };
   lynxView.nativeModulesMap = nativeModulesMap;
@@ -583,8 +599,8 @@
     };
   };`,
       ],
-      { type: 'text/javascript' },
-    ),
+      { type: "text/javascript" }
+    )
   );
 
   const color_methods = URL.createObjectURL(
@@ -599,8 +615,8 @@
     };
   };`,
       ],
-      { type: 'text/javascript' },
-    ),
+      { type: "text/javascript" }
+    )
   );
 
   lynxView.napiModuleMap = {
@@ -617,7 +633,7 @@
 
   ```js
   lynxView.onNapiModulesCall = (name, data, moduleName) => {
-    if (name === 'getColor' && moduleName === 'color_methods') {
+    if (name === "getColor" && moduleName === "color_methods") {
       return data.color;
     }
   };
@@ -672,8 +688,8 @@
     }
   };`,
       ],
-      { type: 'text/javascript' },
-    ),
+      { type: "text/javascript" }
+    )
   );
   ```
 
@@ -685,7 +701,7 @@
 
   ```js
   lynxView.onNativeModulesCall = (name, data, callback) => {
-    if (name === 'getColor') {
+    if (name === "getColor") {
       callback(data.color);
     }
   };
@@ -695,7 +711,7 @@
 
   ```js
   lynxView.onNativeModulesCall = (name, data, moduleName) => {
-    if (name === 'getColor' && moduleName === 'bridge') {
+    if (name === "getColor" && moduleName === "bridge") {
       return data.color;
     }
   };

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

@@ -0,0 +1,7 @@
+import type { NativeApp, LynxTemplate } from '@lynx-js/web-constants';
+export declare function createChunkLoading(initialTemplate: LynxTemplate): {
+    readScript: NativeApp['readScript'];
+    loadScript: NativeApp['loadScript'];
+    loadScriptAsync: NativeApp['loadScriptAsync'];
+    templateCache: Map<string, LynxTemplate>;
+};

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

@@ -0,0 +1,73 @@
+// 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.
+export function createChunkLoading(initialTemplate) {
+    const templateCache = new Map([[
+            '__Card__',
+            initialTemplate,
+        ]]);
+    const readScript = (sourceURL, entryName = '__Card__') => {
+        const jsContentInTemplate = templateCache.get(entryName)
+            ?.manifest[`/${sourceURL}`];
+        if (jsContentInTemplate)
+            return jsContentInTemplate;
+        const xhr = new XMLHttpRequest();
+        xhr.open('GET', sourceURL, false);
+        xhr.send(null);
+        if (xhr.status === 200) {
+            return xhr.responseText;
+        }
+        throw new Error(`Failed to load ${sourceURL}, status: ${xhr.status}`);
+    };
+    const readScriptAsync = async (sourceURL, entryName = '__Card__') => {
+        const jsContentInTemplate = templateCache.get(entryName)
+            ?.manifest[`/${sourceURL}`];
+        if (jsContentInTemplate)
+            return jsContentInTemplate;
+        return new Promise((resolve, reject) => {
+            fetch(sourceURL).then((response) => {
+                if (response.ok) {
+                    response.text().then((text) => resolve(text), reject);
+                }
+                else {
+                    reject(new Error(`Failed to load ${sourceURL}, status: ${response.status}`));
+                }
+            }, reject);
+        });
+    };
+    const createBundleInitReturnObj = (jsContent, fileName) => {
+        const foo = new Function('postMessage', 'module', 'exports', 'lynxCoreInject', 'Card', 'setTimeout', 'setInterval', 'clearInterval', 'clearTimeout', 'NativeModules', 'Component', 'ReactLynx', 'nativeAppId', 'Behavior', 'LynxJSBI', 'lynx', 
+        // BOM API
+        'window', 'document', 'frames', 'location', 'navigator', 'localStorage', 'history', 'Caches', 'screen', 'alert', 'confirm', 'prompt', 'fetch', 'XMLHttpRequest', 'webkit', 'Reporter', 'print', 'global', 
+        // Lynx API
+        'requestAnimationFrame', 'cancelAnimationFrame', [
+            jsContent,
+            '\n//# sourceURL=',
+            fileName,
+        ].join(''));
+        return {
+            init(lynxCoreInject) {
+                const module = { exports: {} };
+                const tt = lynxCoreInject.tt;
+                foo(undefined, module, module.exports, lynxCoreInject, tt.Card, tt.setTimeout, tt.setInterval, tt.clearInterval, tt.clearTimeout, tt.NativeModules, tt.Component, tt.ReactLynx, tt.nativeAppId, tt.Behavior, tt.LynxJSBI, tt.lynx, 
+                // BOM API
+                tt.window, tt.document, tt.frames, tt.location, tt.navigator, tt.localStorage, tt.history, tt.Caches, tt.screen, tt.alert, tt.confirm, tt.prompt, tt.fetch, tt.XMLHttpRequest, tt.webkit, tt.Reporter, tt.print, tt.global, tt.requestAnimationFrame, tt.cancelAnimationFrame);
+                return module.exports;
+            },
+        };
+    };
+    return {
+        readScript,
+        loadScript: (sourceURL, entryName = '__Card__') => {
+            const jsContent = readScript(sourceURL, entryName);
+            return createBundleInitReturnObj(jsContent, `${encodeURIComponent(entryName)}/${sourceURL}`);
+        },
+        loadScriptAsync: async (sourceURL, callback, entryName = '__Card__') => {
+            readScriptAsync(sourceURL, entryName).then((jsContent) => {
+                callback(null, createBundleInitReturnObj(jsContent, `${encodeURIComponent(entryName)}/${sourceURL}`));
+            });
+        },
+        templateCache,
+    };
+}
+//# sourceMappingURL=createChunkLoading.js.map

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

@@ -11,6 +11,7 @@ import { createJSObjectDestructionObserver } from './crossThreadHandlers/createJ
 import { registerUpdateGlobalPropsHandler } from './crossThreadHandlers/registerUpdateGlobalPropsHandler.js';
 import { registerUpdateI18nResource } from './crossThreadHandlers/registerUpdateI18nResource.js';
 import { createGetPathInfo } from './crossThreadHandlers/createGetPathInfo.js';
+import { createChunkLoading } from './createChunkLoading.js';
 let nativeAppCount = 0;
 const sharedData = {};
 export async function createNativeApp(config) {
@@ -22,13 +23,7 @@ export async function createNativeApp(config) {
     const selectComponent = uiThreadRpc.createCallbackify(selectComponentEndpoint, 3);
     const queryComponent = mainThreadRpc.createCall(queryComponentEndpoint);
     const reportError = uiThreadRpc.createCall(reportErrorEndpoint);
-    const createBundleInitReturnObj = () => {
-        const ret = globalThis.module.exports ?? globalThis.__bundle__holder;
-        globalThis.module.exports = null;
-        globalThis.__bundle__holder = null;
-        return ret;
-    };
-    const templateCache = new Map([['__Card__', template]]);
+    const { templateCache, loadScript, loadScriptAsync, readScript } = createChunkLoading(template);
     mainThreadRpc.registerHandler(updateBTSTemplateCacheEndpoint, (url, template) => {
         templateCache.set(url, template);
     });
@@ -42,35 +37,9 @@ export async function createNativeApp(config) {
         clearTimeout: clearTimeout,
         clearInterval: clearInterval,
         nativeModuleProxy: await createNativeModules(uiThreadRpc, mainThreadRpc, nativeModulesMap),
-        loadScriptAsync: function (sourceURL, callback, entryName) {
-            entryName = entryName ?? '__Card__';
-            const manifestUrl = templateCache.get(entryName)
-                ?.manifest[`/${sourceURL}`];
-            if (manifestUrl)
-                sourceURL = manifestUrl;
-            else
-                throw Error(`Cannot find ${sourceURL} in manifest`);
-            globalThis.module.exports = null;
-            globalThis.__bundle__holder = null;
-            import(
-            /* webpackIgnore: true */
-            sourceURL).catch(callback).then(async () => {
-                callback(null, createBundleInitReturnObj());
-            });
-        },
-        loadScript: (sourceURL, entryName) => {
-            entryName = entryName ?? '__Card__';
-            const manifestUrl = templateCache.get(entryName)
-                ?.manifest[`/${sourceURL}`];
-            if (manifestUrl)
-                sourceURL = manifestUrl;
-            else
-                throw Error(`Cannot find ${sourceURL} in manifest`);
-            globalThis.module.exports = null;
-            globalThis.__bundle__holder = null;
-            importScripts(sourceURL);
-            return createBundleInitReturnObj();
-        },
+        readScript,
+        loadScriptAsync,
+        loadScript,
         requestAnimationFrame(cb) {
             return requestAnimationFrame(cb);
         },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lynx-js/web-worker-runtime-canary",
-  "version": "0.17.1",
+  "version": "0.17.2-canary-20250928-a35a2452",
   "private": false,
   "description": "",
   "keywords": [],
@@ -23,9 +23,9 @@
   ],
   "dependencies": {
     "@lynx-js/offscreen-document": "npm:@lynx-js/offscreen-document-canary@0.1.4",
-    "@lynx-js/web-constants": "npm:@lynx-js/web-constants-canary@0.17.1",
-    "@lynx-js/web-mainthread-apis": "npm:@lynx-js/web-mainthread-apis-canary@0.17.1",
-    "@lynx-js/web-worker-rpc": "npm:@lynx-js/web-worker-rpc-canary@0.17.1"
+    "@lynx-js/web-constants": "npm:@lynx-js/web-constants-canary@0.17.2-canary-20250928-a35a2452",
+    "@lynx-js/web-mainthread-apis": "npm:@lynx-js/web-mainthread-apis-canary@0.17.2-canary-20250928-a35a2452",
+    "@lynx-js/web-worker-rpc": "npm:@lynx-js/web-worker-rpc-canary@0.17.2-canary-20250928-a35a2452"
   },
   "devDependencies": {
     "@lynx-js/lynx-core": "0.1.3"