@powersync/web 0.0.0-dev-20260630141119 → 0.0.0-dev-20260708103617

package/src/db/sync/SharedWebStreamingSyncImplementation.ts

@@ -1,16 +1,21 @@
-import { LogRecord, PowerSyncCredentials } from '@powersync/common';
+import {
+  PowerSyncConnectionOptions,
+  PowerSyncCredentials,
+  SubscribedStream,
+  SyncStatusOptions
+} from '@powersync/common';
 import * as Comlink from 'comlink';
+import { getNavigatorLocks } from '../../shared/navigator.js';
 import { AbstractSharedSyncClientProvider } from '../../worker/sync/AbstractSharedSyncClientProvider.js';
 import { ManualSharedSyncPayload, SharedSyncClientEvent } from '../../worker/sync/SharedSyncImplementation.js';
 import { WorkerClient } from '../../worker/sync/WorkerClient.js';
 import { WebDBAdapter } from '../adapters/WebDBAdapter.js';
+import { DEFAULT_CACHE_SIZE_KB, TemporaryStorageOption, resolveWebSQLFlags } from '../adapters/web-sql-flags.js';
 import {
   WebStreamingSyncImplementation,
   WebStreamingSyncImplementationOptions
 } from './WebStreamingSyncImplementation.js';
 import { generateTabCloseSignal } from '../../shared/tab_close_signal.js';
-import { SubscribedStream, SyncStatusJson, ResolvedSyncOptions } from '@powersync/shared-internals';
-import { connectToExistingWorker, connectToWorker, WorkerConnection } from '../../worker/client.js';
 
 /**
  * The shared worker will trigger methods on this side of the message port
@@ -19,7 +24,7 @@ import { connectToExistingWorker, connectToWorker, WorkerConnection } from '../.
 class SharedSyncClientProvider extends AbstractSharedSyncClientProvider {
   constructor(
     protected options: WebStreamingSyncImplementationOptions,
-    public statusChanged: (status: SyncStatusJson) => void,
+    public statusChanged: (status: SyncStatusOptions) => void,
     protected webDB: WebDBAdapter
   ) {
     super();
@@ -63,15 +68,34 @@ class SharedSyncClientProvider extends AbstractSharedSyncClientProvider {
     return this.options.logger;
   }
 
-  log(record: LogRecord): void {
-    this.logger.log(record);
+  trace(...x: any[]): void {
+    this.logger?.trace(...x);
+  }
+  debug(...x: any[]): void {
+    this.logger?.debug(...x);
+  }
+  info(...x: any[]): void {
+    this.logger?.info(...x);
+  }
+  log(...x: any[]): void {
+    this.logger?.log(...x);
+  }
+  warn(...x: any[]): void {
+    this.logger?.warn(...x);
+  }
+  error(...x: any[]): void {
+    this.logger?.error(...x);
+  }
+  time(label: string): void {
+    this.logger?.time(label);
+  }
+  timeEnd(label: string): void {
+    this.logger?.timeEnd(label);
   }
 }
 
 export interface SharedWebStreamingSyncImplementationOptions extends WebStreamingSyncImplementationOptions {
-  logLevel: number;
   db: WebDBAdapter;
-  enableBroadcastLogs: boolean;
 }
 
 /**
@@ -80,30 +104,46 @@ export interface SharedWebStreamingSyncImplementationOptions extends WebStreamin
 export class SharedWebStreamingSyncImplementation extends WebStreamingSyncImplementation {
   protected syncManager: Comlink.Remote<WorkerClient>;
   protected clientProvider: SharedSyncClientProvider;
-  protected worker: WorkerConnection;
+  protected messagePort: MessagePort;
 
   protected isInitialized: Promise<void>;
   protected dbAdapter: WebDBAdapter;
   private abortOnClose = new AbortController();
-  private logLevel: number;
-  private enableBroadcastLogs: boolean;
 
   constructor(options: SharedWebStreamingSyncImplementationOptions) {
     super(options);
     this.dbAdapter = options.db;
-    this.logLevel = options.logLevel;
-    this.enableBroadcastLogs = options.enableBroadcastLogs;
+    /**
+     * Configure or connect to the shared sync worker.
+     * This worker will manage all syncing operations remotely.
+     */
+    const resolvedWorkerOptions = {
+      dbFilename: this.options.identifier!,
+      temporaryStorage: TemporaryStorageOption.MEMORY,
+      cacheSizeKb: DEFAULT_CACHE_SIZE_KB,
+      ...options,
+      flags: resolveWebSQLFlags(options.flags)
+    };
 
     const syncWorker = options.sync?.worker;
