feat: refactor SSR

.changeset/lemon-pigs-teach.md

@@ -0,0 +1,5 @@
+---
+"@lynx-js/web-core-wasm": patch
+---
+
+Refactor web element templates and server-side rendering logic

.changeset/nine-gifts-cheat.md

@@ -0,0 +1,5 @@
+---
+"@lynx-js/web-elements": patch
+---
+
+fix: firefox 147+ layout issue

.github/workflows/rust.yml

@@ -48,7 +48,7 @@ jobs:
         env:
           CARGO_LLVM_COV_FLAGS_NO_RUNNER: --no-sparse
         run: |
-          cargo llvm-cov nextest --all-features --profile ci --config-file .cargo/nextest.toml --lcov --output-path lcov.info  --release
+          cargo llvm-cov nextest --all-targets --all-features --profile ci --config-file .cargo/nextest.toml --lcov --output-path lcov.info  --release
       - name: Upload coverage reports to Codecov
         uses: codecov/codecov-action@671740ac38dd9b0130fbe1cec585b89eea48d3de # v5
         with:

.github/workflows/test.yml

@@ -96,7 +96,7 @@ jobs:
       run: |
         export NODE_OPTIONS="--max-old-space-size=32768"
         export PLAYWRIGHT_JUNIT_OUTPUT_NAME=test-report.junit.xml
-        pnpm --filter @lynx-js/web-elements run test --reporter='github,dot,junit,html' --shard=${{ matrix.shard }}/4
+        pnpm --filter @lynx-js/web-elements run test --reporter='github,dot,junit,html' --shard=${{ matrix.shard }}/2
         pnpm --filter @lynx-js/web-elements run coverage:ci
   playwright-linux:
     needs: build
@@ -127,7 +127,7 @@ jobs:
         fi
         export NODE_OPTIONS="--max-old-space-size=32768"
         export PLAYWRIGHT_JUNIT_OUTPUT_NAME=test-report.junit.xml
-        pnpm --filter @lynx-js/web-tests run test --reporter='github,dot,junit,html' --shard=${{ matrix.shard }}/4
+        pnpm --filter @lynx-js/web-tests run test --reporter='github,dot,junit,html' --shard=${{ matrix.shard }}/3
         pnpm --filter @lynx-js/web-tests run coverage:ci
   web-core-wasm-e2e:
     needs: build
@@ -152,7 +152,7 @@ jobs:
         fi
         export NODE_OPTIONS="--max-old-space-size=32768"
         export PLAYWRIGHT_JUNIT_OUTPUT_NAME=test-report.junit.xml
-        pnpm --filter @lynx-js/web-core-wasm-e2e run test --reporter='github,dot,junit,html' --shard=${{ matrix.shard }}/4
+        pnpm --filter @lynx-js/web-core-wasm-e2e run test --reporter='github,dot,junit,html' --shard=${{ matrix.shard }}/2
   test-api:
     needs: build
     uses: ./.github/workflows/workflow-test.yml

AGENTS.md

@@ -174,7 +174,7 @@ The CI runs these checks (replicate locally for confidence):
 5. **TypeScript compilation**: Part of `pnpm turbo build`
 6. **Unit tests**: `pnpm test` (vitest-based, requires build)
 7. **E2E tests**: Web platform tests with Playwright
-8. **Rust tests**: `cargo test --all-features` in Rust packages
+8. **Rust tests**: `cargo test --all-targets --all-features` in Rust packages
 9. **Type checking**: `pnpm -r run test:type`
 
 ### GitHub Workflows

Cargo.toml

@@ -7,6 +7,7 @@ members = [
   "packages/react/transform/swc-plugin-reactlynx",
   "packages/react/transform/swc-plugin-reactlynx-compat",
   "packages/web-platform/web-core-wasm",
+  "packages/web-platform/web-elements",
   "packages/web-platform/web-mainthread-apis",
 ]
 

packages/web-platform/playwright-fixtures/src/coverage-fixture.ts

