tighten up the code

package-lock.json

···
         "react": "19.2.3",
         "react-dom": "19.2.3",
         "react-server-dom-webpack": "19.2.3",
-        "text-encoding": "^0.7.0",
         "web-streams-polyfill": "^4.2.0"
       },
       "devDependencies": {
···
         "@types/node": "^25.0.2",
         "@types/react": "^19.2.7",
         "@types/react-dom": "^19.2.3",
-        "@types/text-encoding": "^0.0.40",
         "@vitejs/plugin-react": "^5.1.2",
         "@vitest/browser": "^4.0.15",
         "@vitest/browser-playwright": "^4.0.15",
···
       "peerDependencies": {
         "@types/react": "^19.2.0"
       }
-    },
-    "node_modules/@types/text-encoding": {
-      "version": "0.0.40",
-      "resolved": "https://registry.npmjs.org/@types/text-encoding/-/text-encoding-0.0.40.tgz",
-      "integrity": "sha512-dHzoIdwBfY7jcSTTt6XBkaeiuFQAQD7r/7aJySKDdHkYBCDOvs9jPVt4NYXuwBMn89PP6gSd29WubIS19wTiXg==",
-      "dev": true,
-      "license": "MIT"
     },
     "node_modules/@typescript-eslint/eslint-plugin": {
       "version": "8.50.0",
···
           "optional": true
         }
       }