-    if (typeof syncWorker === 'function') {
-      this.worker = connectToExistingWorker(syncWorker(), 'sync');
+    if (syncWorker) {
+      if (typeof syncWorker === 'function') {
+        this.messagePort = syncWorker(resolvedWorkerOptions).port;
+      } else {
+        this.messagePort = new SharedWorker(`${syncWorker}`, {
+          /* @vite-ignore */
+          name: `shared-sync-${this.webOptions.identifier}`
+        }).port;
+      }
     } else {
-      this.worker = connectToWorker({
-        service: 'sync',
-        databaseIdentifier: this.webOptions.identifier!,
-        shared: true,
-        customWorker: syncWorker
-      });
+      this.messagePort = new SharedWorker(
+        new URL('../../worker/sync/SharedSyncImplementation.worker.js', import.meta.url),
+        {
+          /* @vite-ignore */
+          name: `shared-sync-${this.webOptions.identifier}`,
+          type: 'module'
+        }
+      ).port;
     }
 
     /**
@@ -111,21 +151,21 @@ export class SharedWebStreamingSyncImplementation extends WebStreamingSyncImplem
      */
     this.clientProvider = new SharedSyncClientProvider(
       this.webOptions,
-      ({ core, dataFlow }) => {
-        this.updateSyncStatus(core, dataFlow);
+      (status) => {
+        this.updateSyncStatus(status);
       },
       options.db
     );
 
-    this.syncManager = Comlink.wrap<WorkerClient>(this.worker.endpoint);
+    this.syncManager = Comlink.wrap<WorkerClient>(this.messagePort);
     /**
      * The sync worker will call this client provider when it needs
      * to fetch credentials or upload data.
      * This performs bi-directional method calling.
      */
-    Comlink.expose(this.clientProvider, this.worker.endpoint);
+    Comlink.expose(this.clientProvider, this.messagePort);
 
-    this.syncManager.setLogLevel(this.logLevel);
+    this.syncManager.setLogLevel(this.logger.getLevel());
 
     this.triggerCrudUpload = this.syncManager.triggerCrudUpload;
 
@@ -157,16 +197,18 @@ export class SharedWebStreamingSyncImplementation extends WebStreamingSyncImplem
     // Awaiting here ensures the worker is waiting for the lock
     await this.syncManager.addLockBasedCloseSignal(closeSignal);
 
-    const { identifier } = this.options;
+    const { crudUploadThrottleMs, identifier, retryDelayMs } = this.options;
+    const flags = { ...this.webOptions.flags, workers: undefined };
 
     await this.syncManager.setParams(
       {
         dbParams: this.dbAdapter.getConfiguration(),
         streamOptions: {
+          crudUploadThrottleMs,
           identifier,
-          serializedSchema: this.options.serializedSchema
-        },
-        enableBroadcastLogs: this.enableBroadcastLogs
+          retryDelayMs,
+          flags: flags
+        }
       },
       this.options.subscriptions
     );
@@ -176,9 +218,9 @@ export class SharedWebStreamingSyncImplementation extends WebStreamingSyncImplem
    * Starts the sync process, this effectively acts as a call to
    * `connect` if not yet connected.
    */
-  async connect(options: ResolvedSyncOptions): Promise<void> {
+  async connect(options?: PowerSyncConnectionOptions): Promise<void> {
     await this.waitForReady();
-    return this.syncManager.connect(options, this.options.serializedSchema);
+    return this.syncManager.connect(options);
   }
 
   async disconnect(): Promise<void> {
@@ -195,11 +237,8 @@ export class SharedWebStreamingSyncImplementation extends WebStreamingSyncImplem
     await this.waitForReady();
 
     await new Promise<void>((resolve) => {
-      // This will always be a message port since we use shared workers.
-      const messagePort = this.worker.endpoint as MessagePort;
-
       // Listen for the close acknowledgment from the worker
-      messagePort.addEventListener('message', (event) => {
+      this.messagePort.addEventListener('message', (event) => {
         const payload = event.data as ManualSharedSyncPayload;
         if (payload?.event === SharedSyncClientEvent.CLOSE_ACK) {
           resolve();
@@ -211,7 +250,7 @@ export class SharedWebStreamingSyncImplementation extends WebStreamingSyncImplem
         event: SharedSyncClientEvent.CLOSE_CLIENT,
         data: {}
       };
-      messagePort.postMessage(closeMessagePayload);
+      this.messagePort.postMessage(closeMessagePayload);
     });
 
     await super.dispose();
@@ -220,7 +259,7 @@ export class SharedWebStreamingSyncImplementation extends WebStreamingSyncImplem
 
     // Release the proxy
     this.syncManager[Comlink.releaseProxy]();
-    this.worker.close();
+    this.messagePort.close();
   }
 
   async waitForReady() {

package/src/db/sync/WebRemote.ts

@@ -1,40 +1,43 @@
-import { LogLevels, PowerSyncLogger } from '@powersync/common';
-import { AbstractRemote, FetchOptions, RemoteConnector } from '@powersync/shared-internals';
+import {
+  AbstractRemote,
+  AbstractRemoteOptions,
+  DEFAULT_REMOTE_LOGGER,
+  FetchImplementation,
+  FetchImplementationProvider,
+  ILogger,
+  RemoteConnector
+} from '@powersync/common';
 
 import { getUserAgentInfo } from './userAgent.js';
-import type { WebSocketSyncStreamPlatform, WebSocketSupport } from '@powersync/shared-internals/websockets';
+
+/*
+ * Depends on browser's implementation of global fetch.
+ */
+class WebFetchProvider extends FetchImplementationProvider {
+  getFetch(): FetchImplementation {
+    return fetch.bind(globalThis);
+  }
+}
 
 export class WebRemote extends AbstractRemote {
   constructor(
     protected connector: RemoteConnector,
-    logger: PowerSyncLogger
+    protected logger: ILogger = DEFAULT_REMOTE_LOGGER,
+    options?: Partial<AbstractRemoteOptions>
   ) {
-    super(connector, logger);
-  }
-
-  protected fetch({ resource, request }: FetchOptions): Promise<Response> {
-    return fetch(resource, request);
-  }
-
-  protected async loadWebSocketSupport(platform: WebSocketSyncStreamPlatform): Promise<WebSocketSupport> {
-    if (!websockets) {
-      // loadWebSocketSupport being called concurrently is safe, the import resolves to the same module in that case.
-      const module = await import('@powersync/shared-internals/websockets');
-      websockets = new module.WebSocketSupport(platform);
-    }
-
-    return websockets;
+    super(connector, logger, {
+      ...(options ?? {}),
+      fetchImplementation: options?.fetchImplementation ?? new WebFetchProvider()
+    });
   }
 
   getUserAgent(): string {
     let ua = [super.getUserAgent(), `powersync-web`];
     try {
       ua.push(...getUserAgentInfo());
-    } catch (error) {
-      this.logger.log({ level: LogLevels.warn, message: 'Failed to get user agent info', error });
+    } catch (e) {
+      this.logger.warn('Failed to get user agent info', e);
     }
     return ua.join(' ');
   }
 }
-
-let websockets: WebSocketSupport | undefined;

package/src/db/sync/WebStreamingSyncImplementation.ts

@@ -1,15 +1,16 @@
-import { LogLevels } from '@powersync/common';
 import {
   AbstractStreamingSyncImplementation,
   AbstractStreamingSyncImplementationOptions,
   LockOptions,
   LockType
-} from '@powersync/shared-internals';
+} from '@powersync/common';
 import { getNavigatorLocks } from '../../shared/navigator.js';
+import { ResolvedWebSQLOpenOptions, WebSQLFlags } from '../adapters/web-sql-flags.js';
 
 export interface WebStreamingSyncImplementationOptions extends AbstractStreamingSyncImplementationOptions {
+  flags?: WebSQLFlags;
   sync?: {
-    worker?: string | URL | (() => SharedWorker);
+    worker?: string | URL | ((options: ResolvedWebSQLOpenOptions) => SharedWorker);
   };
 }
 
@@ -26,7 +27,7 @@ export class WebStreamingSyncImplementation extends AbstractStreamingSyncImpleme
   async obtainLock<T>(lockOptions: LockOptions<T>): Promise<T> {
     const identifier = `streaming-sync-${lockOptions.type}-${this.webOptions.identifier}`;
     if (lockOptions.type == LockType.SYNC) {
-      this.logger.log({ level: LogLevels.debug, message: `requesting lock for ${identifier}` });
+      this.logger.debug('requesting lock for ', identifier);
     }
     return getNavigatorLocks().request(identifier, { signal: lockOptions.signal }, lockOptions.callback);
   }

package/src/index.ts

@@ -1,8 +1,10 @@
 export * from '@powersync/common';
 export * from './attachments/IndexDBFileSystemAdapter.js';
+export * from './db/adapters/AbstractWebPowerSyncDatabaseOpenFactory.js';
 export { WASQLiteVFS } from './db/adapters/wa-sqlite/vfs.js';
 export * from './db/adapters/wa-sqlite/WASQLiteOpenFactory.js';
-export * from './db/adapters/options.js';
+export * from './db/adapters/wa-sqlite/WASQLitePowerSyncDatabaseOpenFactory.js';
+export * from './db/adapters/web-sql-flags.js';
 export * from './db/PowerSyncDatabase.js';
 export * from './db/sync/SharedWebStreamingSyncImplementation.js';
 export * from './db/sync/WebRemote.js';

package/src/worker/db/MultiDatabaseServer.ts

@@ -1,38 +1,28 @@
-import { LogLevels, PowerSyncLogger } from '@powersync/common';
+import { ILogger } from '@powersync/common';
 import * as Comlink from 'comlink';
 import { ClientConnectionView, DatabaseServer } from '../../db/adapters/wa-sqlite/DatabaseServer.js';
+import {
+  ResolvedWASQLiteOpenFactoryOptions,
+  WorkerDBOpenerOptions
+} from '../../db/adapters/wa-sqlite/WASQLiteOpenFactory.js';
 import { getNavigatorLocks } from '../../shared/navigator.js';
-import { RawSqliteConnection, RawWaSqliteDatabaseOptions } from '../../db/adapters/wa-sqlite/RawSqliteConnection.js';
+import { RawSqliteConnection } from '../../db/adapters/wa-sqlite/RawSqliteConnection.js';
 import { ConcurrentSqliteConnection } from '../../db/adapters/wa-sqlite/ConcurrentConnection.js';
+import { WASQLiteVFS } from '../../db/adapters/wa-sqlite/vfs.js';
 
 const OPEN_DB_LOCK = 'open-wasqlite-db';
 
-export interface ConnectToMultiDatabaseServerOptions {
-  logLevel: number;
-  database: RawWaSqliteDatabaseOptions;
-  lockName: string;
-}
-
 /**
  * Shared state to manage multiple database connections hosted by a worker.
  */
 export class MultiDatabaseServer {
   private activeDatabases = new Map<string, DatabaseServer>();
 
-  constructor(readonly logger: PowerSyncLogger) {}
+  constructor(readonly logger: ILogger) {}
 
-  async handleConnection({
-    logLevel,
-    database,
-    lockName
-  }: ConnectToMultiDatabaseServerOptions): Promise<ClientConnectionView> {
-    const logger: PowerSyncLogger = {
-      log: (record) => {
-        if (record.level >= logLevel) this.logger.log(record);
-      }
-    };
-
-    return Comlink.proxy(await this.openConnectionLocally(logger, database, lockName));
+  async handleConnection(options: WorkerDBOpenerOptions): Promise<ClientConnectionView> {
+    this.logger.setLevel(options.logLevel);
+    return Comlink.proxy(await this.openConnectionLocally(options, options.lockName));
   }
 
   async connectToExisting(name: string, lockName: string): Promise<ClientConnectionView> {
@@ -46,7 +36,7 @@ export class MultiDatabaseServer {
     });
   }
 
-  async openConnectionLocally(logger: PowerSyncLogger, options: RawWaSqliteDatabaseOptions, lockName?: string) {
+  async openConnectionLocally(options: ResolvedWASQLiteOpenFactoryOptions, lockName?: string) {
     // Especially on Firefox, we're sometimes seeing "NoModificationAllowedError"s when opening OPFS databases we can
     // work around by retrying.
     const maxAttempts = 3;
@@ -54,35 +44,29 @@ export class MultiDatabaseServer {
 
     for (let count = 0; count < maxAttempts - 1; count++) {
       try {
-        server = await this.databaseOpenAttempt(logger, options);
-      } catch (error) {
-        this.logger.log({
-          level: LogLevels.warn,
-          message: `Attempt ${count + 1} of ${maxAttempts} to open database failed, retrying in 1 second...`,
-          error
-        });
+        server = await this.databaseOpenAttempt(options);
+      } catch (ex) {
+        this.logger.warn(`Attempt ${count + 1} of ${maxAttempts} to open database failed, retrying in 1 second...`, ex);
         await new Promise((resolve) => setTimeout(resolve, 1000));
       }
     }
 
     // Final attempt if we haven't been able to open the server - rethrow errors if we still can't open.
-    server ??= await this.databaseOpenAttempt(logger, options);
+    server ??= await this.databaseOpenAttempt(options);
     return server.connect(lockName);
   }
 
-  private async databaseOpenAttempt(
-    logger: PowerSyncLogger,
-    options: RawWaSqliteDatabaseOptions
-  ): Promise<DatabaseServer> {
+  private async databaseOpenAttempt(options: ResolvedWASQLiteOpenFactoryOptions): Promise<DatabaseServer> {
     return getNavigatorLocks().request(OPEN_DB_LOCK, async () => {
-      const { filename } = options;
+      const { dbFilename, isReadOnly, vfs } = options;
 
-      let server: DatabaseServer | undefined = this.activeDatabases.get(filename);
+      let server: DatabaseServer | undefined = this.activeDatabases.get(dbFilename);
       if (server == null) {
         // We don't need navigator locks for shared workers because all queries run in this shared worker exclusively.
         // For read-only connections, we use a VFS that supports concurrent reads (so a single lock on the connection is
-        // fine).
-        const needsNavigatorLocks = !(isSharedWorker || options.readonly);
+        // fine). In-memory databases either run in a shared worker or aren't shared across tabs at all, so the internal
+        // lock is enough.
+        const needsNavigatorLocks = !(isSharedWorker || isReadOnly || vfs == WASQLiteVFS.InMemoryVfs);
         const connection = new RawSqliteConnection(options);
         const withSafeConcurrency = new ConcurrentSqliteConnection(connection, needsNavigatorLocks);
 
@@ -99,13 +83,13 @@ export class MultiDatabaseServer {
         }
         returnLease();
 
-        const onClose = () => this.activeDatabases.delete(filename);
+        const onClose = () => this.activeDatabases.delete(dbFilename);
         server = new DatabaseServer({
           inner: withSafeConcurrency,
-          logger,
+          logger: this.logger,
           onClose
         });
-        this.activeDatabases.set(filename, server);
+        this.activeDatabases.set(dbFilename, server);
       }
 
       return server;

package/src/worker/db/WASQLiteDB.worker.ts

@@ -0,0 +1,35 @@
+/**
+ * Supports both shared and dedicated workers, based on how the worker is constructed (new SharedWorker vs new Worker()).
+ */
+
+import '@journeyapps/wa-sqlite';
+import { createBaseLogger, createLogger } from '@powersync/common';
+import * as Comlink from 'comlink';
+import { isSharedWorker, MultiDatabaseServer } from './MultiDatabaseServer.js';
+import { OpenWorkerConnection } from '../../db/adapters/wa-sqlite/DatabaseClient.js';
+
+const baseLogger = createBaseLogger();
+baseLogger.useDefaults();
+const logger = createLogger('db-worker');
+
+const server = new MultiDatabaseServer(logger);
+const exposedFunctions: OpenWorkerConnection = {
+  connect: (config) => server.handleConnection(config),
+  connectToExisting: ({ identifier, lockName }) => server.connectToExisting(identifier, lockName)
+};
+
+// Check if we're in a SharedWorker context
+if (isSharedWorker) {
+  const _self: SharedWorkerGlobalScope = self as any;
+  _self.onconnect = function (event: MessageEvent<string>) {
+    const port = event.ports[0];
+    Comlink.expose(exposedFunctions, port);
+  };
+} else {
+  // A dedicated worker can be shared externally
+  Comlink.expose(exposedFunctions);
+}
+
+addEventListener('unload', () => {
+  server.closeAll();
+});

package/src/worker/db/open-worker-database.ts

@@ -0,0 +1,62 @@
+import * as Comlink from 'comlink';
+import { vfsRequiresDedicatedWorkers, WASQLiteVFS } from '../../db/adapters/wa-sqlite/vfs.js';
+import { OpenWorkerConnection } from '../../db/adapters/wa-sqlite/DatabaseClient.js';
+
+/**
+ * Opens a shared or dedicated worker which exposes opening of database connections
+ */
+export function openWorkerDatabasePort(
+  workerIdentifier: string,
+  multipleTabs = true,
+  worker: string | URL = '',
+  vfs?: WASQLiteVFS
+) {
+  const needsDedicated = vfs && vfsRequiresDedicatedWorkers(vfs);
+
+  if (worker) {
+    return !needsDedicated && multipleTabs
+      ? new SharedWorker(`${worker}`, {
+          /* @vite-ignore */
+          name: `shared-DB-worker-${workerIdentifier}`
+        }).port
+      : new Worker(`${worker}`, {
+          /* @vite-ignore */
+          name: `DB-worker-${workerIdentifier}`
+        });
+  } else {
+    /**
+     *  Webpack V5 can bundle the worker automatically if the full Worker constructor syntax is used
+     *  https://webpack.js.org/guides/web-workers/
+     *  This enables multi tab support by default, but falls back if SharedWorker is not available
+     *  (in the case of Android)
+     */
+    return !needsDedicated && multipleTabs
+      ? new SharedWorker(new URL('./WASQLiteDB.worker.js', import.meta.url), {
+          /* @vite-ignore */
+          name: `shared-DB-worker-${workerIdentifier}`,
+          type: 'module'
+        }).port
+      : new Worker(new URL('./WASQLiteDB.worker.js', import.meta.url), {
+          /* @vite-ignore */
+          name: `DB-worker-${workerIdentifier}`,
+          type: 'module'
+        });
+  }
+}
+
+/**
+ * @returns A function which allows for opening database connections inside
+ * a worker.
+ */
+export function getWorkerDatabaseOpener(workerIdentifier: string, multipleTabs = true, worker: string | URL = '') {
+  return Comlink.wrap<OpenWorkerConnection>(openWorkerDatabasePort(workerIdentifier, multipleTabs, worker));
+}
+
+export function resolveWorkerDatabasePortFactory(worker: () => Worker | SharedWorker) {
+  const workerInstance = worker();
+  return isSharedWorker(workerInstance) ? workerInstance.port : workerInstance;
+}
+
+export function isSharedWorker(worker: Worker | SharedWorker): worker is SharedWorker {
+  return 'port' in worker;
+}

package/src/worker/sync/AbstractSharedSyncClientProvider.ts

@@ -1,5 +1,4 @@
-import type { LogRecord, PowerSyncCredentials } from '@powersync/common';
-import { SyncStatusJson } from '@powersync/shared-internals';
+import type { PowerSyncCredentials, SyncStatusOptions } from '@powersync/common';
 
 /**
  * The client side port should provide these methods.
@@ -8,8 +7,15 @@ export abstract class AbstractSharedSyncClientProvider {
   abstract fetchCredentials(): Promise<PowerSyncCredentials | null>;
   abstract invalidateCredentials(): void;
   abstract uploadCrud(): Promise<void>;
-  abstract statusChanged(status: SyncStatusJson): void;
+  abstract statusChanged(status: SyncStatusOptions): void;
   abstract getDBWorkerPort(): Promise<MessagePort>;
 
-  abstract log(record: LogRecord): void;
+  abstract trace(...x: any[]): void;
+  abstract debug(...x: any[]): void;
+  abstract info(...x: any[]): void;
+  abstract log(...x: any[]): void;
+  abstract warn(...x: any[]): void;
+  abstract error(...x: any[]): void;
+  abstract time(label: string): void;
+  abstract timeEnd(label: string): void;
 }