@lynx-js/web-core 0.16.0 → 0.16.1

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @lynx-js/web-core
 
+## 0.16.1
+
+### Patch Changes
+
+- refactor: improve chunk loading ([#1703](https://github.com/lynx-family/lynx-stack/pull/1703))
+
+- 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-worker-runtime@0.16.1
+  - @lynx-js/web-constants@0.16.1
+  - @lynx-js/web-worker-rpc@0.16.1
+
 ## 0.16.0
 
 ### Minor Changes

package/dist/uiThread/createRenderAllOnUI.d.ts

@@ -1,8 +1,7 @@
-import { type StartMainThreadContextConfig, type Cloneable, type SSRDumpInfo } from '@lynx-js/web-constants';
+import { type StartMainThreadContextConfig, type Cloneable, type SSRDumpInfo, type TemplateLoader } from '@lynx-js/web-constants';
 import { Rpc } from '@lynx-js/web-worker-rpc';
-export declare function createRenderAllOnUI(mainToBackgroundRpc: Rpc, shadowRoot: ShadowRoot, markTimingInternal: (timingKey: string, pipelineId?: string, timeStamp?: number) => void, flushMarkTimingInternal: () => void, callbacks: {
-    onError?: (err: Error, release: string, fileName: string) => void;
-}, ssrDumpInfo: SSRDumpInfo | undefined): {
+import type { StartUIThreadCallbacks } from './startUIThread.js';
+export declare function createRenderAllOnUI(mainToBackgroundRpc: Rpc, shadowRoot: ShadowRoot, loadTemplate: TemplateLoader, markTimingInternal: (timingKey: string, pipelineId?: string, timeStamp?: number) => void, flushMarkTimingInternal: () => void, callbacks: StartUIThreadCallbacks, ssrDumpInfo: SSRDumpInfo | undefined): {
     start: (configs: StartMainThreadContextConfig) => Promise<void>;
     updateDataMainThread: (args_0: Cloneable, args_1: Record<string, string>) => Promise<void>;
     updateI18nResourcesMainThread: (data: Cloneable) => void;

package/dist/uiThread/createRenderAllOnUI.js

@@ -36,7 +36,12 @@ function createIFrameRealm(parent) {
             script.fetchPriority = 'high';
             script.defer = true;
             script.async = false;
-            script.onload = () => resolve(iframeWindow?.module?.exports);
+            script.onload = () => {
+                const ret = iframeWindow?.module?.exports;
+                // @ts-expect-error
+                iframeWindow.module = { exports: undefined };
+                resolve(ret);
+            };
             script.onerror = (err) => reject(new Error(`Failed to load script: ${url}`, { cause: err }));
             // @ts-expect-error
             iframeWindow.module = { exports: undefined };
@@ -53,7 +58,10 @@ function createIFrameRealm(parent) {
             // @ts-expect-error
             iframeWindow.module = { exports: undefined };
             iframe.contentDocument.head.appendChild(script);
-            return iframeWindow?.module?.exports;
+            const ret = iframeWindow?.module?.exports;
+            // @ts-expect-error
+            iframeWindow.module = { exports: undefined };
+            return ret;
         }
         else {
             throw new Error(`Failed to load script: ${url}`, { cause: xhr });
@@ -61,7 +69,7 @@ function createIFrameRealm(parent) {
     };
     return { globalWindow: iframeWindow, loadScript, loadScriptSync };
 }
-export function createRenderAllOnUI(mainToBackgroundRpc, shadowRoot, markTimingInternal, flushMarkTimingInternal, callbacks, ssrDumpInfo) {
+export function createRenderAllOnUI(mainToBackgroundRpc, shadowRoot, loadTemplate, markTimingInternal, flushMarkTimingInternal, callbacks, ssrDumpInfo) {
     if (!globalThis.module) {
         Object.assign(globalThis, { module: {} });
     }
@@ -77,7 +85,7 @@ export function createRenderAllOnUI(mainToBackgroundRpc, shadowRoot, markTimingI
     }, triggerI18nResourceFallback, (initI18nResources) => {
         i18nResources.setData(initI18nResources);
         return i18nResources;
-    });
+    }, loadTemplate);
     const pendingUpdateCalls = [];
     const start = async (configs) => {
         if (ssrDumpInfo) {

package/dist/uiThread/createRenderMultiThread.d.ts

@@ -1,7 +1,7 @@
+import { type TemplateLoader } from '@lynx-js/web-constants';
 import type { Rpc } from '@lynx-js/web-worker-rpc';
-export declare function createRenderMultiThread(mainThreadRpc: Rpc, shadowRoot: ShadowRoot, callbacks: {
-    onError?: (err: Error, release: string, fileName: string) => void;
-}): {
+import type { StartUIThreadCallbacks } from './startUIThread.js';
+export declare function createRenderMultiThread(mainThreadRpc: Rpc, shadowRoot: ShadowRoot, loadTemplate: TemplateLoader, callbacks: StartUIThreadCallbacks): {
     start: (args_0: import("@lynx-js/web-constants").StartMainThreadContextConfig) => void;
     updateDataMainThread: (args_0: import("@lynx-js/web-constants").Cloneable, args_1: Record<string, string>) => Promise<void>;
     updateI18nResourcesMainThread: (args_0: import("@lynx-js/web-constants").Cloneable) => void;

package/dist/uiThread/createRenderMultiThread.js

@@ -1,16 +1,17 @@
 // 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 { mainThreadStartEndpoint, updateDataEndpoint, updateI18nResourcesEndpoint, } from '@lynx-js/web-constants';
+import { loadTemplateMultiThread, mainThreadStartEndpoint, updateDataEndpoint, updateI18nResourcesEndpoint, } from '@lynx-js/web-constants';
 import { registerReportErrorHandler } from './crossThreadHandlers/registerReportErrorHandler.js';
 import { registerFlushElementTreeHandler } from './crossThreadHandlers/registerFlushElementTreeHandler.js';
 import { registerDispatchLynxViewEventHandler } from './crossThreadHandlers/registerDispatchLynxViewEventHandler.js';
 import { createExposureMonitorForMultiThread } from './crossThreadHandlers/createExposureMonitor.js';
-export function createRenderMultiThread(mainThreadRpc, shadowRoot, callbacks) {
+export function createRenderMultiThread(mainThreadRpc, shadowRoot, loadTemplate, callbacks) {
     registerReportErrorHandler(mainThreadRpc, 'lepus.js', callbacks.onError);
     registerFlushElementTreeHandler(mainThreadRpc, { shadowRoot });
     registerDispatchLynxViewEventHandler(mainThreadRpc, shadowRoot);
     createExposureMonitorForMultiThread(mainThreadRpc, shadowRoot);
+    mainThreadRpc.registerHandler(loadTemplateMultiThread, loadTemplate);
     const start = mainThreadRpc.createCall(mainThreadStartEndpoint);
     const updateDataMainThread = mainThreadRpc.createCall(updateDataEndpoint);
     const updateI18nResourcesMainThread = mainThreadRpc.createCall(updateI18nResourcesEndpoint);

package/dist/uiThread/startUIThread.d.ts

@@ -1,9 +1,9 @@
 import type { LynxView } from '../apis/createLynxView.js';
-import { type LynxTemplate, type StartMainThreadContextConfig, type NapiModulesCall, type NativeModulesCall, type SSRDumpInfo } from '@lynx-js/web-constants';
+import { type StartMainThreadContextConfig, type NapiModulesCall, type NativeModulesCall, type SSRDumpInfo, type TemplateLoader } from '@lynx-js/web-constants';
 export type StartUIThreadCallbacks = {
     nativeModulesCall: NativeModulesCall;
     napiModulesCall: NapiModulesCall;
     onError?: (err: Error, release: string, fileName: string) => void;
-    customTemplateLoader?: (url: string) => Promise<LynxTemplate>;
+    customTemplateLoader?: TemplateLoader;
 };
 export declare function startUIThread(templateUrl: string, configs: Omit<StartMainThreadContextConfig, 'template'>, shadowRoot: ShadowRoot, lynxGroupId: number | undefined, threadStrategy: 'all-on-ui' | 'multi-thread', callbacks: StartUIThreadCallbacks, ssr?: SSRDumpInfo): LynxView;

package/dist/uiThread/startUIThread.js

@@ -4,7 +4,7 @@
 import { bootWorkers } from './bootWorkers.js';
 import { createDispose } from './crossThreadHandlers/createDispose.js';
 import { updateGlobalPropsEndpoint, dispatchMarkTiming, flushMarkTiming, } from '@lynx-js/web-constants';
-import { loadTemplate } from '../utils/loadTemplate.js';
+import { createTemplateLoader } from '../utils/loadTemplate.js';
 import { createUpdateData } from './crossThreadHandlers/createUpdateData.js';
 import { startBackground } from './startBackground.js';
 import { createRenderMultiThread } from './createRenderMultiThread.js';
@@ -28,15 +28,14 @@ export function startUIThread(templateUrl, configs, shadowRoot, lynxGroupId, thr
         });
     };
     const flushMarkTimingInternal = () => flushMarkTiming(markTiming, cacheMarkTimings);
+    const templateLoader = createTemplateLoader(callbacks.customTemplateLoader, markTimingInternal);
     const { start, updateDataMainThread, updateI18nResourcesMainThread } = allOnUI
         ? createRenderAllOnUI(
-        /* main-to-bg rpc*/ mainThreadRpc, shadowRoot, markTimingInternal, flushMarkTimingInternal, callbacks, ssr)
+        /* main-to-bg rpc*/ mainThreadRpc, shadowRoot, templateLoader, markTimingInternal, flushMarkTimingInternal, callbacks, ssr)
         : createRenderMultiThread(
-        /* main-to-ui rpc*/ mainThreadRpc, shadowRoot, callbacks);
+        /* main-to-ui rpc*/ mainThreadRpc, shadowRoot, templateLoader, callbacks);
     markTimingInternal('create_lynx_start', undefined, createLynxStartTiming);
-    markTimingInternal('load_template_start');
-    loadTemplate(templateUrl, callbacks.customTemplateLoader).then((template) => {
-        markTimingInternal('load_template_end');
+    templateLoader(templateUrl).then((template) => {
         flushMarkTimingInternal();
         start({
             ...configs,

package/dist/utils/loadTemplate.d.ts

@@ -1,2 +1,2 @@
-import { type LynxTemplate } from '@lynx-js/web-constants';
-export declare function loadTemplate(url: string, customTemplateLoader?: (url: string) => Promise<LynxTemplate>): Promise<LynxTemplate>;
+import { type MarkTimingInternal, type TemplateLoader } from '@lynx-js/web-constants';
+export declare function createTemplateLoader(customTemplateLoader: TemplateLoader | undefined, markTimingInternal: MarkTimingInternal): TemplateLoader;

package/dist/utils/loadTemplate.js

@@ -1,23 +1,30 @@
-import { generateTemplate } from '@lynx-js/web-constants';
+import { generateTemplate, } from '@lynx-js/web-constants';
 const templateCache = {};
 function createJsModuleUrl(content) {
     return URL.createObjectURL(new Blob([content], { type: 'text/javascript' }));
 }
-export async function loadTemplate(url, customTemplateLoader) {
-    const cachedTemplate = templateCache[url];
-    if (cachedTemplate)
-        return cachedTemplate;
-    const template = customTemplateLoader
-        ? await customTemplateLoader(url)
-        : (await (await fetch(url, {
-            method: 'GET',
-        })).json());
-    const decodedTemplate = await generateTemplate(template, createJsModuleUrl);
-    templateCache[url] = decodedTemplate;
-    /**
-     * This will cause a memory leak, which is expected.
-     * We cannot ensure that the `URL.createObjectURL` created url will never be used, therefore here we keep it for the entire lifetime of this page.
-     */
-    return decodedTemplate;
+export function createTemplateLoader(customTemplateLoader, markTimingInternal) {
+    const loadTemplate = async (url) => {
+        markTimingInternal('load_template_start');
+        const cachedTemplate = templateCache[url];
+        if (cachedTemplate) {
+            markTimingInternal('load_template_end');
+            return cachedTemplate;
+        }
+        const template = customTemplateLoader
+            ? await customTemplateLoader(url)
+            : (await (await fetch(url, {
+                method: 'GET',
+            })).json());
+        const decodedTemplate = await generateTemplate(template, createJsModuleUrl);
+        templateCache[url] = decodedTemplate;
+        /**
+         * This will cause a memory leak, which is expected.
+         * We cannot ensure that the `URL.createObjectURL` created url will never be used, therefore here we keep it for the entire lifetime of this page.
+         */
+        markTimingInternal('load_template_end');
+        return decodedTemplate;
+    };
+    return loadTemplate;
 }
 //# sourceMappingURL=loadTemplate.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lynx-js/web-core",
-  "version": "0.16.0",
+  "version": "0.16.1",
   "private": false,
   "description": "",
   "keywords": [],
@@ -25,14 +25,14 @@
   ],
   "dependencies": {
     "@lynx-js/offscreen-document": "0.1.4",
-    "@lynx-js/web-constants": "0.16.0",
-    "@lynx-js/web-mainthread-apis": "0.16.0",
-    "@lynx-js/web-worker-rpc": "0.16.0",
-    "@lynx-js/web-worker-runtime": "0.16.0"
+    "@lynx-js/web-constants": "0.16.1",
+    "@lynx-js/web-mainthread-apis": "0.16.1",
+    "@lynx-js/web-worker-rpc": "0.16.1",
+    "@lynx-js/web-worker-runtime": "0.16.1"
   },
   "devDependencies": {
     "@lynx-js/lynx-core": "0.1.3",
-    "@lynx-js/web-elements": "0.8.4"
+    "@lynx-js/web-elements": "0.8.6"
   },
   "peerDependencies": {
     "@lynx-js/lynx-core": "0.1.3",