-    },
-    "node_modules/text-encoding": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.7.0.tgz",
-      "integrity": "sha512-oJQ3f1hrOnbRLOcwKz0Liq2IcrvDeZRHXhd9RgLrsT+DjWY/nty1Hi7v3dtkaEYbPYe0mUoOfzRrMwfXXwgPUA==",
-      "deprecated": "no longer maintained",
-      "license": "(Unlicense OR Apache-2.0)"
     },
     "node_modules/through": {
       "version": "2.3.8",

package.json

···
     "react": "19.2.3",
     "react-dom": "19.2.3",
     "react-server-dom-webpack": "19.2.3",
-    "text-encoding": "^0.7.0",
     "web-streams-polyfill": "^4.2.0"
   },
   "overrides": {
···
     "@types/node": "^25.0.2",
     "@types/react": "^19.2.7",
     "@types/react-dom": "^19.2.3",
-    "@types/text-encoding": "^0.0.40",
     "@vitejs/plugin-react": "^5.1.2",
     "@vitest/browser": "^4.0.15",
     "@vitest/browser-playwright": "^4.0.15",

src/client/byte-stream-polyfill.ts

···
-// Safari doesn't implement ReadableByteStreamController.
-// The standard web-streams-polyfill only polyfills ReadableStream, not byte streams.
-// This adds the missing byte stream support.
-
-import {
-  ReadableStream as PolyfillReadableStream,
-  ReadableByteStreamController as PolyfillReadableByteStreamController,
-} from "web-streams-polyfill";
-
-if (typeof globalThis.ReadableByteStreamController === "undefined") {
-  // Safari doesn't have byte stream support - use the polyfill's ReadableStream
-  // which includes full byte stream support
-  globalThis.ReadableStream = PolyfillReadableStream as typeof ReadableStream;
-  // @ts-expect-error: ReadableByteStreamController polyfill assignment
-  globalThis.ReadableByteStreamController = PolyfillReadableByteStreamController;
-}

src/client/embed.tsx

···
-// Must be first - shims webpack globals for react-server-dom-webpack
-import "./webpack-shim.ts";
-
-import "./byte-stream-polyfill.ts";
-import "web-streams-polyfill/polyfill";
-import "text-encoding";
+import "../shared/webpack-shim.ts";
+import "../shared/polyfill.ts";
 
 import React, { useState, useEffect } from "react";
 import { createRoot } from "react-dom/client";

src/client/index.tsx

···
-// Must be first - shims webpack globals for react-server-dom-webpack
-import "./webpack-shim.ts";
-
-import "./byte-stream-polyfill.ts";
-import "web-streams-polyfill/polyfill";
-import "text-encoding";
+import "../shared/webpack-shim.ts";
+import "../shared/polyfill.ts";
 
 import { createRoot } from "react-dom/client";
 import { App } from "./ui/App.tsx";

src/client/server-worker.ts

···
-import workerUrl from "../server/worker.ts?rolldown-worker";
-import type { ClientManifest } from "../shared/compiler.ts";
-
-const randomUUID: () => string =
-  crypto.randomUUID?.bind(crypto) ??
-  function (): string {
-    const bytes = crypto.getRandomValues(new Uint8Array(16));
-    bytes[6] = (bytes[6]! & 0x0f) | 0x40; // version 4
-    bytes[8] = (bytes[8]! & 0x3f) | 0x80; // variant 1
-    const hex = [...bytes].map((b) => b.toString(16).padStart(2, "0"));
-    return `${hex.slice(0, 4).join("")}-${hex.slice(4, 6).join("")}-${hex.slice(6, 8).join("")}-${hex.slice(8, 10).join("")}-${hex.slice(10).join("")}`;
-  };
-
-type EncodedArgsFormData = {
-  type: "formdata";
-  data: string;
-};
-
-type EncodedArgsString = {
-  type: "string";
-  data: string;
-};
-
-type EncodedArgsTransfer = EncodedArgsFormData | EncodedArgsString;
-
-function serializeForTransfer(encoded: FormData | string): EncodedArgsTransfer {
-  if (encoded instanceof FormData) {
-    return {
-      type: "formdata",
-      data: new URLSearchParams(encoded as unknown as Record<string, string>).toString(),
-    };
-  }
-  return { type: "string", data: encoded };
-}
-
-type WorkerReadyMessage = {
-  type: "ready";
-};
-
-type WorkerStreamStartMessage = {
-  type: "stream-start";
-  requestId: string;
-};
-
-type WorkerStreamChunkMessage = {
-  type: "stream-chunk";
-  requestId: string;
-  chunk: Uint8Array;
-};
-
-type WorkerStreamEndMessage = {
-  type: "stream-end";
-  requestId: string;
-};
-
-type WorkerStreamErrorMessage = {
-  type: "stream-error";
-  requestId: string;
-  error: { message: string };
-};
-
-type WorkerDeployedMessage = {
-  type: "deployed";
-  requestId: string;
-};
-
-type WorkerErrorMessage = {
-  type: "error";
-  requestId: string;
-  error: { message: string; stack?: string };
-};
-
-type WorkerMessage =
-  | WorkerReadyMessage
-  | WorkerStreamStartMessage
-  | WorkerStreamChunkMessage
-  | WorkerStreamEndMessage
-  | WorkerStreamErrorMessage
-  | WorkerDeployedMessage
-  | WorkerErrorMessage;
-
-type PendingRequest = {
-  resolve: (value: unknown) => void;
-  reject: (error: Error) => void;
-};
-
-export class ServerWorker {
-  private worker: Worker;
-  private pending: Map<string, PendingRequest> = new Map();
-  private streams: Map<string, ReadableStreamDefaultController<Uint8Array>> = new Map();
-  private readyPromise: Promise<void>;
-  private readyResolve!: () => void;
-
-  constructor() {
-    this.worker = new Worker(workerUrl);
-    this.readyPromise = new Promise((resolve) => {
-      this.readyResolve = resolve;
-    });
-
-    this.worker.onmessage = this.handleMessage.bind(this);
-    this.worker.onerror = this.handleError.bind(this);
-  }
-
-  private handleMessage(event: MessageEvent<WorkerMessage>): void {
-    const { type } = event.data;
-
-    if (type === "ready") {
-      this.readyResolve();
-      return;
-    }
-
-    if (type === "stream-start") {
-      const { requestId } = event.data;
-      const pending = this.pending.get(requestId);
-      if (!pending) return;
-      this.pending.delete(requestId);
-
-      let controller: ReadableStreamDefaultController<Uint8Array>;
-      const stream = new ReadableStream<Uint8Array>({
-        start: (c) => {
-          controller = c;
-        },
-      });
-      this.streams.set(requestId, controller!);
-      pending.resolve(stream);
-      return;
-    }
-
-    if (type === "stream-chunk") {
-      const { requestId, chunk } = event.data;
-      const controller = this.streams.get(requestId);
-      if (controller) controller.enqueue(chunk);
-      return;
-    }
-
-    if (type === "stream-end") {
-      const { requestId } = event.data;
-      const controller = this.streams.get(requestId);
-      if (controller) {
-        controller.close();
-        this.streams.delete(requestId);
-      }
-      return;
-    }
-
-    if (type === "stream-error") {
-      const { requestId, error } = event.data;
-      const controller = this.streams.get(requestId);
-      if (controller) {
-        controller.error(new Error(error.message));
-        this.streams.delete(requestId);
-      }
-      return;
-    }
-
-    if (type === "deployed") {
-      const { requestId } = event.data as WorkerDeployedMessage;
-      const pending = this.pending.get(requestId);
-      if (!pending) {
-        console.warn(`No pending request for ${requestId}`);
-        return;
-      }
-      this.pending.delete(requestId);
-      pending.resolve(undefined);
-      return;
-    }
-
-    if (type === "error") {
-      const { requestId, error } = event.data as WorkerErrorMessage;
-      const pending = this.pending.get(requestId);
-      if (!pending) {
-        console.warn(`No pending request for ${requestId}`);
-        return;
-      }
-      this.pending.delete(requestId);
-      const err = new Error(error.message);
-      if (error.stack) {
-        err.stack = error.stack;
-      }
-      pending.reject(err);
-    }
-  }
-
-  private handleError(event: ErrorEvent): void {
-    const errorMsg = event.message || "Unknown worker error";
-    console.error(`Worker error: ${errorMsg}`);
-
-    for (const [, pending] of this.pending) {
-      pending.reject(new Error(`Worker error: ${errorMsg}`));
-    }
-    this.pending.clear();
-  }
-
-  async deploy({
-    compiledCode,
-    manifest,
-    actionNames,
-  }: {
-    compiledCode: string;
-    manifest: ClientManifest;
-    actionNames: string[];
-  }): Promise<void> {
-    await this.readyPromise;
-    const requestId = randomUUID();
-
-    return new Promise((resolve, reject) => {
-      this.pending.set(requestId, { resolve: resolve as (value: unknown) => void, reject });
-      this.worker.postMessage({
-        type: "deploy",
-        requestId,
-        compiledCode,
-        manifest,
-        actionNames,
-      });
-    });
-  }
-
-  async render(): Promise<ReadableStream<Uint8Array>> {
-    await this.readyPromise;
-    const requestId = randomUUID();
-
-    return new Promise((resolve, reject) => {
-      this.pending.set(requestId, { resolve: resolve as (value: unknown) => void, reject });
-      this.worker.postMessage({ type: "render", requestId });
-    });
-  }
-
-  async callAction(
-    actionId: string,
-    encodedArgs: FormData | string,
-  ): Promise<ReadableStream<Uint8Array>> {
-    await this.readyPromise;
-    const requestId = randomUUID();
-
-    return new Promise((resolve, reject) => {
-      this.pending.set(requestId, { resolve: resolve as (value: unknown) => void, reject });
-      this.worker.postMessage({
-        type: "action",
-        requestId,
-        actionId,
-        encodedArgs: serializeForTransfer(encodedArgs),
-      });
-    });
-  }
-
-  async callActionRaw(actionId: string, rawPayload: string): Promise<ReadableStream<Uint8Array>> {
-    await this.readyPromise;
-    const requestId = randomUUID();
-
-    return new Promise((resolve, reject) => {
-      this.pending.set(requestId, { resolve: resolve as (value: unknown) => void, reject });
-      this.worker.postMessage({
-        type: "action",
-        requestId,
-        actionId,
-        encodedArgs: { type: "formdata", data: rawPayload },
-      });
-    });
-  }
-
-  terminate(): void {
-    this.worker.terminate();
-    for (const [, pending] of this.pending) {
-      pending.reject(new Error("Worker terminated"));
-    }
-    this.pending.clear();
-    for (const [, controller] of this.streams) {
-      controller.error(new Error("Worker terminated"));
-    }
-    this.streams.clear();
-  }
-}

src/client/ui/Workspace.tsx

···
   evaluateClientModule,
   type CallServerCallback,
 } from "../runtime/index.ts";
