@lynx-js/web-worker-runtime 0.11.0 → 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,49 @@
1
1
  # @lynx-js/web-worker-runtime
2
2
 
3
+ ## 0.13.0
4
+
5
+ ### Patch Changes
6
+
7
+ - refactor: isolate SystemInfo ([#628](https://github.com/lynx-family/lynx-stack/pull/628))
8
+
9
+ Never assign `SystemInfo` on worker's self object.
10
+
11
+ - feat: support thread strategy `all-on-ui` ([#625](https://github.com/lynx-family/lynx-stack/pull/625))
12
+
13
+ ```html
14
+ <lynx-view thread-strategy="all-on-ui"></lynx-view>
15
+ ```
16
+
17
+ This will make the lynx's main-thread run on the UA's main thread.
18
+
19
+ Note that the `all-on-ui` does not support the HMR & chunk splitting yet.
20
+
21
+ - refactor: move mainthread impl into mainthread-api packages ([#622](https://github.com/lynx-family/lynx-stack/pull/622))
22
+
23
+ - Updated dependencies [[`4ee0465`](https://github.com/lynx-family/lynx-stack/commit/4ee0465f6e5846a0d038b49d2a7c95e87c9e5c77), [`74b5bd1`](https://github.com/lynx-family/lynx-stack/commit/74b5bd15339b70107a7c42525494da46e8f8f6bd), [`06bb78a`](https://github.com/lynx-family/lynx-stack/commit/06bb78a6b93d4a7be7177a6269dd4337852ce90d), [`5a3d9af`](https://github.com/lynx-family/lynx-stack/commit/5a3d9afe52ba639987db124ca35580261e0718b5), [`5269cab`](https://github.com/lynx-family/lynx-stack/commit/5269cabef7609159bdd0dd14a03c5da667907424), [`74b5bd1`](https://github.com/lynx-family/lynx-stack/commit/74b5bd15339b70107a7c42525494da46e8f8f6bd), [`2b069f8`](https://github.com/lynx-family/lynx-stack/commit/2b069f8786c95bdb9ac1f35091f05f7fd3b52225)]:
24
+ - @lynx-js/web-mainthread-apis@0.13.0
25
+ - @lynx-js/web-constants@0.13.0
26
+ - @lynx-js/offscreen-document@0.0.1
27
+ - @lynx-js/web-worker-rpc@0.13.0
28
+
29
+ ## 0.12.0
30
+
31
+ ### Patch Changes
32
+
33
+ - feat: fully support MTS ([#569](https://github.com/lynx-family/lynx-stack/pull/569))
34
+
35
+ Now use support the following usage
36
+
37
+ - mainthread event
38
+ - mainthread ref
39
+ - runOnMainThread/runOnBackground
40
+ - ref.current.xx
41
+
42
+ - Updated dependencies [[`f1ca29b`](https://github.com/lynx-family/lynx-stack/commit/f1ca29bd766377dd46583f15e1e75bca447699cd), [`8ca9fcb`](https://github.com/lynx-family/lynx-stack/commit/8ca9fcbbc86b0f0ac05ee4319876cdd5dd08d668), [`efe6fd7`](https://github.com/lynx-family/lynx-stack/commit/efe6fd7de8a3d8119ea550f4d4e939d1fbfee4f0)]:
43
+ - @lynx-js/web-mainthread-apis@0.12.0
44
+ - @lynx-js/web-constants@0.12.0
45
+ - @lynx-js/web-worker-rpc@0.12.0
46
+
3
47
  ## 0.11.0
4
48
 
5
49
  ### Patch Changes
@@ -1,19 +1,9 @@
1
- import { dispatchCoreContextEventEndpoint, type Cloneable, type LynxContextEventTarget, type NativeApp } from '@lynx-js/web-constants';
1
+ import { LynxCrossThreadContext, type Cloneable, type NativeApp } from '@lynx-js/web-constants';
2
2
  import type { Rpc } from '@lynx-js/web-worker-rpc';
3
3
  export interface CreateLynxConfig {
4
4
  globalProps: unknown;
5
5
  customSections: Record<string, Cloneable>;
6
6
  }
7
- export declare class LynxCrossThreadContext extends EventTarget implements LynxContextEventTarget {
8
- private _config;
9
- constructor(_config: {
10
- mainThreadRpc: Rpc;
11
- dispatchEventEndpoint: typeof dispatchCoreContextEventEndpoint;
12
- });
13
- postMessage(...args: any[]): void;
14
- dispatchEvent(event: Event): number;
15
- __start(): void;
16
- }
17
7
  export declare function createBackgroundLynx(config: CreateLynxConfig, nativeApp: NativeApp, mainThreadRpc: Rpc): {
18
8
  __globalProps: unknown;
19
9
  getJSModule(_moduleName: string): any;
@@ -1,33 +1,13 @@
1
1
  // Copyright 2023 The Lynx Authors. All rights reserved.
2
2
  // Licensed under the Apache License Version 2.0 that can be found in the
3
3
  // LICENSE file in the root directory of this source tree.
4
- import { dispatchCoreContextEventEndpoint, DispatchEventResult, } from '@lynx-js/web-constants';
4
+ import { dispatchCoreContextOnBackgroundEndpoint, dispatchJSContextOnMainThreadEndpoint, LynxCrossThreadContext, } from '@lynx-js/web-constants';
5
5
  import { createGetCustomSection } from './crossThreadHandlers/createGetCustomSection.js';
6
- export class LynxCrossThreadContext extends EventTarget {
7
- _config;
8
- constructor(_config) {
9
- super();
10
- this._config = _config;
11
- }
12
- postMessage(...args) {
13
- console.error('[lynx-web] postMessage not implemented, args:', ...args);
14
- }
15
- // @ts-expect-error
16
- dispatchEvent(event) {
17
- super.dispatchEvent(event);
18
- return DispatchEventResult.CanceledBeforeDispatch;
19
- }
20
- __start() {
21
- const { mainThreadRpc, dispatchEventEndpoint } = this._config;
22
- mainThreadRpc.registerHandler(dispatchEventEndpoint, (eventType, data) => {
23
- this.dispatchEvent(new MessageEvent(eventType, { data: data ?? {} }));
24
- });
25
- }
26
- }
27
6
  export function createBackgroundLynx(config, nativeApp, mainThreadRpc) {
28
7
  const coreContext = new LynxCrossThreadContext({
29
- mainThreadRpc,
30
- dispatchEventEndpoint: dispatchCoreContextEventEndpoint,
8
+ rpc: mainThreadRpc,
9
+ receiveEventEndpoint: dispatchCoreContextOnBackgroundEndpoint,
10
+ sendEventEndpoint: dispatchJSContextOnMainThreadEndpoint,
31
11
  });
32
12
  return {
33
13
  __globalProps: config.globalProps,
@@ -1,5 +1,5 @@
1
1
  import type { Rpc } from '@lynx-js/web-worker-rpc';
2
- import { type LynxTemplate, type NativeApp, type NativeModulesMap } from '@lynx-js/web-constants';
2
+ import { type LynxTemplate, type NativeApp, type NativeModulesMap, type BrowserConfig } from '@lynx-js/web-constants';
3
3
  import type { TimingSystem } from './createTimingSystem.js';
4
4
  export declare function createNativeApp(config: {
5
5
  template: LynxTemplate;
@@ -7,4 +7,5 @@ export declare function createNativeApp(config: {
7
7
  mainThreadRpc: Rpc;
8
8
  nativeModulesMap: NativeModulesMap;
9
9
  timingSystem: TimingSystem;
10
+ browserConfig: BrowserConfig;
10
11
  }): Promise<NativeApp>;
@@ -1,4 +1,4 @@
1
- import { callLepusMethodEndpoint, setNativePropsEndpoint, triggerComponentEventEndpoint, selectComponentEndpoint, } from '@lynx-js/web-constants';
1
+ import { callLepusMethodEndpoint, setNativePropsEndpoint, triggerComponentEventEndpoint, selectComponentEndpoint, systemInfo, } from '@lynx-js/web-constants';
2
2
  import { createInvokeUIMethod } from './crossThreadHandlers/createInvokeUIMethod.js';
3
3
  import { registerPublicComponentEventHandler } from './crossThreadHandlers/registerPublicComponentEventHandler.js';
4
4
  import { registerGlobalExposureEventHandler } from './crossThreadHandlers/registerGlobalExposureEventHandler.js';
@@ -11,12 +11,26 @@ import { createJSObjectDestructionObserver } from './crossThreadHandlers/createJ
11
11
  let nativeAppCount = 0;
12
12
  const sharedData = {};
13
13
  export async function createNativeApp(config) {
14
- const { mainThreadRpc, uiThreadRpc, template, nativeModulesMap, timingSystem, } = config;
14
+ const { mainThreadRpc, uiThreadRpc, template, nativeModulesMap, timingSystem, browserConfig, } = config;
15
15
  const performanceApis = createPerformanceApis(timingSystem);
16
16
  const callLepusMethod = mainThreadRpc.createCallbackify(callLepusMethodEndpoint, 2);
17
17
  const setNativeProps = uiThreadRpc.createCall(setNativePropsEndpoint);
18
18
  const triggerComponentEvent = uiThreadRpc.createCall(triggerComponentEventEndpoint);
19
19
  const selectComponent = uiThreadRpc.createCallbackify(selectComponentEndpoint, 3);
20
+ const createBundleInitReturnObj = () => {
21
+ const entry = globalThis.module.exports;
22
+ return {
23
+ init: (lynxCoreInject) => {
24
+ lynxCoreInject.tt.lynxCoreInject = lynxCoreInject;
25
+ lynxCoreInject.tt.globalThis ??= lynxCoreInject;
26
+ Object.assign(lynxCoreInject.tt, {
27
+ SystemInfo: { ...systemInfo, pixelRatio: browserConfig.pixelRatio },
28
+ });
29
+ const ret = entry?.(lynxCoreInject.tt);
30
+ return ret;
31
+ },
32
+ };
33
+ };
20
34
  const nativeApp = {
21
35
  id: (nativeAppCount++).toString(),
22
36
  ...performanceApis,
@@ -32,15 +46,7 @@ export async function createNativeApp(config) {
32
46
  import(
33
47
  /* webpackIgnore: true */
34
48
  sourceURL).catch(callback).then(async () => {
35
- callback(null, {
36
- init: (lynxCoreInject) => {
37
- lynxCoreInject.tt.lynxCoreInject = lynxCoreInject;
38
- lynxCoreInject.tt.globalThis ??= lynxCoreInject;
39
- const entry = globalThis.module.exports;
40
- const ret = entry?.(lynxCoreInject.tt);
41
- return ret;
42
- },
43
- });
49
+ callback(null, createBundleInitReturnObj());
44
50
  });
45
51
  },
46
52
  loadScript: (sourceURL) => {
@@ -48,14 +54,7 @@ export async function createNativeApp(config) {
48
54
  if (mainfestUrl)
49
55
  sourceURL = mainfestUrl;
50
56
  importScripts(sourceURL);
51
- const entry = globalThis.module.exports;
52
- return {
53
- init: (lynxCoreInject) => {
54
- lynxCoreInject.tt.lynxCoreInject = lynxCoreInject;
55
- lynxCoreInject.tt.globalThis ??= lynxCoreInject;
56
- return entry?.(lynxCoreInject.tt);
57
- },
58
- };
57
+ return createBundleInitReturnObj();
59
58
  },
60
59
  requestAnimationFrame(cb) {
61
60
  return requestAnimationFrame(cb);
package/dist/index.d.ts CHANGED
@@ -2,5 +2,4 @@ export interface WorkerStartMessage {
2
2
  mode: 'main' | 'background';
3
3
  toPeerThread: MessagePort;
4
4
  toUIThread: MessagePort;
5
- pixelRatio: number;
6
5
  }
package/dist/index.js CHANGED
@@ -4,9 +4,8 @@
4
4
  import { startBackgroundThread } from './backgroundThread/index.js';
5
5
  import { startMainThread } from './mainThread/startMainThread.js';
6
6
  self.onmessage = (ev) => {
7
- const { mode, toPeerThread, toUIThread, pixelRatio } = ev
7
+ const { mode, toPeerThread, toUIThread } = ev
8
8
  .data;
9
- globalThis.SystemInfo.pixelRatio = pixelRatio;
10
9
  if (mode === 'main') {
11
10
  startMainThread(toUIThread, toPeerThread);
12
11
  }
@@ -15,7 +14,6 @@ self.onmessage = (ev) => {
15
14
  }
16
15
  };
17
16
  Object.assign(globalThis, {
18
- SystemInfo: { platform: 'web', lynxSdkVersion: '3.0' },
19
17
  module: { exports: null },
20
18
  });
21
19
  //# sourceMappingURL=index.js.map
@@ -1,108 +1,28 @@
1
1
  // Copyright 2023 The Lynx Authors. All rights reserved.
2
2
  // Licensed under the Apache License Version 2.0 that can be found in the
3
3
  // LICENSE file in the root directory of this source tree.
4
- import { BackgroundThreadStartEndpoint, mainThreadStartEndpoint, flushElementTreeEndpoint, reportErrorEndpoint, publishEventEndpoint, publicComponentEventEndpoint, postExposureEndpoint, postOffscreenEventEndpoint, switchExposureServiceEndpoint, postTimingFlagsEndpoint, dispatchCoreContextEventEndpoint, } from '@lynx-js/web-constants';
4
+ import { flushElementTreeEndpoint, mainThreadStartEndpoint, postOffscreenEventEndpoint, reportErrorEndpoint, } from '@lynx-js/web-constants';
5
5
  import { Rpc } from '@lynx-js/web-worker-rpc';
6
- import { MainThreadRuntime, switchExposureService, } from '@lynx-js/web-mainthread-apis';
7
- import { registerCallLepusMethodHandler } from './crossThreadHandlers/registerCallLepusMethodHandler.js';
8
- import { registerGetCustomSectionHandler } from './crossThreadHandlers/registerGetCustomSectionHandler.js';
9
6
  import { createMarkTimingInternal } from './crossThreadHandlers/createMainthreadMarkTimingInternal.js';
10
- import { registerUpdateDataHandler } from './crossThreadHandlers/registerUpdateDataHandler.js';
11
7
  import { OffscreenDocument } from '@lynx-js/offscreen-document/webworker';
12
- import { _onEvent, } from '@lynx-js/offscreen-document/webworker';
8
+ import { _onEvent } from '@lynx-js/offscreen-document/webworker';
9
+ import { registerUpdateDataHandler } from './crossThreadHandlers/registerUpdateDataHandler.js';
10
+ const { loadMainThread } = await import('@lynx-js/web-mainthread-apis');
13
11
  export function startMainThread(uiThreadPort, backgroundThreadPort) {
14
12
  const uiThreadRpc = new Rpc(uiThreadPort, 'main-to-ui');
15
13
  const backgroundThreadRpc = new Rpc(backgroundThreadPort, 'main-to-bg');
16
14
  const markTimingInternal = createMarkTimingInternal(backgroundThreadRpc);
17
- const postTimingFlags = backgroundThreadRpc.createCall(postTimingFlagsEndpoint);
18
- const backgroundStart = backgroundThreadRpc.createCall(BackgroundThreadStartEndpoint);
19
- const dispatchCoreContextEvent = backgroundThreadRpc.createCall(dispatchCoreContextEventEndpoint);
20
- const publishEvent = backgroundThreadRpc.createCall(publishEventEndpoint);
21
- const publicComponentEvent = backgroundThreadRpc.createCall(publicComponentEventEndpoint);
22
- const postExposure = backgroundThreadRpc.createCall(postExposureEndpoint);
23
- let operations = [];
24
- const flushElementTree = uiThreadRpc.createCall(flushElementTreeEndpoint);
15
+ const uiFlush = uiThreadRpc.createCall(flushElementTreeEndpoint);
25
16
  const reportError = uiThreadRpc.createCall(reportErrorEndpoint);
26
- markTimingInternal('lepus_excute_start');
27
- uiThreadRpc.registerHandler(mainThreadStartEndpoint, async (config) => {
28
- let isFp = true;
29
- const { globalProps, template, browserConfig, nativeModulesMap, napiModulesMap, tagMap, } = config;
30
- const { styleInfo, pageConfig, customSections, cardType, lepusCode } = template;
31
- markTimingInternal('decode_start');
32
- await import(
33
- /* webpackIgnore: true */ template.lepusCode.root);
34
- const entry = globalThis.module.exports;
35
- const docu = new OffscreenDocument({
36
- onCommit: (currentOperations) => {
37
- operations = currentOperations;
38
- },
17
+ const docu = new OffscreenDocument({
18
+ onCommit: uiFlush,
19
+ });
20
+ uiThreadRpc.registerHandler(postOffscreenEventEndpoint, docu[_onEvent]);
21
+ const { startMainThread } = loadMainThread(backgroundThreadRpc, docu, docu.commit.bind(docu), markTimingInternal, reportError);
22
+ uiThreadRpc.registerHandler(mainThreadStartEndpoint, (config) => {
23
+ startMainThread(config).then((runtime) => {
24
+ registerUpdateDataHandler(uiThreadRpc, runtime);
39
25
  });
40
- uiThreadRpc.registerHandler(postOffscreenEventEndpoint, docu[_onEvent]);
41
- const runtime = new MainThreadRuntime({
42
- tagMap,
43
- browserConfig,
44
- customSections,
45
- globalProps,
46
- pageConfig,
47
- styleInfo,
48
- lepusCode,
49
- docu,
50
- callbacks: {
51
- mainChunkReady: () => {
52
- markTimingInternal('data_processor_start');
53
- const initData = runtime.processData
54
- ? runtime.processData(config.initData)
55
- : config.initData;
56
- markTimingInternal('data_processor_end');
57
- registerCallLepusMethodHandler(backgroundThreadRpc, runtime);
58
- registerGetCustomSectionHandler(backgroundThreadRpc, customSections);
59
- registerUpdateDataHandler(uiThreadRpc, runtime);
60
- backgroundThreadRpc.registerHandler(switchExposureServiceEndpoint, runtime[switchExposureService]);
61
- backgroundStart({
62
- initData,
63
- globalProps,
64
- template,
65
- cardType: cardType ?? 'react',
66
- customSections: Object.fromEntries(Object.entries(customSections).filter(([, value]) => value.type !== 'lazy').map(([k, v]) => [k, v.content])),
67
- nativeModulesMap,
68
- napiModulesMap,
69
- });
70
- runtime.renderPage(initData);
71
- runtime.__FlushElementTree(undefined, {});
72
- },
73
- flushElementTree: async (options, timingFlags) => {
74
- const pipelineId = options?.pipelineOptions?.pipelineID;
75
- markTimingInternal('dispatch_start', pipelineId);
76
- docu.commit();
77
- if (isFp) {
78
- isFp = false;
79
- dispatchCoreContextEvent('__OnNativeAppReady', undefined);
80
- }
81
- markTimingInternal('layout_start', pipelineId);
82
- markTimingInternal('ui_operation_flush_start', pipelineId);
83
- await flushElementTree(operations);
84
- markTimingInternal('ui_operation_flush_end', pipelineId);
85
- markTimingInternal('layout_end', pipelineId);
86
- markTimingInternal('dispatch_end', pipelineId);
87
- postTimingFlags(timingFlags, pipelineId);
88
- },
89
- _ReportError: reportError,
90
- __OnLifecycleEvent: (data) => {
91
- dispatchCoreContextEvent('__OnLifecycleEvent', data);
92
- },
93
- /**
94
- * Note :
95
- * The parameter of lynx.performance.markTiming is (pipelineId:string, timingFlag:string)=>void
96
- * But our markTimingInternal is (timingFlag:string, pipelineId?:string, timeStamp?:number) => void
97
- */
98
- markTiming: (a, b) => markTimingInternal(b, a),
99
- publishEvent,
100
- publicComponentEvent,
101
- postExposure,
102
- },
103
- }).globalThis;
104
- markTimingInternal('decode_end');
105
- entry(runtime);
106
26
  });
107
27
  }
108
28
  //# sourceMappingURL=startMainThread.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lynx-js/web-worker-runtime",
3
- "version": "0.11.0",
3
+ "version": "0.13.0",
4
4
  "private": false,
5
5
  "description": "",
6
6
  "keywords": [],
@@ -22,10 +22,10 @@
22
22
  "README.md"
23
23
  ],
24
24
  "dependencies": {
25
- "@lynx-js/offscreen-document": "0.0.0",
26
- "@lynx-js/web-constants": "0.11.0",
27
- "@lynx-js/web-mainthread-apis": "0.11.0",
28
- "@lynx-js/web-worker-rpc": "0.11.0"
25
+ "@lynx-js/offscreen-document": "0.0.1",
26
+ "@lynx-js/web-constants": "0.13.0",
27
+ "@lynx-js/web-mainthread-apis": "0.13.0",
28
+ "@lynx-js/web-worker-rpc": "0.13.0"
29
29
  },
30
30
  "devDependencies": {
31
31
  "@lynx-js/lynx-core": "0.1.2"
@@ -1,3 +0,0 @@
1
- import type { MainThreadRuntime } from '@lynx-js/web-mainthread-apis';
2
- import type { Rpc } from '@lynx-js/web-worker-rpc';
3
- export declare function registerCallLepusMethodHandler(rpc: Rpc, runtime: MainThreadRuntime): void;
@@ -1,10 +0,0 @@
1
- // Copyright 2023 The Lynx Authors. All rights reserved.
2
- // Licensed under the Apache License Version 2.0 that can be found in the
3
- // LICENSE file in the root directory of this source tree.
4
- import { callLepusMethodEndpoint } from '@lynx-js/web-constants';
5
- export function registerCallLepusMethodHandler(rpc, runtime) {
6
- rpc.registerHandler(callLepusMethodEndpoint, (methodName, data) => {
7
- (runtime[methodName])(data);
8
- });
9
- }
10
- //# sourceMappingURL=registerCallLepusMethodHandler.js.map
@@ -1,3 +0,0 @@
1
- import type { Rpc } from '@lynx-js/web-worker-rpc';
2
- import { type LynxTemplate } from '@lynx-js/web-constants';
3
- export declare function registerGetCustomSectionHandler(rpc: Rpc, customSections: LynxTemplate['customSections']): void;
@@ -1,7 +0,0 @@
1
- import { getCustomSectionsEndpoint, } from '@lynx-js/web-constants';
2
- export function registerGetCustomSectionHandler(rpc, customSections) {
3
- rpc.registerHandler(getCustomSectionsEndpoint, (key) => {
4
- return customSections[key]?.content;
5
- });
6
- }
7
- //# sourceMappingURL=registerGetCustomSectionHandler.js.map