@@ -24,6 +24,9 @@ export const test: typeof base = base.extend({
     const pages = new Set<Page>();
 
     context.on('page', async (page) => {
+      if (testInfo.titlePath.join(' ').includes('SSR No JS')) {
+        return;
+      }
       await page.coverage.startJSCoverage({
         reportAnonymousScripts: true,
         resetOnNavigation: true,

packages/web-platform/playwright-fixtures/src/playwright.common.ts

@@ -42,7 +42,7 @@ const workerLimit = Math.floor(((cpuCount, envCPULimit) => {
 export const playwrightConfigCommon: Parameters<typeof defineConfig>[0] = {
   /** global timeout https://playwright.dev/docs/test-timeouts#global-timeout */
   globalTimeout: 20 * 60 * 1000,
-  // testMatch,
+  testMatch: '**/tests/*',
   /* Run tests in files in parallel */
   fullyParallel: true,
   workers: isCI ? workerLimit : undefined,

packages/web-platform/web-core-wasm-e2e/bench/server.bench.vitest.spec.ts

@@ -0,0 +1,53 @@
+import { bench, describe } from 'vitest';
+import * as path from 'path';
+import * as fs from 'fs';
+import { executeTemplate } from '@lynx-js/web-core-wasm/server';
+import { fileURLToPath } from 'url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+async function loadTemplate(name: string) {
+  const bundlePath = path.resolve(__dirname, `../dist/${name}.web.bundle`);
+  return fs.readFileSync(bundlePath);
+}
+
+const cases = {
+  'basic-performance-div-10000': await loadTemplate(
+    'basic-performance-div-10000',
+  ),
+  'basic-performance-div-1000': await loadTemplate(
+    'basic-performance-div-1000',
+  ),
+  'basic-performance-div-100': await loadTemplate('basic-performance-div-100'),
+  'basic-performance-nest-level-100': await loadTemplate(
+    'basic-performance-nest-level-100',
+  ),
+  'basic-performance-image-100': await loadTemplate(
+    'basic-performance-image-100',
+  ),
+  'basic-performance-scroll-view-100': await loadTemplate(
+    'basic-performance-scroll-view-100',
+  ),
+  'basic-performance-text-200': await loadTemplate(
+    'basic-performance-text-200',
+  ),
+  'basic-performance-large-css': await loadTemplate(
+    'basic-performance-large-css',
+  ),
+  'basic-performance-small-css': await loadTemplate(
+    'basic-performance-small-css',
+  ),
+};
+
+describe('server-bench', () => {
+  for (const [testName, rawTemplate] of Object.entries(cases)) {
+    bench(testName, async () => {
+      await executeTemplate(
+        rawTemplate,
+        {}, // initData
+        {}, // globalProps
+        {}, // initI18nResources
+      );
+    });
+  }
+});

packages/web-platform/web-core-wasm-e2e/package.json

@@ -5,6 +5,7 @@
   "license": "Apache-2.0",
   "type": "module",
   "scripts": {
+    "bench": "vitest bench",
     "build": "pnpm dlx premove dist && pnpm run --stream \"/^build:.*/\"",
     "build:csr": "node ./scripts/generate-build-command.js",
     "coverage": "nyc report --cwd=$(realpath ../)",
@@ -23,6 +24,8 @@
     "@lynx-js/web-core-wasm": "workspace:*",
     "@playwright/test": "^1.58.2",
     "@rsbuild/core": "catalog:rsbuild",
-    "nyc": "^17.1.0"
+    "nyc": "^17.1.0",
+    "prettier": "^3.8.1",
+    "vitest": "^3.2.4"
   }
 }

packages/web-platform/web-core-wasm-e2e/rsbuild.config.ts

@@ -1,5 +1,6 @@
 import { defineConfig } from '@rsbuild/core';
 import { fileURLToPath } from 'node:url';
+import { ssrMiddleware } from './shell-project/devMiddleware.js';
 
 const __filename = fileURLToPath(import.meta.url);
 const port = process.env.PORT ?? 3080;
@@ -20,6 +21,12 @@ export default defineConfig({
     hmr: false,
     liveReload: false,
     writeToDisk: true,
+    setupMiddlewares: [
+      (middlewares: any) => {
+        middlewares.unshift(ssrMiddleware);
+        return middlewares;
+      },
+    ],
   },
   server: {
     port: Number(port),