-import { ServerWorker } from "../server-worker.ts";
+import { WorkerClient, encodeArgs } from "../worker-client.ts";
 import {
   parseClientModule,
   parseServerActions,
···
 }: WorkspaceProps): React.ReactElement {
   const [serverCode, setServerCode] = useState(initialServerCode);
   const [clientCode, setClientCode] = useState(initialClientCode);
-  const [serverWorker] = useState(() => new ServerWorker());
   const [timeline] = useState(() => new Timeline());
+  const [workerClient, setWorkerClient] = useState<WorkerClient | null>(null);
   const [callServerRef] = useState<CallServerRef>({ current: null });
 
   const snapshot = useSyncExternalStore(timeline.subscribe, timeline.getSnapshot);
···
 
   const handleAddRawAction = useCallback(
     async (actionName: string, rawPayload: string) => {
+      if (!workerClient) throw new Error("Worker not initialized");
       try {
-        const responseRaw = await serverWorker.callActionRaw(actionName, rawPayload);
+        const responseRaw = await workerClient.callAction(actionName, {
+          type: "formdata",
+          data: rawPayload,
+        });
         const streamOptions = callServerRef.current ? { callServer: callServerRef.current } : {};
         const stream = new SteppableStream(responseRaw, streamOptions);
         await stream.waitForBuffer();
···
         console.error("[raw action] Failed:", err);
       }
     },
-    [serverWorker, timeline, callServerRef],
+    [workerClient, timeline, callServerRef],
   );
 
   const compile = useCallback(
     async (sCode: string, cCode: string) => {
+      if (!workerClient) throw new Error("Worker not initialized");
       try {
         setError(null);
         timeline.clear();
···
         const compiledServer = compileToCommonJS(sCode);
         setAvailableActions(actionNames);
 
-        await serverWorker.deploy({
-          compiledCode: compiledServer,
-          manifest,
-          actionNames,
-        });
+        await workerClient.deploy(compiledServer, manifest, actionNames);
 
         const callServer: CallServerCallback | null =
           actionNames.length > 0
···
                         encodedArgs as unknown as Record<string, string>,
                       ).toString();
 
-                const responseRaw = await serverWorker.callAction(actionName, encodedArgs);
+                const responseRaw = await workerClient.callAction(
+                  actionName,
+                  encodeArgs(encodedArgs),
+                );
                 const stream = new SteppableStream(responseRaw, {
                   callServer: callServer as CallServerCallback,
                 });
···
 
         callServerRef.current = callServer;
 
-        const renderRaw = await serverWorker.render();
+        const renderRaw = await workerClient.render();
         const renderStreamOptions = callServer ? { callServer } : {};
         const renderStream = new SteppableStream(renderRaw, renderStreamOptions);
         await renderStream.waitForBuffer();
···
         setClientModuleReady(false);
       }
     },
-    [timeline, serverWorker, callServerRef],
+    [timeline, workerClient, callServerRef],
   );
 
   const handleReset = useCallback(() => {
···
   }, [serverCode, clientCode, compile]);
 
   useEffect(() => {
-    return () => serverWorker.terminate();
-  }, [serverWorker]);
+    const client = new WorkerClient();
+    // eslint-disable-next-line react-hooks/set-state-in-effect
+    setWorkerClient(client);
+    return () => client.terminate();
+  }, []);
 
   return (
     <main>

src/client/webpack-shim.ts

···
-// Shim webpack globals for react-server-dom-webpack/client in browser context
-
-type ModuleFactory = {
-  (module: { exports: unknown }): void;
-};
-
-type WebpackRequire = {
-  (moduleId: string): unknown;
-  m: Record<string, ModuleFactory>;
-  c: Record<string, { exports: unknown } | unknown>;
-  d: (exports: object, definition: Record<string, () => unknown>) => void;
-  r: (exports: object) => void;
-  o: (obj: object, prop: string) => boolean;
-  e: (chunkId: string) => Promise<void>;
-  p: string;
-};
-
-const clientModuleCache: Record<string, { exports: unknown }> = {};
-const clientModuleFactories: Record<string, ModuleFactory> = {};
-
-window.__webpack_module_cache__ = clientModuleCache;
-window.__webpack_modules__ = clientModuleFactories;
-
-const clientWebpackRequire: WebpackRequire = function (moduleId: string): unknown {
-  const cached = clientModuleCache[moduleId];
-  if (cached) {
-    return cached.exports ?? cached;
-  }
-  const factory = clientModuleFactories[moduleId];
-  if (factory) {
-    const module: { exports: unknown } = { exports: {} };
-    factory(module);
-    clientModuleCache[moduleId] = module;
-    return module.exports;
-  }
-  throw new Error(`Module ${moduleId} not found in webpack shim`);
-} as WebpackRequire;
-
-clientWebpackRequire.m = clientModuleFactories;
-clientWebpackRequire.c = clientModuleCache;
-clientWebpackRequire.d = function (
-  exports: object,
-  definition: Record<string, () => unknown>,
-): void {
-  for (const key in definition) {
-    const getter = definition[key];
-    if (
-      getter &&
-      Object.prototype.hasOwnProperty.call(definition, key) &&
-      !Object.prototype.hasOwnProperty.call(exports, key)
-    ) {
-      Object.defineProperty(exports, key, { enumerable: true, get: getter });
-    }
-  }
-};
-clientWebpackRequire.r = function (exports: object): void {
-  if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
-    Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-  }
-  Object.defineProperty(exports, "__esModule", { value: true });
-};
-clientWebpackRequire.o = function (obj: object, prop: string): boolean {
-  return Object.prototype.hasOwnProperty.call(obj, prop);
-};
-clientWebpackRequire.e = function (_chunkId: string): Promise<void> {
-  return Promise.resolve();
-};
-clientWebpackRequire.p = "/";
-
-window.__webpack_require__ = clientWebpackRequire;
-
-window.__webpack_chunk_load__ = function (_chunkId: string): Promise<void> {
-  return Promise.resolve();
-};
-
-export {};

