perf(react): scope React DOM prebundles by environment (#532)

React Pages currently pre-includes both React DOM entry points in
browser and Worker dependency optimization. Include `react-dom/client`
in the browser and `react-dom/server` in the Worker, with regression
coverage for those scopes and the existing SSR includes.

An installed-package comparison on a two-page React app reduced
generated prebundle JavaScript by **1,580,422 bytes** (source maps and
metadata excluded):

| Environment | Before | After |
| --- | ---: | ---: |
| Client | 1,660,390 B | 992,097 B |
| Worker | 1,669,081 B | 756,952 B |
| SSR | 2,705,925 B | 2,705,925 B |

The 80-sample benchmark used 20 randomized baseline/branch pairs for
each cold/warm cache state, with fresh dev processes and browser
contexts. Every sample passed hydration, interaction, and
client-navigation checks. Browser transfer was effectively unchanged,
and neither cold nor warm process-to-hydration time showed a
statistically significant improvement (adjusted p = 0.751 and 0.800).
This supports a smaller generated cache; it does not establish a startup
speedup. Timings came from a small React fixture with background host
activity.

Validation:

- Focused React plugin tests: 4 passed.
- `vp run test --base origin/main`: 10,750 passed, 31 skipped.
- `vp run check`: all 33 tasks passed.
- Formatting and lint passed for both changed files.
- `vp test run --pool=forks --maxWorkers=4`: 14,048 passed, 31 skipped.

Author: yangshun

packages/react/src/plugin-pages.ts

@@ -12,15 +12,9 @@ const RENDERER_ID = 'virtual:void-pages-renderer';
 const CLIENT_ENTRY_ID = 'virtual:void-pages-client';
 const WORKER_ENVIRONMENT_NAME = 'void_worker';
 const REACT_DEDUPE = ['react', 'react-dom'];
-const REACT_OPTIMIZE_DEPS = [
-  'react',
-  'react/jsx-runtime',
-  'react/jsx-dev-runtime',
-  'react-dom',
-  'react-dom/client',
-  'react-dom/server',
-];
-const WORKER_OPTIMIZE_DEPS = [...REACT_OPTIMIZE_DEPS, 'void/live/client'];
+const REACT_OPTIMIZE_DEPS = ['react', 'react/jsx-runtime', 'react/jsx-dev-runtime', 'react-dom'];
+const CLIENT_OPTIMIZE_DEPS = [...REACT_OPTIMIZE_DEPS, 'react-dom/client'];
+const WORKER_OPTIMIZE_DEPS = [...REACT_OPTIMIZE_DEPS, 'react-dom/server', 'void/live/client'];
 
 // SSR HTML bypasses transformIndexHtml, so @vitejs/plugin-react cannot inject
 // its Fast Refresh preamble. Without it, the dev client entry fails to load.
@@ -193,11 +187,11 @@ export function pagesPlugin(pagesDir: string, options?: PagesPluginOptions): Plu
             // Pre-include React entries that are discovered late via dynamic
             // imports during SPA navigation, avoiding a full-page reload
             // from Vite's dep optimizer.
-            include: REACT_OPTIMIZE_DEPS,
+            include: CLIENT_OPTIMIZE_DEPS,
           },
           ssr: {
             optimizeDeps: {
-              include: REACT_OPTIMIZE_DEPS,
+              include: [...CLIENT_OPTIMIZE_DEPS, 'react-dom/server'],
             },
           },
           environments: {

packages/react/test/unit/plugin-pages.test.ts

@@ -89,6 +89,29 @@ describe('pagesPlugin dev config', () => {
     });
   });
 
+  it('includes only the React entry points needed by each environment', () => {
+    const config = loadServeConfig() as {
+      optimizeDeps: { include: Array<string> };
+      ssr?: { optimizeDeps?: { include?: Array<string> } };
+      environments: {
+        void_worker: { optimizeDeps: { include: Array<string> } };
+      };
+    };
+
+    expect(config.optimizeDeps.include).toContain('react-dom/client');
+    expect(config.optimizeDeps.include).not.toContain('react-dom/server');
+    expect(config.environments.void_worker.optimizeDeps.include).toContain('react-dom/server');
+    expect(config.environments.void_worker.optimizeDeps.include).not.toContain('react-dom/client');
+    expect(config.ssr?.optimizeDeps?.include).toEqual([
+      'react',
+      'react/jsx-runtime',
+      'react/jsx-dev-runtime',
+      'react-dom',
+      'react-dom/client',
+      'react-dom/server',
+    ]);
+  });
+
   it('rescans dev renderer loads after adding a page file', async () => {
     writePage('index.tsx', 'export default function Index() { return <h1>Home</h1>; }\n');