@evolu/web 1.0.0-preview.0

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2023 Evolu
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,13 @@
+# Evolu for Web
+
+## Documentation
+
+For detailed information and usage examples, please visit [evolu.dev](https://www.evolu.dev).
+
+## Community
+
+The Evolu community is on [GitHub Discussions](https://github.com/evoluhq/evolu/discussions), where you can ask questions and voice ideas.
+
+To chat with other community members, you can join the [Evolu Discord](https://discord.gg/2J8yyyyxtZ).
+
+[![Twitter URL](https://img.shields.io/twitter/url/https/twitter.com/evoluhq.svg?style=social&label=Follow%20%40evoluhq)](https://twitter.com/evoluhq)

package/dist/Evolu/AppState.d.ts

@@ -0,0 +1,3 @@
+import { CreateAppState } from "@evolu/common/evolu";
+export declare const createAppState: CreateAppState;
+//# sourceMappingURL=AppState.d.ts.map

package/dist/Evolu/AppState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppState.d.ts","sourceRoot":"","sources":["../../src/Evolu/AppState.ts"],"names":[],"mappings":"AACA,OAAO,EAAY,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAE/D,eAAO,MAAM,cAAc,EAAE,cAe5B,CAAC"}

package/dist/Evolu/AppState.js

@@ -0,0 +1,15 @@
+import { constVoid } from "@evolu/common";
+export const createAppState = (config) => {
+    if (typeof document === "undefined") {
+        const appState = {
+            reset: constVoid,
+        };
+        return appState;
+    }
+    const appState = {
+        reset: () => {
+            location.replace(config.reloadUrl);
+        },
+    };
+    return appState;
+};

package/dist/Evolu/Db.worker.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Db.worker.d.ts.map

package/dist/Evolu/Db.worker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Db.worker.d.ts","sourceRoot":"","sources":["../../src/Evolu/Db.worker.ts"],"names":[],"mappings":""}

package/dist/Evolu/Db.worker.js

@@ -0,0 +1,15 @@
+import { createConsole, createEnglishMnemonic, createNanoIdLib, createRandom, createRandomBytes, createTime, } from "@evolu/common";
+import { createDbWorkerForPlatform, createWebSocketSync, } from "@evolu/common/evolu";
+import { createWasmSqliteDriver } from "../WasmSqliteDriver.js";
+import { wrapWebWorkerSelf } from "../WebWorker.js";
+const dbWorker = createDbWorkerForPlatform({
+    createSqliteDriver: createWasmSqliteDriver,
+    createSync: createWebSocketSync,
+    console: createConsole(),
+    time: createTime(),
+    random: createRandom(),
+    nanoIdLib: createNanoIdLib(),
+    createMnemonic: createEnglishMnemonic,
+    createRandomBytes,
+});
+wrapWebWorkerSelf(dbWorker);

package/dist/Evolu/index.d.ts

@@ -0,0 +1,3 @@
+import { EvoluDeps } from "@evolu/common/evolu";
+export declare const evoluWebDeps: EvoluDeps;
+//# sourceMappingURL=index.d.ts.map

package/dist/Evolu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Evolu/index.ts"],"names":[],"mappings":"AACA,OAAO,EAIL,SAAS,EACV,MAAM,qBAAqB,CAAC;AAa7B,eAAO,MAAM,YAAY,EAAE,SAM1B,CAAC"}

package/dist/Evolu/index.js

@@ -0,0 +1,13 @@
+import { createConsole, createNanoIdLib, createTime } from "@evolu/common";
+import { createSharedWebWorker } from "../SharedWebWorker.js";
+import { createAppState } from "./AppState.js";
+const createDbWorker = (name) => createSharedWebWorker(name, () => new Worker(new URL("Db.worker.js", import.meta.url), {
+    type: "module",
+}));
+export const evoluWebDeps = {
+    time: createTime(),
+    console: createConsole(),
+    nanoIdLib: createNanoIdLib(),
+    createAppState,
+    createDbWorker,
+};

package/dist/SharedWebWorker.d.ts

@@ -0,0 +1,30 @@
+/**
+ * SharedWebWorker (WebWorker + BroadcastChannel + Web Locks)
+ *
+ * A SharedWebWorker is a Web Worker that is shared across multiple browser
+ * tabs. This implementation provides a shared worker-like experience even in
+ * browsers that do not support the native SharedWorker API.
+ *
+ * Unlike a true SharedWorker (which uses MessagePorts for direct, tab-specific
+ * communication), this approach uses BroadcastChannel for cross-tab messaging
+ * and Web Locks to ensure only one tab owns and runs the actual Worker
+ * instance.
+ *
+ * All tabs communicate via BroadcastChannel, so every message is broadcast to
+ * all tabs, and each tab must filter/process only relevant messages. This is
+ * less efficient than MessagePorts, but it works everywhere and is "good
+ * enough" for most use cases.
+ *
+ * See the protocol and coordination logic below for details.
+ *
+ * @module SharedWebWorker
+ */
+import { SimpleName, Worker } from "@evolu/common";
+/**
+ * Creates a shared Web Worker using BroadcastChannel and Web Locks. This allows
+ * multiple tabs to share a single Web Worker instance. The first tab to acquire
+ * the lock becomes the owner and runs the worker. Other tabs act as proxies,
+ * forwarding messages to the owner.
+ */
+export declare const createSharedWebWorker: <Input, Output>(name: SimpleName, createWebWorker: () => globalThis.Worker) => Worker<Input, Output>;
+//# sourceMappingURL=SharedWebWorker.d.ts.map

package/dist/SharedWebWorker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SharedWebWorker.d.ts","sourceRoot":"","sources":["../src/SharedWebWorker.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,OAAO,EAAa,UAAU,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AA8B9D;;;;;GAKG;AACH,eAAO,MAAM,qBAAqB,GAAI,KAAK,EAAE,MAAM,EACjD,MAAM,UAAU,EAChB,iBAAiB,MAAM,UAAU,CAAC,MAAM,KACvC,MAAM,CAAC,KAAK,EAAE,MAAM,CAuFtB,CAAC"}

package/dist/SharedWebWorker.js

@@ -0,0 +1,104 @@
+/**
+ * SharedWebWorker (WebWorker + BroadcastChannel + Web Locks)
+ *
+ * A SharedWebWorker is a Web Worker that is shared across multiple browser
+ * tabs. This implementation provides a shared worker-like experience even in
+ * browsers that do not support the native SharedWorker API.
+ *
+ * Unlike a true SharedWorker (which uses MessagePorts for direct, tab-specific
+ * communication), this approach uses BroadcastChannel for cross-tab messaging
+ * and Web Locks to ensure only one tab owns and runs the actual Worker
+ * instance.
+ *
+ * All tabs communicate via BroadcastChannel, so every message is broadcast to
+ * all tabs, and each tab must filter/process only relevant messages. This is
+ * less efficient than MessagePorts, but it works everywhere and is "good
+ * enough" for most use cases.
+ *
+ * See the protocol and coordination logic below for details.
+ *
+ * @module SharedWebWorker
+ */
+import { constVoid } from "@evolu/common";
+/**
+ * Creates a shared Web Worker using BroadcastChannel and Web Locks. This allows
+ * multiple tabs to share a single Web Worker instance. The first tab to acquire
+ * the lock becomes the owner and runs the worker. Other tabs act as proxies,
+ * forwarding messages to the owner.
+ */
+export const createSharedWebWorker = (name, createWebWorker) => {
+    // Server.
+    if (typeof document === "undefined")
+        return {
+            postMessage: constVoid,
+            onMessage: constVoid,
+        };
+    const namespacedName = `evolu-sharedwebworker-${name}`;
+    const channel = new BroadcastChannel(namespacedName);
+    let worker;
+    let onMessageCallback;
+    let ownerReady = false;
+    const pendingMessages = [];
+    // Listen for owner-ready and worker responses
+    channel.onmessage = (event) => {
+        const data = event.data;
+        if (data.type === "owner-ready") {
+            ownerReady = true;
+            // Flush pending messages to the new owner
+            for (const message of pendingMessages) {
+                channel.postMessage({ type: "to-worker", message });
+            }
+            pendingMessages.length = 0;
+        }
+        else if (!worker && data.type === "from-worker") {
+            onMessageCallback?.(data.message);
+        }
+    };
+    // Request owner-ready when not the owner
+    channel.postMessage({ type: "request-owner-ready" });
+    // Try to acquire the lock and become the owner
+    void navigator.locks.request(namespacedName, async () => {
+        worker = createWebWorker();
+        // Flush pending messages to the worker
+        for (const message of pendingMessages) {
+            worker.postMessage(message);
+        }
+        pendingMessages.length = 0;
+        // Forward messages from channel to worker
+        channel.onmessage = (event) => {
+            const data = event.data;
+            if (data.type === "to-worker") {
+                worker.postMessage(data.message);
+            }
+            else if (data.type === "request-owner-ready") {
+                // Respond to request
+                channel.postMessage({ type: "owner-ready" });
+            }
+        };
+        // Forward messages from worker to channel
+        worker.onmessage = (event) => {
+            channel.postMessage({ type: "from-worker", message: event.data });
+            onMessageCallback?.(event.data);
+        };
+        // Announce ownership
+        channel.postMessage({ type: "owner-ready" });
+        // Hold the lock forever
+        await new Promise(constVoid);
+    });
+    return {
+        postMessage: (message) => {
+            if (worker) {
+                worker.postMessage(message);
+            }
+            else if (ownerReady) {
+                channel.postMessage({ type: "to-worker", message });
+            }
+            else {
+                pendingMessages.push(message);
+            }
+        },
+        onMessage: (callback) => {
+            onMessageCallback = callback;
+        },
+    };
+};

package/dist/WasmSqliteDriver.d.ts

@@ -0,0 +1,3 @@
+import { CreateSqliteDriver } from "@evolu/common";
+export declare const createWasmSqliteDriver: CreateSqliteDriver;
+//# sourceMappingURL=WasmSqliteDriver.d.ts.map

package/dist/WasmSqliteDriver.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WasmSqliteDriver.d.ts","sourceRoot":"","sources":["../src/WasmSqliteDriver.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,kBAAkB,EAGnB,MAAM,eAAe,CAAC;AAavB,eAAO,MAAM,sBAAsB,EAAE,kBA+DpC,CAAC"}

package/dist/WasmSqliteDriver.js

@@ -0,0 +1,60 @@
+import { constVoid, createPreparedStatementsCache, } from "@evolu/common";
+import sqlite3InitModule from "@sqlite.org/sqlite-wasm";
+// TODO: Do we still need that?
+// https://github.com/sqlite/sqlite-wasm/issues/62
+// @ts-expect-error Missing types.
+globalThis.sqlite3ApiConfig = {
+    warn: constVoid,
+};
+// Init ASAP.
+const sqlite3Promise = sqlite3InitModule();
+export const createWasmSqliteDriver = async (name) => {
+    const sqlite3 = await sqlite3Promise;
+    const poolUtil = await sqlite3.installOpfsSAHPoolVfs({ name });
+    const db = new poolUtil.OpfsSAHPoolDb("/evolu1.db");
+    let isDisposed = false;
+    const cache = createPreparedStatementsCache((sql) => db.prepare(sql), (statement) => {
+        statement.finalize();
+    });
+    const driver = {
+        exec: (query, isMutation) => {
+            const prepared = cache.get(query);
+            if (prepared) {
+                prepared.bind(query.parameters);
+                if (isMutation) {
+                    prepared.stepReset();
+                    return {
+                        rows: [],
+                        changes: db.changes(),
+                    };
+                }
+                const rows = [];
+                while (prepared.step()) {
+                    rows.push(prepared.get({}));
+                }
+                prepared.reset();
+                return {
+                    rows: rows,
+                    changes: 0,
+                };
+            }
+            const rows = db.exec(query.sql, {
+                returnValue: "resultRows",
+                rowMode: "object",
+                bind: query.parameters,
+            });
+            const changes = db.changes();
+            return { rows, changes };
+        },
+        export: () => sqlite3.capi.sqlite3_js_db_export(db),
+        [Symbol.dispose]: () => {
+            if (isDisposed)
+                return;
+            isDisposed = true;
+            // poolUtil.unlink?
+            cache[Symbol.dispose]();
+            db.close();
+        },
+    };
+    return driver;
+};

package/dist/WebWorker.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Typed wrapper for Web Worker
+ *
+ * While Comlink DX is nice, there are still memory leaks and unresolved bugs.
+ * Use plain Web Worker with a typed wrapper if maximum performance and
+ * reliability are required.
+ *
+ * @module
+ */
+import { Worker } from "@evolu/common";
+/**
+ * Wraps a Web Worker to provide a typed interface for sending and receiving
+ * messages.
+ */
+export declare const wrapWebWorker: <Input, Output>(createWebWorker: () => globalThis.Worker) => Worker<Input, Output>;
+export declare const wrapWebWorkerSelf: <Input, Output>(worker: Worker<Input, Output>) => void;
+//# sourceMappingURL=WebWorker.d.ts.map

package/dist/WebWorker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WebWorker.d.ts","sourceRoot":"","sources":["../src/WebWorker.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAa,MAAM,EAAE,MAAM,eAAe,CAAC;AAElD;;;GAGG;AACH,eAAO,MAAM,aAAa,GAAI,KAAK,EAAE,MAAM,EACzC,iBAAiB,MAAM,UAAU,CAAC,MAAM,KACvC,MAAM,CAAC,KAAK,EAAE,MAAM,CAuBtB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,KAAK,EAAE,MAAM,EAC7C,QAAQ,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,KAC5B,IAQF,CAAC"}

package/dist/WebWorker.js

@@ -0,0 +1,42 @@
+/**
+ * Typed wrapper for Web Worker
+ *
+ * While Comlink DX is nice, there are still memory leaks and unresolved bugs.
+ * Use plain Web Worker with a typed wrapper if maximum performance and
+ * reliability are required.
+ *
+ * @module
+ */
+import { constVoid } from "@evolu/common";
+/**
+ * Wraps a Web Worker to provide a typed interface for sending and receiving
+ * messages.
+ */
+export const wrapWebWorker = (createWebWorker) => {
+    // Server.
+    if (typeof document === "undefined")
+        return {
+            postMessage: constVoid,
+            onMessage: constVoid,
+        };
+    const webWorker = createWebWorker();
+    const worker = {
+        postMessage: (message) => {
+            webWorker.postMessage(message);
+        },
+        onMessage: (callback) => {
+            webWorker.onmessage = (event) => {
+                callback(event.data);
+            };
+        },
+    };
+    return worker;
+};
+export const wrapWebWorkerSelf = (worker) => {
+    worker.onMessage((message) => {
+        postMessage(message);
+    });
+    self.onmessage = (event) => {
+        worker.postMessage(event.data);
+    };
+};

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./Evolu/index.js";
+export * from "./SharedWebWorker.js";
+export * from "./WebWorker.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,gBAAgB,CAAC"}

package/dist/index.js

@@ -0,0 +1,3 @@
+export * from "./Evolu/index.js";
+export * from "./SharedWebWorker.js";
+export * from "./WebWorker.js";

package/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "@evolu/web",
+  "version": "1.0.0-preview.0",
+  "description": "Evolu for web",
+  "keywords": [
+    "evolu",
+    "web"
+  ],
+  "author": "Daniel Steigerwald <daniel@steigerwald.cz>",
+  "license": "MIT",
+  "repository": "evoluhq/evolu",
+  "bugs": {
+    "url": "https://github.com/evoluhq/evolu/issues"
+  },
+  "homepage": "https://evolu.dev",
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "browser": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist/**",
+    "src/**",
+    "README.md"
+  ],
+  "dependencies": {
+    "@sqlite.org/sqlite-wasm": "3.50.0-build1"
+  },
+  "devDependencies": {
+    "@types/web-locks-api": "^0.0.5",
+    "typescript": "^5.8.3",
+    "user-agent-data-types": "^0.4.2",
+    "vitest": "^3.2.2",
+    "@evolu/common": "6.0.0-preview.0",
+    "@evolu/tsconfig": "0.0.2"
+  },
+  "peerDependencies": {
+    "@evolu/common": "^6.0.0-preview.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "engines": {
+    "node": ">=22.0.0"
+  },
+  "sideEffects": [],
+  "scripts": {
+    "dev": "tsc --watch",
+    "build": "shx rm -rf dist && tsc",
+    "clean": "shx rm -rf .turbo node_modules dist",
+    "format": "prettier --write \"src/*.{ts,tsx,md}\""
+  }
+}

package/src/Evolu/AppState.ts

@@ -0,0 +1,19 @@
+import { constVoid } from "@evolu/common";
+import { AppState, CreateAppState } from "@evolu/common/evolu";
+
+export const createAppState: CreateAppState = (config) => {
+  if (typeof document === "undefined") {
+    const appState: AppState = {
+      reset: constVoid,
+    };
+    return appState;
+  }
+
+  const appState: AppState = {
+    reset: () => {
+      location.replace(config.reloadUrl);
+    },
+  };
+
+  return appState;
+};

package/src/Evolu/Db.worker.ts

@@ -0,0 +1,27 @@
+import {
+  createConsole,
+  createEnglishMnemonic,
+  createNanoIdLib,
+  createRandom,
+  createRandomBytes,
+  createTime,
+} from "@evolu/common";
+import {
+  createDbWorkerForPlatform,
+  createWebSocketSync,
+} from "@evolu/common/evolu";
+import { createWasmSqliteDriver } from "../WasmSqliteDriver.js";
+import { wrapWebWorkerSelf } from "../WebWorker.js";
+
+const dbWorker = createDbWorkerForPlatform({
+  createSqliteDriver: createWasmSqliteDriver,
+  createSync: createWebSocketSync,
+  console: createConsole(),
+  time: createTime(),
+  random: createRandom(),
+  nanoIdLib: createNanoIdLib(),
+  createMnemonic: createEnglishMnemonic,
+  createRandomBytes,
+});
+
+wrapWebWorkerSelf(dbWorker);

package/src/Evolu/index.ts

@@ -0,0 +1,26 @@
+import { createConsole, createNanoIdLib, createTime } from "@evolu/common";
+import {
+  CreateDbWorker,
+  DbWorkerInput,
+  DbWorkerOutput,
+  EvoluDeps,
+} from "@evolu/common/evolu";
+import { createSharedWebWorker } from "../SharedWebWorker.js";
+import { createAppState } from "./AppState.js";
+
+const createDbWorker: CreateDbWorker = (name) =>
+  createSharedWebWorker<DbWorkerInput, DbWorkerOutput>(
+    name,
+    () =>
+      new Worker(new URL("Db.worker.js", import.meta.url), {
+        type: "module",
+      }),
+  );
+
+export const evoluWebDeps: EvoluDeps = {
+  time: createTime(),
+  console: createConsole(),
+  nanoIdLib: createNanoIdLib(),
+  createAppState,
+  createDbWorker,
+};

package/src/SharedWebWorker.ts

@@ -0,0 +1,149 @@
+/**
+ * SharedWebWorker (WebWorker + BroadcastChannel + Web Locks)
+ *
+ * A SharedWebWorker is a Web Worker that is shared across multiple browser
+ * tabs. This implementation provides a shared worker-like experience even in
+ * browsers that do not support the native SharedWorker API.
+ *
+ * Unlike a true SharedWorker (which uses MessagePorts for direct, tab-specific
+ * communication), this approach uses BroadcastChannel for cross-tab messaging
+ * and Web Locks to ensure only one tab owns and runs the actual Worker
+ * instance.
+ *
+ * All tabs communicate via BroadcastChannel, so every message is broadcast to
+ * all tabs, and each tab must filter/process only relevant messages. This is
+ * less efficient than MessagePorts, but it works everywhere and is "good
+ * enough" for most use cases.
+ *
+ * See the protocol and coordination logic below for details.
+ *
+ * @module SharedWebWorker
+ */
+
+import { constVoid, SimpleName, Worker } from "@evolu/common";
+
+/**
+ * Ownership protocol explanation:
+ *
+ * - When a tab becomes the owner (acquires the lock), it announces ownership by
+ *   posting { type: "owner-ready" } to the BroadcastChannel. This notifies all
+ *   currently open tabs.
+ * - Tabs that open later may miss this announcement, since BroadcastChannel does
+ *   not replay messages. Therefore, new tabs request ownership status by
+ *   posting { type: "request-owner-ready" }, and the owner responds with {
+ *   type: "owner-ready" }.
+ * - Once a tab receives "owner-ready", it knows where to send messages and does
+ *   not need to ask again.
+ * - This ensures all tabs, regardless of when they open, can reliably detect the
+ *   current owner.
+ *
+ * Internal note:
+ *
+ * - Announcing ownership is for immediate notification of already-open tabs.
+ * - Requesting ownership is a fallback for tabs that open later and miss the
+ *   announcement.
+ * - Both are required for robust cross-tab coordination.
+ */
+type SharedWebWorkerChannelMessage<Input, Output> =
+  | { type: "owner-ready" }
+  | { type: "request-owner-ready" }
+  | { type: "to-worker"; message: Input }
+  | { type: "from-worker"; message: Output };
+
+/**
+ * Creates a shared Web Worker using BroadcastChannel and Web Locks. This allows
+ * multiple tabs to share a single Web Worker instance. The first tab to acquire
+ * the lock becomes the owner and runs the worker. Other tabs act as proxies,
+ * forwarding messages to the owner.
+ */
+export const createSharedWebWorker = <Input, Output>(
+  name: SimpleName,
+  createWebWorker: () => globalThis.Worker,
+): Worker<Input, Output> => {
+  // Server.
+  if (typeof document === "undefined")
+    return {
+      postMessage: constVoid,
+      onMessage: constVoid,
+    };
+
+  const namespacedName = `evolu-sharedwebworker-${name}`;
+  const channel = new BroadcastChannel(namespacedName);
+
+  let worker: globalThis.Worker | undefined;
+  let onMessageCallback: ((message: Output) => void) | undefined;
+  let ownerReady = false;
+
+  const pendingMessages: Array<Input> = [];
+
+  // Listen for owner-ready and worker responses
+  channel.onmessage = (
+    event: MessageEvent<SharedWebWorkerChannelMessage<Input, Output>>,
+  ) => {
+    const data = event.data;
+    if (data.type === "owner-ready") {
+      ownerReady = true;
+      // Flush pending messages to the new owner
+      for (const message of pendingMessages) {
+        channel.postMessage({ type: "to-worker", message });
+      }
+      pendingMessages.length = 0;
+    } else if (!worker && data.type === "from-worker") {
+      onMessageCallback?.(data.message);
+    }
+  };
+
+  // Request owner-ready when not the owner
+  channel.postMessage({ type: "request-owner-ready" });
+
+  // Try to acquire the lock and become the owner
+  void navigator.locks.request(namespacedName, async () => {
+    worker = createWebWorker();
+
+    // Flush pending messages to the worker
+    for (const message of pendingMessages) {
+      worker.postMessage(message);
+    }
+    pendingMessages.length = 0;
+
+    // Forward messages from channel to worker
+    channel.onmessage = (
+      event: MessageEvent<SharedWebWorkerChannelMessage<Input, Output>>,
+    ) => {
+      const data = event.data;
+      if (data.type === "to-worker") {
+        worker!.postMessage(data.message);
+      } else if (data.type === "request-owner-ready") {
+        // Respond to request
+        channel.postMessage({ type: "owner-ready" });
+      }
+    };
+
+    // Forward messages from worker to channel
+    worker.onmessage = (event: MessageEvent<Output>) => {
+      channel.postMessage({ type: "from-worker", message: event.data });
+      onMessageCallback?.(event.data);
+    };
+
+    // Announce ownership
+    channel.postMessage({ type: "owner-ready" });
+
+    // Hold the lock forever
+    await new Promise(constVoid);
+  });
+
+  return {
+    postMessage: (message: Input) => {
+      if (worker) {
+        worker.postMessage(message);
+      } else if (ownerReady) {
+        channel.postMessage({ type: "to-worker", message });
+      } else {
+        pendingMessages.push(message);
+      }
+    },
+    onMessage: (callback) => {
+      onMessageCallback = callback;
+    },
+  };
+};

package/src/WasmSqliteDriver.ts

@@ -0,0 +1,83 @@
+import {
+  constVoid,
+  createPreparedStatementsCache,
+  CreateSqliteDriver,
+  SqliteDriver,
+  SqliteRow,
+} from "@evolu/common";
+import sqlite3InitModule, { PreparedStatement } from "@sqlite.org/sqlite-wasm";
+
+// TODO: Do we still need that?
+// https://github.com/sqlite/sqlite-wasm/issues/62
+// @ts-expect-error Missing types.
+globalThis.sqlite3ApiConfig = {
+  warn: constVoid,
+};
+
+// Init ASAP.
+const sqlite3Promise = sqlite3InitModule();
+
+export const createWasmSqliteDriver: CreateSqliteDriver = async (name) => {
+  const sqlite3 = await sqlite3Promise;
+  const poolUtil = await sqlite3.installOpfsSAHPoolVfs({ name });
+  const db = new poolUtil.OpfsSAHPoolDb("/evolu1.db");
+  let isDisposed = false;
+
+  const cache = createPreparedStatementsCache<PreparedStatement>(
+    (sql) => db.prepare(sql),
+    (statement) => {
+      statement.finalize();
+    },
+  );
+
+  const driver: SqliteDriver = {
+    exec: (query, isMutation) => {
+      const prepared = cache.get(query);
+
+      if (prepared) {
+        prepared.bind(query.parameters);
+
+        if (isMutation) {
+          prepared.stepReset();
+          return {
+            rows: [] as ReadonlyArray<SqliteRow>,
+            changes: db.changes(),
+          };
+        }
+
+        const rows = [];
+        while (prepared.step()) {
+          rows.push(prepared.get({}));
+        }
+        prepared.reset();
+
+        return {
+          rows: rows as ReadonlyArray<SqliteRow>,
+          changes: 0,
+        };
+      }
+
+      const rows = db.exec(query.sql, {
+        returnValue: "resultRows",
+        rowMode: "object",
+        bind: query.parameters,
+      }) as ReadonlyArray<SqliteRow>;
+
+      const changes = db.changes();
+
+      return { rows, changes };
+    },
+
+    export: () => sqlite3.capi.sqlite3_js_db_export(db),
+
+    [Symbol.dispose]: () => {
+      if (isDisposed) return;
+      isDisposed = true;
+      // poolUtil.unlink?
+      cache[Symbol.dispose]();
+      db.close();
+    },
+  };
+
+  return driver;
+};

package/src/WebWorker.ts

@@ -0,0 +1,54 @@
+/**
+ * Typed wrapper for Web Worker
+ *
+ * While Comlink DX is nice, there are still memory leaks and unresolved bugs.
+ * Use plain Web Worker with a typed wrapper if maximum performance and
+ * reliability are required.
+ *
+ * @module
+ */
+
+import { constVoid, Worker } from "@evolu/common";
+
+/**
+ * Wraps a Web Worker to provide a typed interface for sending and receiving
+ * messages.
+ */
+export const wrapWebWorker = <Input, Output>(
+  createWebWorker: () => globalThis.Worker,
+): Worker<Input, Output> => {
+  // Server.
+  if (typeof document === "undefined")
+    return {
+      postMessage: constVoid,
+      onMessage: constVoid,
+    };
+
+  const webWorker = createWebWorker();
+
+  const worker: Worker<Input, Output> = {
+    postMessage: (message) => {
+      webWorker.postMessage(message);
+    },
+
+    onMessage: (callback) => {
+      webWorker.onmessage = (event: MessageEvent<Output>) => {
+        callback(event.data);
+      };
+    },
+  };
+
+  return worker;
+};
+
+export const wrapWebWorkerSelf = <Input, Output>(
+  worker: Worker<Input, Output>,
+): void => {
+  worker.onMessage((message) => {
+    postMessage(message);
+  });
+
+  self.onmessage = (event: MessageEvent<Input>) => {
+    worker.postMessage(event.data);
+  };
+};

package/src/index.ts

@@ -0,0 +1,3 @@
+export * from "./Evolu/index.js";
+export * from "./SharedWebWorker.js";
+export * from "./WebWorker.js";