src/client/worker-client.ts

···
+import workerUrl from "../server/worker-server.ts?rolldown-worker";
+import type { Response, EncodedArgs, Deploy, Render, CallAction } from "../server/worker-server.ts";
+import type { ClientManifest } from "../shared/compiler.ts";
+
+export type { EncodedArgs, ClientManifest };
+
+export function encodeArgs(encoded: FormData | string): EncodedArgs {
+  if (encoded instanceof FormData) {
+    return {
+      type: "formdata",
+      data: new URLSearchParams(encoded as unknown as Record<string, string>).toString(),
+    };
+  }
+  return { type: "string", data: encoded };
+}
+
+export class WorkerClient {
+  private worker: Worker;
+  private requests = new Map<string, ReadableStreamDefaultController<Uint8Array>>();
+  private readyPromise: Promise<void>;
+  private readyResolve!: () => void;
+
+  constructor() {
+    this.worker = new Worker(workerUrl);
+    this.readyPromise = new Promise((resolve) => {
+      this.readyResolve = resolve;
+    });
+    this.worker.onmessage = this.handleMessage.bind(this);
+    this.worker.onerror = (e) => {
+      const err = new Error(e.message || "Worker error");
+      for (const controller of this.requests.values()) {
+        controller.error(err);
+      }
+      this.requests.clear();
+    };
+  }
+
+  private handleMessage(event: MessageEvent<Response>): void {
+    const msg = event.data;
+
+    if (msg.type === "ready") {
+      this.readyResolve();
+      return;
+    }
+
+    const controller = this.requests.get(msg.requestId);
+    if (!controller) throw new Error(`Unknown request: ${msg.requestId}`);
+
+    switch (msg.type) {
+      case "next":
+        controller.enqueue(msg.value);
+        break;
+
+      case "done":
+        controller.close();
+        this.requests.delete(msg.requestId);
+        break;
+
+      case "throw": {
+        const err = new Error(msg.error);
+        if (msg.stack) {
+          err.stack = msg.stack;
+        }
+        controller.error(err);
+        this.requests.delete(msg.requestId);
+        break;
+      }
+    }
+  }
+
+  private nextRequestId = 0;
+
+  private request(body: Record<string, unknown>): ReadableStream<Uint8Array> {
+    const requestId = String(this.nextRequestId++);
+    let controller!: ReadableStreamDefaultController<Uint8Array>;
+    const stream = new ReadableStream<Uint8Array>({
+      start: (c) => {
+        controller = c;
+      },
+    });
+    this.requests.set(requestId, controller);
+    this.worker.postMessage({ ...body, requestId });
+    return stream;
+  }
+
+  terminate(): void {
+    this.worker.terminate();
+    const err = new Error("Worker terminated");
+    for (const controller of this.requests.values()) {
+      controller.error(err);
+    }
+    this.requests.clear();
+  }
+
+  async deploy(...args: Parameters<Deploy>): Promise<ReturnType<Deploy>> {
+    await this.readyPromise;
+    return this.request({ method: "deploy", args });
+  }
+
+  async render(...args: Parameters<Render>): Promise<ReturnType<Render>> {
+    await this.readyPromise;
+    return this.request({ method: "render", args });
+  }
+
+  async callAction(...args: Parameters<CallAction>): ReturnType<CallAction> {
+    await this.readyPromise;
+    return this.request({ method: "action", args });
+  }
+}

