diff --git a/.changeset/enable-web-binary-template-by-default.md b/.changeset/enable-web-binary-template-by-default.md new file mode 100644 index 0000000000..9d6723229c --- /dev/null +++ b/.changeset/enable-web-binary-template-by-default.md @@ -0,0 +1,20 @@ +--- +"@lynx-js/template-webpack-plugin": patch +--- + +feat(web): enable web binary template by default + +The default encoding format for the web platform template has been changed from JSON to Binary. + +**Benefits for developers:** + +- **Smaller output size:** Binary templates are more compact than JSON strings, reducing the final bundle size. +- **Faster load performance:** Binary templates parse faster than JSON in the runtime, improving the time-to-interactive for web applications. + +**How to turn off this feature:** +If you encounter any issues with the new binary template format, you can revert to the previous JSON format by setting the environment variable `EXPERIMENTAL_USE_WEB_BINARY_TEMPLATE` to `'false'` or `'0'` before running your build commands. For example: +`EXPERIMENTAL_USE_WEB_BINARY_TEMPLATE=false rspeedy build` + +**Upgrade to `@lynx-js/web-core@0.20.2` could support the new output format** + +See [`@lynx-js/web-core` Changelog](https://lynx-stack.dev/changelog/lynx-js--web-core) diff --git a/packages/web-platform/web-core-e2e/scripts/generate-build-command.js b/packages/web-platform/web-core-e2e/scripts/generate-build-command.js index 9bff2b144b..44ed5fd2f0 100644 --- a/packages/web-platform/web-core-e2e/scripts/generate-build-command.js +++ b/packages/web-platform/web-core-e2e/scripts/generate-build-command.js @@ -27,7 +27,6 @@ if (command.length) { shell: true, env: { ...process.env, - 'EXPERIMENTAL_USE_WEB_BINARY_TEMPLATE': 'true', }, }); diff --git a/packages/web-platform/web-tests/package.json b/packages/web-platform/web-tests/package.json index ebc7bd5d4c..3c26166867 100644 --- a/packages/web-platform/web-tests/package.json +++ b/packages/web-platform/web-tests/package.json @@ -12,7 +12,7 @@ "scripts": { "build": "pnpm dlx premove dist && pnpm run --stream \"/^build:.*/\"", "build:csr": "node ./scripts/generate-build-command.js", - "build:ssr": "pnpm dlx cross-env ENABLE_SSR=1 EXPERIMENTAL_USE_WEB_BINARY_TEMPLATE=true node ./scripts/generate-build-command.js", + "build:ssr": "pnpm dlx cross-env ENABLE_SSR=1 node ./scripts/generate-build-command.js", "coverage": "nyc report --cwd=$(realpath ../)", "coverage:ci": "nyc report --cwd=$(realpath ../) --reporter=lcov", "lh": "pnpm dlx @lhci/cli autorun", diff --git a/packages/webpack/template-webpack-plugin/src/WebEncodePlugin.ts b/packages/webpack/template-webpack-plugin/src/WebEncodePlugin.ts index 58eb92bd6b..8462ba967d 100644 --- a/packages/webpack/template-webpack-plugin/src/WebEncodePlugin.ts +++ b/packages/webpack/template-webpack-plugin/src/WebEncodePlugin.ts @@ -107,13 +107,10 @@ export class WebEncodePlugin { } const isExperimentalWebBinary = process .env['EXPERIMENTAL_USE_WEB_BINARY_TEMPLATE']; - if (isExperimentalWebBinary === 'true') { - const { encode } = await import('@lynx-js/web-core/encode'); - return { - buffer: Buffer.from(encode(tasmJSONInfo as TasmJSONInfo)), - debugInfo: '', - }; - } else if (isExperimentalWebBinary == null /*undefined or null */) { + if ( + isExperimentalWebBinary === 'false' + || isExperimentalWebBinary === '0' + ) { return { buffer: Buffer.from( JSON.stringify({ @@ -130,10 +127,11 @@ export class WebEncodePlugin { debugInfo: '', }; } else { - // only allow 'true' or undefined/null - throw new Error( - `Unknown value of EXPERIMENTAL_USE_WEB_BINARY_TEMPLATE: ${isExperimentalWebBinary}. Expecting "true" or undefined.`, - ); + const { encode } = await import('@lynx-js/web-core/encode'); + return { + buffer: Buffer.from(encode(tasmJSONInfo as TasmJSONInfo)), + debugInfo: '', + }; } }); }, diff --git a/packages/webpack/template-webpack-plugin/test/cases/web/default-export/b.js b/packages/webpack/template-webpack-plugin/test/cases/web/default-export/b.js index 82bbed7d90..c71fa20212 100644 --- a/packages/webpack/template-webpack-plugin/test/cases/web/default-export/b.js +++ b/packages/webpack/template-webpack-plugin/test/cases/web/default-export/b.js @@ -7,20 +7,32 @@ it('should have test in custom-section', async () => { const fileContent = (await fs.readFile(path.join(__dirname, '..', 'a', 'template.js'))) .toString(); - expect(fileContent).toContain('test-content-assert-me'); + // convert to utf-16 + const fileContentUtf16 = Buffer.from(fileContent, 'utf-8').toString( + 'utf-16le', + ); + expect(fileContentUtf16).toContain('test-content-assert-me'); }); it('should card type', async () => { const fileContent = (await fs.readFile(path.join(__dirname, '..', 'a', 'template.js'))) .toString(); - expect(fileContent).toContain('react'); + + // convert to utf-16 + const fileContentUtf16 = Buffer.from(fileContent, 'utf-8').toString( + 'utf-16le', + ); + expect(fileContentUtf16).toContain('react'); }); it('should have app type', async () => { const fileContent = (await fs.readFile(path.join(__dirname, '..', 'a', 'template.js'))) .toString(); - const { appType } = JSON.parse(fileContent); - expect(appType).toBeTruthy(); + // convert to utf-16 + const fileContentUtf16 = Buffer.from(fileContent, 'utf-8').toString( + 'utf-16le', + ); + expect(fileContentUtf16).toContain('react'); });