@lynx-js/web-core-canary 0.16.1 → 0.17.0-canary-20250918-b17b7cb2
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 +64 -26
- package/dist/uiThread/createRenderAllOnUI.js +18 -15
- package/dist/utils/loadTemplate.js +26 -15
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,43 @@
|
|
|
1
1
|
# @lynx-js/web-core
|
|
2
2
|
|
|
3
|
+
## 0.17.0-canary-20250918080343-b17b7cb2bb92d1539e76276f136806eefa788258
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- break(web): temporary remove support for chunk split ([#1739](https://github.com/lynx-family/lynx-stack/pull/1739))
|
|
8
|
+
|
|
9
|
+
Since the global variables cannot be accessed in the splited chunk, we temporary remove supporting for chunk spliting
|
|
10
|
+
|
|
11
|
+
Developers could easily remove the chunk Split settings in Rspeedy for migration
|
|
12
|
+
|
|
13
|
+
```
|
|
14
|
+
import { defineConfig } from '@lynx-js/rspeedy'
|
|
15
|
+
|
|
16
|
+
export default defineConfig({
|
|
17
|
+
performance: {
|
|
18
|
+
chunkSplit: {
|
|
19
|
+
strategy: 'all-in-one',
|
|
20
|
+
},
|
|
21
|
+
},
|
|
22
|
+
})
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
### Patch Changes
|
|
26
|
+
|
|
27
|
+
- fix: avoid duplicate style transformation ([#1748](https://github.com/lynx-family/lynx-stack/pull/1748))
|
|
28
|
+
|
|
29
|
+
After this commit, we use DAG methods to handle the styleInfos
|
|
30
|
+
|
|
31
|
+
- fix: add sandbox attribute to iframe for enhanced security ([#1709](https://github.com/lynx-family/lynx-stack/pull/1709))
|
|
32
|
+
|
|
33
|
+
- fix: the default template loader won't fetch twice for one url ([#1709](https://github.com/lynx-family/lynx-stack/pull/1709))
|
|
34
|
+
|
|
35
|
+
- Updated dependencies [[`721635d`](https://github.com/lynx-family/lynx-stack/commit/721635de6c1d2d617c7cbaa86e7d816c42d62930), [`93d707b`](https://github.com/lynx-family/lynx-stack/commit/93d707b82a59f7256952e21da6dcad2999f8233d)]:
|
|
36
|
+
- @lynx-js/web-mainthread-apis@0.17.0-canary-20250918080343-b17b7cb2bb92d1539e76276f136806eefa788258
|
|
37
|
+
- @lynx-js/web-constants@0.17.0-canary-20250918080343-b17b7cb2bb92d1539e76276f136806eefa788258
|
|
38
|
+
- @lynx-js/web-worker-runtime@0.17.0-canary-20250918080343-b17b7cb2bb92d1539e76276f136806eefa788258
|
|
39
|
+
- @lynx-js/web-worker-rpc@0.17.0-canary-20250918080343-b17b7cb2bb92d1539e76276f136806eefa788258
|
|
40
|
+
|
|
3
41
|
## 0.16.1
|
|
4
42
|
|
|
5
43
|
### Patch Changes
|
|
@@ -261,25 +299,25 @@
|
|
|
261
299
|
lynxView.initI18nResources = [
|
|
262
300
|
{
|
|
263
301
|
options: {
|
|
264
|
-
locale:
|
|
265
|
-
channel:
|
|
266
|
-
fallback_url:
|
|
302
|
+
locale: "en",
|
|
303
|
+
channel: "1",
|
|
304
|
+
fallback_url: "",
|
|
267
305
|
},
|
|
268
306
|
resource: {
|
|
269
|
-
hello:
|
|
270
|
-
lynx:
|
|
307
|
+
hello: "hello",
|
|
308
|
+
lynx: "lynx web platform1",
|
|
271
309
|
},
|
|
272
310
|
},
|
|
273
311
|
];
|
|
274
|
-
lynxView.addEventListener(
|
|
312
|
+
lynxView.addEventListener("i18nResourceMissed", (e) => {
|
|
275
313
|
console.log(e);
|
|
276
314
|
});
|
|
277
315
|
|
|
278
316
|
// mts
|
|
279
317
|
_I18nResourceTranslation({
|
|
280
|
-
locale:
|
|
281
|
-
channel:
|
|
282
|
-
fallback_url:
|
|
318
|
+
locale: "en",
|
|
319
|
+
channel: "1",
|
|
320
|
+
fallback_url: "",
|
|
283
321
|
});
|
|
284
322
|
```
|
|
285
323
|
|
|
@@ -687,8 +725,8 @@
|
|
|
687
725
|
}
|
|
688
726
|
};`,
|
|
689
727
|
],
|
|
690
|
-
{ type:
|
|
691
|
-
)
|
|
728
|
+
{ type: "text/javascript" }
|
|
729
|
+
)
|
|
692
730
|
),
|
|
693
731
|
};
|
|
694
732
|
lynxView.nativeModulesMap = nativeModulesMap;
|
|
@@ -803,8 +841,8 @@
|
|
|
803
841
|
};
|
|
804
842
|
};`,
|
|
805
843
|
],
|
|
806
|
-
{ type:
|
|
807
|
-
)
|
|
844
|
+
{ type: "text/javascript" }
|
|
845
|
+
)
|
|
808
846
|
);
|
|
809
847
|
|
|
810
848
|
const color_methods = URL.createObjectURL(
|
|
@@ -819,8 +857,8 @@
|
|
|
819
857
|
};
|
|
820
858
|
};`,
|
|
821
859
|
],
|
|
822
|
-
{ type:
|
|
823
|
-
)
|
|
860
|
+
{ type: "text/javascript" }
|
|
861
|
+
)
|
|
824
862
|
);
|
|
825
863
|
|
|
826
864
|
lynxView.napiModuleMap = {
|
|
@@ -837,7 +875,7 @@
|
|
|
837
875
|
|
|
838
876
|
```js
|
|
839
877
|
lynxView.onNapiModulesCall = (name, data, moduleName) => {
|
|
840
|
-
if (name ===
|
|
878
|
+
if (name === "getColor" && moduleName === "color_methods") {
|
|
841
879
|
return data.color;
|
|
842
880
|
}
|
|
843
881
|
};
|
|
@@ -916,8 +954,8 @@
|
|
|
916
954
|
}
|
|
917
955
|
};`,
|
|
918
956
|
],
|
|
919
|
-
{ type:
|
|
920
|
-
)
|
|
957
|
+
{ type: "text/javascript" }
|
|
958
|
+
)
|
|
921
959
|
);
|
|
922
960
|
```
|
|
923
961
|
|
|
@@ -929,7 +967,7 @@
|
|
|
929
967
|
|
|
930
968
|
```js
|
|
931
969
|
lynxView.onNativeModulesCall = (name, data, callback) => {
|
|
932
|
-
if (name ===
|
|
970
|
+
if (name === "getColor") {
|
|
933
971
|
callback(data.color);
|
|
934
972
|
}
|
|
935
973
|
};
|
|
@@ -939,7 +977,7 @@
|
|
|
939
977
|
|
|
940
978
|
```js
|
|
941
979
|
lynxView.onNativeModulesCall = (name, data, moduleName) => {
|
|
942
|
-
if (name ===
|
|
980
|
+
if (name === "getColor" && moduleName === "bridge") {
|
|
943
981
|
return data.color;
|
|
944
982
|
}
|
|
945
983
|
};
|
|
@@ -1297,7 +1335,7 @@
|
|
|
1297
1335
|
This flag changes the behaviour of cascading. It provide a way to do this
|
|
1298
1336
|
|
|
1299
1337
|
```jsx
|
|
1300
|
-
<view class=
|
|
1338
|
+
<view class="class-a class-b" />
|
|
1301
1339
|
```
|
|
1302
1340
|
|
|
1303
1341
|
The class-b will override (cascading) styles of class-a.
|
|
@@ -1397,11 +1435,11 @@
|
|
|
1397
1435
|
There is also a simple way to use this feature
|
|
1398
1436
|
|
|
1399
1437
|
```javascript
|
|
1400
|
-
import { LynxCard } from
|
|
1401
|
-
import { loadElement } from
|
|
1402
|
-
import
|
|
1403
|
-
import
|
|
1404
|
-
import
|
|
1438
|
+
import { LynxCard } from "@lynx-js/web-core";
|
|
1439
|
+
import { loadElement } from "@lynx-js/web-elements/lazy";
|
|
1440
|
+
import "@lynx-js/web-elements/index.css";
|
|
1441
|
+
import "@lynx-js/web-core/index.css";
|
|
1442
|
+
import "./index.css";
|
|
1405
1443
|
|
|
1406
1444
|
const lynxcard = new LynxCard({
|
|
1407
1445
|
...beforeConfigs,
|
|
@@ -18,24 +18,27 @@ const { prepareMainThreadAPIs, } = await import(
|
|
|
18
18
|
*/
|
|
19
19
|
function createIFrameRealm(parent) {
|
|
20
20
|
const iframe = document.createElement('iframe');
|
|
21
|
-
const iframeLoaded = new Promise((resolve) => {
|
|
22
|
-
iframe.onload = () => resolve();
|
|
23
|
-
});
|
|
24
21
|
iframe.style.display = 'none';
|
|
25
|
-
iframe.
|
|
22
|
+
iframe.srcdoc =
|
|
23
|
+
'<!DOCTYPE html><html><head></head><body style="display:none"></body></html>';
|
|
24
|
+
iframe.sandbox = 'allow-same-origin allow-scripts'; // Restrict capabilities for security
|
|
25
|
+
iframe.loading = 'eager';
|
|
26
26
|
parent.appendChild(iframe);
|
|
27
27
|
const iframeWindow = iframe.contentWindow;
|
|
28
|
-
const
|
|
29
|
-
|
|
28
|
+
const loadScript = async (url) => {
|
|
29
|
+
const script = iframe.contentDocument.createElement('script');
|
|
30
|
+
script.fetchPriority = 'high';
|
|
31
|
+
script.defer = true;
|
|
32
|
+
script.async = false;
|
|
33
|
+
if (!iframe.contentDocument.head) {
|
|
34
|
+
await new Promise((resolve) => {
|
|
35
|
+
iframe.onload = () => resolve();
|
|
36
|
+
// In case iframe is already loaded, wait a macro task
|
|
37
|
+
setTimeout(() => resolve(), 0);
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
iframe.contentDocument.head.appendChild(script);
|
|
30
41
|
return new Promise(async (resolve, reject) => {
|
|
31
|
-
if (iframeDocument.readyState !== 'complete') {
|
|
32
|
-
await iframeLoaded;
|
|
33
|
-
}
|
|
34
|
-
const script = iframeDocument.createElement('script');
|
|
35
|
-
script.src = url;
|
|
36
|
-
script.fetchPriority = 'high';
|
|
37
|
-
script.defer = true;
|
|
38
|
-
script.async = false;
|
|
39
42
|
script.onload = () => {
|
|
40
43
|
const ret = iframeWindow?.module?.exports;
|
|
41
44
|
// @ts-expect-error
|
|
@@ -45,7 +48,7 @@ function createIFrameRealm(parent) {
|
|
|
45
48
|
script.onerror = (err) => reject(new Error(`Failed to load script: ${url}`, { cause: err }));
|
|
46
49
|
// @ts-expect-error
|
|
47
50
|
iframeWindow.module = { exports: undefined };
|
|
48
|
-
|
|
51
|
+
script.src = url;
|
|
49
52
|
});
|
|
50
53
|
};
|
|
51
54
|
const loadScriptSync = (url) => {
|
|
@@ -1,29 +1,40 @@
|
|
|
1
1
|
import { generateTemplate, } from '@lynx-js/web-constants';
|
|
2
|
-
const templateCache =
|
|
2
|
+
const templateCache = new Map();
|
|
3
3
|
function createJsModuleUrl(content) {
|
|
4
4
|
return URL.createObjectURL(new Blob([content], { type: 'text/javascript' }));
|
|
5
5
|
}
|
|
6
6
|
export function createTemplateLoader(customTemplateLoader, markTimingInternal) {
|
|
7
7
|
const loadTemplate = async (url) => {
|
|
8
8
|
markTimingInternal('load_template_start');
|
|
9
|
-
const cachedTemplate = templateCache
|
|
9
|
+
const cachedTemplate = templateCache.get(url);
|
|
10
10
|
if (cachedTemplate) {
|
|
11
11
|
markTimingInternal('load_template_end');
|
|
12
12
|
return cachedTemplate;
|
|
13
13
|
}
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
14
|
+
else {
|
|
15
|
+
const promise = new Promise(async (resolve, reject) => {
|
|
16
|
+
try {
|
|
17
|
+
const template = customTemplateLoader
|
|
18
|
+
? await customTemplateLoader(url)
|
|
19
|
+
: (await (await fetch(url, {
|
|
20
|
+
method: 'GET',
|
|
21
|
+
})).json());
|
|
22
|
+
const decodedTemplate = await generateTemplate(template, createJsModuleUrl);
|
|
23
|
+
resolve(decodedTemplate);
|
|
24
|
+
}
|
|
25
|
+
catch (e) {
|
|
26
|
+
templateCache.delete(url);
|
|
27
|
+
reject(e);
|
|
28
|
+
}
|
|
29
|
+
});
|
|
30
|
+
templateCache.set(url, promise);
|
|
31
|
+
/**
|
|
32
|
+
* This will cause a memory leak, which is expected.
|
|
33
|
+
* 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.
|
|
34
|
+
*/
|
|
35
|
+
markTimingInternal('load_template_end');
|
|
36
|
+
return promise;
|
|
37
|
+
}
|
|
27
38
|
};
|
|
28
39
|
return loadTemplate;
|
|
29
40
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lynx-js/web-core-canary",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.17.0-canary-20250918-b17b7cb2",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "",
|
|
6
6
|
"keywords": [],
|
|
@@ -25,10 +25,10 @@
|
|
|
25
25
|
],
|
|
26
26
|
"dependencies": {
|
|
27
27
|
"@lynx-js/offscreen-document": "npm:@lynx-js/offscreen-document-canary@0.1.4",
|
|
28
|
-
"@lynx-js/web-constants": "npm:@lynx-js/web-constants-canary@0.
|
|
29
|
-
"@lynx-js/web-mainthread-apis": "npm:@lynx-js/web-mainthread-apis-canary@0.
|
|
30
|
-
"@lynx-js/web-worker-rpc": "npm:@lynx-js/web-worker-rpc-canary@0.
|
|
31
|
-
"@lynx-js/web-worker-runtime": "npm:@lynx-js/web-worker-runtime-canary@0.
|
|
28
|
+
"@lynx-js/web-constants": "npm:@lynx-js/web-constants-canary@0.17.0-canary-20250918-b17b7cb2",
|
|
29
|
+
"@lynx-js/web-mainthread-apis": "npm:@lynx-js/web-mainthread-apis-canary@0.17.0-canary-20250918-b17b7cb2",
|
|
30
|
+
"@lynx-js/web-worker-rpc": "npm:@lynx-js/web-worker-rpc-canary@0.17.0-canary-20250918-b17b7cb2",
|
|
31
|
+
"@lynx-js/web-worker-runtime": "npm:@lynx-js/web-worker-runtime-canary@0.17.0-canary-20250918-b17b7cb2"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
|
34
34
|
"@lynx-js/lynx-core": "0.1.3",
|