src/server/webpack-shim.ts

···
-// Shim webpack globals for react-server-dom-webpack/server in worker context
-// Uses self instead of window since this runs in a Web Worker
-
-type WebpackRequire = {
-  (moduleId: string): unknown;
-  m: Record<string, (module: { exports: unknown }) => void>;
-  c: Record<string, unknown>;
-  d: (exports: object, definition: Record<string, () => unknown>) => void;
-  r: (exports: object) => void;
-  o: (obj: object, prop: string) => boolean;
-  e: (chunkId: string) => Promise<void>;
-  p: string;
-};
-
-type WorkerSelf = DedicatedWorkerGlobalScope & {
-  __webpack_require__: WebpackRequire;
-  __webpack_chunk_load__: (chunkId: string) => Promise<void>;
-};
-
-const workerSelf = self as unknown as WorkerSelf;
-
-const moduleCache: Record<string, unknown> = {};
-
-const webpackRequire: WebpackRequire = function (moduleId: string): unknown {
-  if (moduleCache[moduleId]) {
-    return moduleCache[moduleId];
-  }
-  throw new Error(`Module ${moduleId} not found in webpack shim`);
-} as WebpackRequire;
-
-webpackRequire.m = {};
-webpackRequire.c = moduleCache;
-webpackRequire.d = function (exports: object, definition: Record<string, () => unknown>): void {
-  for (const key in definition) {
-    const getter = definition[key];
-    if (
-      getter &&
-      Object.prototype.hasOwnProperty.call(definition, key) &&
-      !Object.prototype.hasOwnProperty.call(exports, key)
-    ) {
-      Object.defineProperty(exports, key, {
-        enumerable: true,
-        get: getter,
-      });
-    }
-  }
-};
-webpackRequire.r = function (exports: object): void {
-  if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
-    Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-  }
-  Object.defineProperty(exports, "__esModule", { value: true });
-};
-webpackRequire.o = function (obj: object, prop: string): boolean {
-  return Object.prototype.hasOwnProperty.call(obj, prop);
-};
-webpackRequire.e = function (_chunkId: string): Promise<void> {
-  return Promise.resolve();
-};
-webpackRequire.p = "/";
-
-workerSelf.__webpack_require__ = webpackRequire;
-
-workerSelf.__webpack_chunk_load__ = function (_chunkId: string): Promise<void> {
-  return Promise.resolve();
-};
-
-export {};

src/server/worker-server.ts

···
+// Server Worker - RSC server simulation
+
+import "../shared/webpack-shim.ts";
+import "../shared/polyfill.ts";
+
+import {
+  renderToReadableStream,
+  registerServerReference,
+  createClientModuleProxy,
+  decodeReply,
+} from "react-server-dom-webpack/server";
+import React from "react";
+import type { ClientManifest } from "../shared/compiler.ts";
+
+declare const self: DedicatedWorkerGlobalScope;
+
+// --- Types ---
+
+export type EncodedArgs = {
+  type: "formdata" | "string";
+  data: string;
+};
+
+export type Response =
+  | { type: "ready" }
+  | { type: "next"; requestId: string; value: Uint8Array }
+  | { type: "done"; requestId: string }
+  | { type: "throw"; requestId: string; error: string; stack?: string };
+
+// --- State ---
+
+type ServerModule = {
+  default?: React.ComponentType | React.ReactNode;
+  [key: string]: unknown;
+};
+
+let deployed: { manifest: ClientManifest; module: ServerModule } | null = null;
+
+// --- Response helpers ---
+
+async function sendStream(
+  requestId: string,
+  getStream: () => ReadableStream<Uint8Array> | Promise<ReadableStream<Uint8Array>>,
+): Promise<void> {
+  try {
+    const stream = await getStream();
+    const reader = stream.getReader();
+    while (true) {
+      const { done, value } = await reader.read();
+      if (done) break;
+      self.postMessage({ type: "next", requestId, value });
+    }
+    self.postMessage({ type: "done", requestId });
+  } catch (err) {
+    const error = err instanceof Error ? err : new Error(String(err));
+    const msg: Response = { type: "throw", requestId, error: error.message };
+    if (error.stack) {
+      msg.stack = error.stack;
+    }
+    self.postMessage(msg);
+  }
+}
+
+// --- RPC handlers ---
+
+function deploy(
+  compiledCode: string,
+  manifest: ClientManifest,
+  actionNames: string[],
+): ReadableStream<Uint8Array> {
+  const clientModule = createClientModuleProxy("client");
+  const modules: Record<string, unknown> = {
+    react: React,
+    "./client": clientModule,
+  };
+
+  let code = compiledCode;
+  if (actionNames.length > 0) {
+    code +=
+      "\n" +
+      actionNames
+        .map(
+          (name) =>
+            `__registerServerReference(${name}, "${name}", "${name}"); exports.${name} = ${name};`,
+        )
+        .join("\n");
+  }
+
+  const module: { exports: ServerModule } = { exports: {} };
+  const require = (id: string): unknown => {
+    if (!modules[id]) throw new Error(`Module "${id}" not found`);
+    return modules[id];
+  };
+
+  new Function("module", "exports", "require", "React", "__registerServerReference", code)(
+    module,
+    module.exports,
+    require,
+    React,
+    registerServerReference,
+  );
+
+  deployed = { manifest, module: module.exports };
+  return new ReadableStream({ start: (c) => c.close() });
+}
+export type Deploy = typeof deploy;
+
+function render(): ReadableStream<Uint8Array> {
+  if (!deployed) throw new Error("No code deployed");
+  const App = deployed.module.default as React.ComponentType;
+  return renderToReadableStream(React.createElement(App), deployed.manifest);
+}
+export type Render = typeof render;
+
+async function callAction(
+  actionId: string,
+  encodedArgs: EncodedArgs,
+): Promise<ReadableStream<Uint8Array>> {
+  if (!deployed) throw new Error("No code deployed");
+  if (!Object.hasOwn(deployed.module, actionId)) {
+    throw new Error(`Action "${actionId}" not found`);
+  }
+  const actionFn = deployed.module[actionId] as Function;
+
+  let body: FormData | string;
+  if (encodedArgs.type === "formdata") {
+    body = new FormData();
+    for (const [key, value] of new URLSearchParams(encodedArgs.data)) {
+      body.append(key, value);
+    }
+  } else {
+    body = encodedArgs.data;
+  }
+
+  const decoded = await decodeReply(body, {});
+  const args = Array.isArray(decoded) ? decoded : [decoded];
+  const result = await actionFn(...args);
+
+  return renderToReadableStream(result, deployed.manifest);
+}
+export type CallAction = typeof callAction;
+
+// --- Message dispatch ---
+
+self.onmessage = (
+  event: MessageEvent<
+    { requestId: string } & (
+      | { method: "deploy"; args: Parameters<Deploy> }
+      | { method: "render"; args: Parameters<Render> }
+      | { method: "action"; args: Parameters<CallAction> }
+    )
+  >,
+) => {
+  const req = event.data;
+  switch (req.method) {
+    case "deploy":
+      sendStream(req.requestId, () => deploy(...req.args));
+      break;
+    case "render":
+      sendStream(req.requestId, () => render(...req.args));
+      break;
+    case "action":
+      sendStream(req.requestId, () => callAction(...req.args));
+      break;
+  }
+};
+
+self.postMessage({ type: "ready" });

src/server/worker.ts

···
-// Server Worker - RSC server simulation
-//
-// Models a real server: deploy code once, then handle requests against it.
-// - `deploy`: Store compiled code, manifest, etc. (like deploying to production)
-// - `render`/`action`: Execute against deployed code
-
-import "./webpack-shim.ts";
-import "../client/byte-stream-polyfill.ts";
-import "text-encoding";
-
-import {
-  renderToReadableStream,
-  registerServerReference,
-  createClientModuleProxy,
-  decodeReply,
-  type ClientManifest,
-} from "react-server-dom-webpack/server";
-import React from "react";
-
-declare const self: DedicatedWorkerGlobalScope;
-
-type DeployMessage = {
-  type: "deploy";
-  requestId: string;
-  compiledCode: string;
-  manifest: ClientManifest;
-  actionNames: string[];
-};
-
-type RenderMessage = {
-  type: "render";
-  requestId: string;
-};
-
-type ActionMessage = {
-  type: "action";
-  requestId: string;
-  actionId: string;
-  encodedArgs: EncodedArgs;
-};
-
-type WorkerMessage = DeployMessage | RenderMessage | ActionMessage;
-
-type EncodedArgs = {
-  type: "formdata" | "string";
-  data: string;
-};
-
-type ErrorResponse = {
-  type: "error";
-  requestId: string;
-  error: { message: string; stack?: string };
-};
-
-type DeployedResponse = {
-  type: "deployed";
-  requestId: string;
-};
-
-type StreamStartResponse = {
-  type: "stream-start";
-  requestId: string;
-};
-
-type StreamChunkResponse = {
-  type: "stream-chunk";
-  requestId: string;
-  chunk: Uint8Array;
-};
-
-type StreamEndResponse = {
-  type: "stream-end";
-  requestId: string;
-};
-
-type StreamErrorResponse = {
-  type: "stream-error";
-  requestId: string;
-  error: { message: string };
-};
-
-type ReadyResponse = {
-  type: "ready";
-};
-
-type ServerModule = {
-  default?: React.ComponentType | React.ReactNode;
-  [key: string]: unknown;
-};
-
-type DeployedState = {
-  manifest: ClientManifest;
-  serverModule: ServerModule;
-  actionNames: string[];
-};
-
-let deployed: DeployedState | null = null;
-
-// Safari doesn't support transferable streams
-async function streamToMain(stream: ReadableStream<Uint8Array>, requestId: string): Promise<void> {
-  const reader = stream.getReader();
-  try {
-    while (true) {
-      const { done, value } = await reader.read();
-      if (done) {
-        self.postMessage({ type: "stream-end", requestId } satisfies StreamEndResponse);
-        break;
-      }
-      self.postMessage({
-        type: "stream-chunk",
-        requestId,
-        chunk: value,
-      } satisfies StreamChunkResponse);
-    }
-  } catch (err) {
-    const error = err instanceof Error ? err : new Error(String(err));
-    self.postMessage({
-      type: "stream-error",
-      requestId,
-      error: { message: error.message },
-    } satisfies StreamErrorResponse);
-  }
-}
-
-self.onmessage = async (event: MessageEvent<WorkerMessage>) => {
-  const { type, requestId } = event.data;
-
-  try {
-    switch (type) {
-      case "deploy":
-        handleDeploy(event.data);
-        break;
-      case "render":
-        await handleRender(event.data);
-        break;
-      case "action":
-        await handleAction(event.data);
-        break;
-      default: {
-        const _exhaustive: never = type;
-        throw new Error(`Unknown message type: ${_exhaustive}`);
-      }
-    }
-  } catch (error) {
-    const err = error instanceof Error ? error : new Error(String(error));
-    const errorPayload: { message: string; stack?: string } = { message: err.message };
-    if (err.stack) {
-      errorPayload.stack = err.stack;
-    }
-    self.postMessage({
-      type: "error",
-      requestId,
-      error: errorPayload,
-    } satisfies ErrorResponse);
-  }
-};
-
-function handleDeploy({ compiledCode, manifest, actionNames, requestId }: DeployMessage): void {
-  const clientModule = createClientModuleProxy("client");
-  const modules: Record<string, unknown> = { react: React, "./client": clientModule };
-  const serverModule = evalModule(compiledCode, modules, actionNames);
-
-  deployed = { manifest, serverModule, actionNames };
-
-  self.postMessage({ type: "deployed", requestId } satisfies DeployedResponse);
-}
-
-function requireDeployed(): DeployedState {
-  if (!deployed) throw new Error("No code deployed");
-  return deployed;
-}
-
-async function handleRender({ requestId }: RenderMessage): Promise<void> {
-  const { manifest, serverModule } = requireDeployed();
-
-  const App = serverModule.default ?? serverModule;
-  const element =
-    typeof App === "function"
-      ? React.createElement(App as React.ComponentType)
-      : (App as React.ReactNode);
-
-  const flightStream = renderToReadableStream(element, manifest, {
-    onError: (error: unknown) => {
-      if (error instanceof Error) return error.message;
-      return String(error);
-    },
-  });
-
-  self.postMessage({ type: "stream-start", requestId } satisfies StreamStartResponse);
-  streamToMain(flightStream, requestId);
-}
-
-async function handleAction({ actionId, encodedArgs, requestId }: ActionMessage): Promise<void> {
-  const { manifest, serverModule } = requireDeployed();
-
-  const actionFn = serverModule[actionId];
-  if (typeof actionFn !== "function") {
-    throw new Error(`Action "${actionId}" not found`);
-  }
-
-  const toDecode = reconstructEncodedArgs(encodedArgs);
-  const args = await decodeReply(toDecode, {});
-  const argsArray = Array.isArray(args) ? args : [args];
-  const result = (await (actionFn as (...args: unknown[]) => Promise<unknown>)(
-    ...argsArray,
-  )) as React.ReactNode;
-
-  const flightStream = renderToReadableStream(result, manifest, {
-    onError: (error: unknown) => {
-      if (error instanceof Error) return error.message;
-      return String(error);
-    },
-  });
-
-  self.postMessage({ type: "stream-start", requestId } satisfies StreamStartResponse);
-  streamToMain(flightStream, requestId);
-}
-
-function reconstructEncodedArgs(encodedArgs: EncodedArgs): FormData | string {
-  if (encodedArgs.type === "formdata") {
-    const formData = new FormData();
-    for (const [key, value] of new URLSearchParams(encodedArgs.data)) {
-      formData.append(key, value);
-    }
-    return formData;
-  }
-  return encodedArgs.data;
-}
-
-function evalModule(
-  code: string,
-  modules: Record<string, unknown>,
-  actionNames: string[] | undefined,
-): ServerModule {
-  let finalCode = code;
-  if (actionNames && actionNames.length > 0) {
-    finalCode +=
-      "\n" +
-      actionNames
-        .map(
-          (name) =>
-            `__registerServerReference(${name}, "${name}", "${name}"); exports.${name} = ${name};`,
-        )
-        .join("\n");
-  }
-
-  const module: { exports: ServerModule } = { exports: {} };
-  const require = (id: string): unknown => {
-    if (!modules[id]) throw new Error(`Module "${id}" not found`);
-    return modules[id];
-  };
-
-  const fn = new Function(
-    "module",
-    "exports",
-    "require",
-    "React",
-    "__registerServerReference",
-    finalCode,
-  ) as (
-    module: { exports: ServerModule },
-    exports: ServerModule,
-    require: (id: string) => unknown,
-    ReactLib: typeof React,
-    registerServerRef: typeof registerServerReference,
-  ) => void;
-
-  fn(module, module.exports, require, React, registerServerReference);
-
-  return module.exports;
-}
-
-self.postMessage({ type: "ready" } satisfies ReadyResponse);

src/shared/polyfill.ts

···
+import { ReadableStream as PolyfillReadableStream } from "web-streams-polyfill";
+
+// Safari doesn't implement ReadableByteStreamController.
+if (typeof globalThis.ReadableByteStreamController === "undefined") {
+  globalThis.ReadableStream = PolyfillReadableStream as typeof ReadableStream;
+}

src/shared/webpack-shim.ts

···
+// Minimal webpack shim for react-server-dom-webpack
+// Works in both browser (window) and worker (self) contexts via globalThis
+
+const g = globalThis as Record<string, unknown>;
+
+const moduleCache: Record<string, unknown> = {};
+
+g.__webpack_module_cache__ = moduleCache;
+
+g.__webpack_require__ = function (moduleId: string): unknown {
+  const cached = moduleCache[moduleId] as { exports?: unknown } | undefined;
+  if (cached) return cached.exports ?? cached;
+  throw new Error(`Module ${moduleId} not found`);
+};
+
+g.__webpack_chunk_load__ = () => Promise.resolve();
+
+export {};

types/web-streams-polyfill.d.ts

···
-// Type declarations for web-streams-polyfill specific exports
-
-declare module "web-streams-polyfill" {
-  export const ReadableStream: {
-    new <R = unknown>(
-      underlyingSource?: UnderlyingSource<R>,
-      strategy?: QueuingStrategy<R>,
-    ): ReadableStream<R>;
-    prototype: ReadableStream;
-  };
-  // ReadableByteStreamController is an internal class, we type it loosely
-  export const ReadableByteStreamController: unknown;
-  export const WritableStream: typeof globalThis.WritableStream;
-  export const TransformStream: typeof globalThis.TransformStream;
-}
-
-declare module "web-streams-polyfill/polyfill" {
-  // Side-effect only import that polyfills globals
-}