react-websocket 3.3.0 → 3.5.0

package/dist/core.d.cts

@@ -111,14 +111,42 @@ interface SendOptions {
   volatile?: boolean;
   /**
    * Keep only the newest queued message with this key. Sending again with the same key
-   * while disconnected replaces the earlier one, which moves to the back of the queue.
+   * while disconnected replaces the earlier one, which moves to the back of the queue
+   * (or of the `priority` messages, for a priority one).
    * For state where only the latest value matters, such as "my position is now (x, y)".
    */
   key?: string;
+  /**
+   * Queue this message ahead of every message queued without `priority`, after earlier
+   * priority messages. For control messages that must not wait behind a backlog, such as
+   * cancel, interrupt or a token refresh. Messages sent from `open` listeners still go first.
+   *
+   * It only matters while the socket isn't open: once a message is handed to the browser,
+   * nothing can overtake it. To keep that buffer short, send bulky streams with `maxBuffered`.
+   * @default false
+   */
+  priority?: boolean;
+  /**
+   * Drop the message instead of sending it while more than this many bytes are already
+   * waiting in the browser's send buffer (`socket.bufferedAmount`). For high-rate streams on
+   * a slow link, such as audio frames or per-tick input, where a late message is worse than
+   * none. `send()` returns `false`, and `onDrop` isn't called.
+   *
+   * Only checked while the socket is open: a message queued while disconnected is sent on
+   * open regardless. `bufferedAmount` includes what you sent earlier in the same task, so set
+   * it well above one burst of messages.
+   *
+   * @example
+   * ```ts
+   * voice.send(frame, { volatile: true, maxBuffered: 64 * 1024 });
+   * ```
+   */
+  maxBuffered?: number;
   /**
    * Called if the message is dropped from the queue without being sent: replaced by a
    * newer message with the same `key`, or evicted by `queue.limit`. Not called when the
-   * queue is cleared because the client closed or gave up.
+   * queue is cleared because the client closed or gave up, or when `send()` drops the
+   * message right away (`volatile` while not open, or `maxBuffered`) and returns `false`.
    */
   onDrop?: () => void;
 }
@@ -126,7 +154,7 @@ interface SendOptions {
 interface QueueOptions {
   /**
    * Maximum number of messages held while not connected. When full, the oldest
-   * message is dropped.
+   * message is dropped, skipping `priority` messages unless nothing else is queued.
    * @default Infinity
    */
   limit?: number;
@@ -309,12 +337,14 @@ interface WebSocketClient<In = unknown, Out = unknown> {
    * Send a message (encoded with `serialize`/`json` if configured). If the socket isn't
    * open, the message is queued and sent on open (see the `queue` option), unless
    * `options.volatile` is set.
-   * @returns `true` if it was sent immediately, `false` if it was queued or dropped.
+   * @returns `true` if it was sent immediately, `false` if it was queued or dropped
+   *   (`volatile` while not open, or `maxBuffered` while open).
    *
    * @example
    * ```ts
    * game.send({ type: 'input', dx, dy }, { volatile: true }); // never replayed after a reconnect
    * game.send({ type: 'position', x, y }, { key: 'position' }); // only the newest is queued
+   * game.send({ type: 'leave' }, { priority: true }); // ahead of everything already queued
    * ```
    */
   send(message: Out, options?: SendOptions): boolean;
@@ -649,6 +679,85 @@ interface WebSocketResponder<P = unknown, R = unknown> {
  */
 export declare function createWebSocketResponder<Q extends RequestFields, R, In, const Out>(client: WebSocketClient<In, Out>, options: WebSocketResponderOptions<Q, R, NoInfer<In>, NoInfer<Out>>): WebSocketResponder<ParamsOf<Q>, R>;
 //#endregion
+//#region src/sendrate.d.ts
+/** Options for {@link createWebSocketSendRate}. */
+interface WebSocketSendRateOptions {
+  /**
+   * Ticks per second while the connection keeps up.
+   * @default 30
+   */
+  maxRate?: number;
+  /**
+   * The rate never drops below this, in ticks per second.
+   * @default 5
+   */
+  minRate?: number;
+  /**
+   * Bytes waiting in the browser's send buffer (`socket.bufferedAmount`) above which a tick
+   * sends nothing and the rate halves.
+   * @default 1024
+   */
+  maxBuffered?: number;
+  /**
+   * Measurements from `createWebSocketLatency` on the same client. With them, a round-trip time
+   * that rises also lowers the rate. Without them, only the send buffer is watched.
+   */
+  latency?: Pick<WebSocketLatency, 'getSnapshot'>;
+  /**
+   * How far `rtt` may rise above the lowest one measured on this connection before the rate
+   * halves, in ms. A steady high ping keeps the full rate; only a rising one counts.
+   * @default 100
+   */
+  maxRttIncrease?: number;
+}
+/** The current send rate. A new object is created on every change. */
+interface SendRate {
+  /** Ticks per second, rounded. */
+  readonly rate: number;
+  /**
+   * Whether the last tick found the link congested: the send buffer above `maxBuffered`, or
+   * `rtt` risen more than `maxRttIncrease`.
+   */
+  readonly congested: boolean;
+}
+/** Keyed sends coalesced at a rate that adapts to the link. Create with {@link createWebSocketSendRate}. */
+interface WebSocketSendRate<Out> {
+  /** The client the messages are sent on. */
+  readonly client: WebSocketClient<any, Out>;
+  /**
+   * Send `message` at the next tick. A message with the same `key` still waiting for it is
+   * replaced, so only the newest one goes out. Sent with `volatile`.
+   */
+  send(message: Out, key: string): void;
+  /** Send everything waiting now, e.g. right before a one-shot action that must carry the latest aim. */
+  flush(): void;
+  /** The current {@link SendRate}. Returns the same object until it changes. */
+  getSnapshot(): SendRate;
+  /** Called whenever the rate or `congested` changes. Compatible with `useSyncExternalStore`. */
+  subscribe(listener: () => void): () => void;
+  /** Stop sending and listening. Only needed for instances created dynamically. */
+  dispose(): void;
+}
+/**
+ * Send high-rate state, such as aim, cursor or position, at a rate that adapts to the
+ * connection. Messages are coalesced per key between ticks. The rate drops by half when the
+ * send buffer fills up or the round trip grows, and climbs back one tick per second at a time
+ * when the link keeps up, so players on a poor connection degrade smoothly instead of building
+ * up lag.
+ *
+ * Ticks run only while the socket is open and something is waiting. Messages waiting during a
+ * reconnect go out after it; `close()` drops them. It doesn't open the connection by itself.
+ *
+ * @example
+ * ```ts
+ * export const stream = createWebSocketSendRate(game, { latency, maxRate: 30 });
+ *
+ * // On every pointer move: at most 30 a second, fewer on a congested link.
+ * stream.send({ type: 'aim', angle }, 'aim');
+ * ```
+ */
+export declare function createWebSocketSendRate<Out>(client: WebSocketClient<any, Out>, options?: WebSocketSendRateOptions): WebSocketSendRate<Out>;
+//#endregion
 //#region src/state.d.ts
 /** Options for {@link createWebSocketState}. */
 interface WebSocketStateOptions<S, In> {
@@ -659,6 +768,17 @@ interface WebSocketStateOptions<S, In> {
    * change, or the same `state` to ignore the message (subscribers aren't notified).
    */
   reduce: (state: S, message: In) => S;
+  /**
+   * `'frame'`: notify subscribers at most once per animation frame instead of once per
+   * message, so a fast stream (tokens, tickers, game state) renders once per frame.
+   * `getState()` is always current; only notifications wait. `setState` and `reset` still
+   * notify right away.
+   *
+   * Browsers pause animation frames in background tabs: the state keeps up, and subscribers
+   * hear about it when the tab is visible again. Without `requestAnimationFrame` (Node, some
+   * workers), it waits about 16 ms instead.
+   */
+  batch?: 'frame';
 }
 /**
  * State derived from a client's messages. Read it with `useWebSocketState(store, selector)`,
@@ -748,5 +868,5 @@ interface WebSocketTopics {
  */
 export declare function createWebSocketTopics<const Out>(client: WebSocketClient<any, Out>, options: WebSocketTopicsOptions<NoInfer<Out>>): WebSocketTopics;
 //#endregion
-export type { CloseInfo, EventMap, HeartbeatOptions, IncomingRequest, Latency, QueueOptions, ReconnectOptions, RequestHandler, RequestOptions, SendData, SendOptions, Snapshot, StandardSchemaV1, Status, UrlSource, WebSocketClient, WebSocketLatency, WebSocketLatencyOptions, WebSocketOptions, WebSocketRequests, WebSocketRequestsOptions, WebSocketResponder, WebSocketResponderOptions, WebSocketState, WebSocketStateOptions, WebSocketTopics, WebSocketTopicsOptions };
+export type { CloseInfo, EventMap, HeartbeatOptions, IncomingRequest, Latency, QueueOptions, ReconnectOptions, RequestHandler, RequestOptions, SendData, SendOptions, SendRate, Snapshot, StandardSchemaV1, Status, UrlSource, WebSocketClient, WebSocketLatency, WebSocketLatencyOptions, WebSocketOptions, WebSocketRequests, WebSocketRequestsOptions, WebSocketResponder, WebSocketResponderOptions, WebSocketSendRate, WebSocketSendRateOptions, WebSocketState, WebSocketStateOptions, WebSocketTopics, WebSocketTopicsOptions };
 //# sourceMappingURL=core.d.cts.map

package/dist/core.d.ts

@@ -111,14 +111,42 @@ interface SendOptions {
   volatile?: boolean;
   /**
    * Keep only the newest queued message with this key. Sending again with the same key
-   * while disconnected replaces the earlier one, which moves to the back of the queue.
+   * while disconnected replaces the earlier one, which moves to the back of the queue
+   * (or of the `priority` messages, for a priority one).
    * For state where only the latest value matters, such as "my position is now (x, y)".
    */
   key?: string;
+  /**
+   * Queue this message ahead of every message queued without `priority`, after earlier
+   * priority messages. For control messages that must not wait behind a backlog, such as
+   * cancel, interrupt or a token refresh. Messages sent from `open` listeners still go first.
+   *
+   * It only matters while the socket isn't open: once a message is handed to the browser,
+   * nothing can overtake it. To keep that buffer short, send bulky streams with `maxBuffered`.
+   * @default false
+   */
+  priority?: boolean;
+  /**
+   * Drop the message instead of sending it while more than this many bytes are already
+   * waiting in the browser's send buffer (`socket.bufferedAmount`). For high-rate streams on
+   * a slow link, such as audio frames or per-tick input, where a late message is worse than
+   * none. `send()` returns `false`, and `onDrop` isn't called.
+   *
+   * Only checked while the socket is open: a message queued while disconnected is sent on
+   * open regardless. `bufferedAmount` includes what you sent earlier in the same task, so set
+   * it well above one burst of messages.
+   *
+   * @example
+   * ```ts
+   * voice.send(frame, { volatile: true, maxBuffered: 64 * 1024 });
+   * ```
+   */
+  maxBuffered?: number;
   /**
    * Called if the message is dropped from the queue without being sent: replaced by a
    * newer message with the same `key`, or evicted by `queue.limit`. Not called when the
-   * queue is cleared because the client closed or gave up.
+   * queue is cleared because the client closed or gave up, or when `send()` drops the
+   * message right away (`volatile` while not open, or `maxBuffered`) and returns `false`.
    */
   onDrop?: () => void;
 }
@@ -126,7 +154,7 @@ interface SendOptions {
 interface QueueOptions {
   /**
    * Maximum number of messages held while not connected. When full, the oldest
-   * message is dropped.
+   * message is dropped, skipping `priority` messages unless nothing else is queued.
    * @default Infinity
    */
   limit?: number;
@@ -309,12 +337,14 @@ interface WebSocketClient<In = unknown, Out = unknown> {
    * Send a message (encoded with `serialize`/`json` if configured). If the socket isn't
    * open, the message is queued and sent on open (see the `queue` option), unless
    * `options.volatile` is set.
-   * @returns `true` if it was sent immediately, `false` if it was queued or dropped.
+   * @returns `true` if it was sent immediately, `false` if it was queued or dropped
+   *   (`volatile` while not open, or `maxBuffered` while open).
    *
    * @example
    * ```ts
    * game.send({ type: 'input', dx, dy }, { volatile: true }); // never replayed after a reconnect
    * game.send({ type: 'position', x, y }, { key: 'position' }); // only the newest is queued
+   * game.send({ type: 'leave' }, { priority: true }); // ahead of everything already queued
    * ```
    */
   send(message: Out, options?: SendOptions): boolean;
@@ -649,6 +679,85 @@ interface WebSocketResponder<P = unknown, R = unknown> {
  */
 export declare function createWebSocketResponder<Q extends RequestFields, R, In, const Out>(client: WebSocketClient<In, Out>, options: WebSocketResponderOptions<Q, R, NoInfer<In>, NoInfer<Out>>): WebSocketResponder<ParamsOf<Q>, R>;
 //#endregion
+//#region src/sendrate.d.ts
+/** Options for {@link createWebSocketSendRate}. */
+interface WebSocketSendRateOptions {
+  /**
+   * Ticks per second while the connection keeps up.
+   * @default 30
+   */
+  maxRate?: number;
+  /**
+   * The rate never drops below this, in ticks per second.
+   * @default 5
+   */
+  minRate?: number;
+  /**
+   * Bytes waiting in the browser's send buffer (`socket.bufferedAmount`) above which a tick
+   * sends nothing and the rate halves.
+   * @default 1024
+   */
+  maxBuffered?: number;
+  /**
+   * Measurements from `createWebSocketLatency` on the same client. With them, a round-trip time
+   * that rises also lowers the rate. Without them, only the send buffer is watched.
+   */
+  latency?: Pick<WebSocketLatency, 'getSnapshot'>;
+  /**
+   * How far `rtt` may rise above the lowest one measured on this connection before the rate
+   * halves, in ms. A steady high ping keeps the full rate; only a rising one counts.
+   * @default 100
+   */
+  maxRttIncrease?: number;
+}
+/** The current send rate. A new object is created on every change. */
+interface SendRate {
+  /** Ticks per second, rounded. */
+  readonly rate: number;
+  /**
+   * Whether the last tick found the link congested: the send buffer above `maxBuffered`, or
+   * `rtt` risen more than `maxRttIncrease`.
+   */
+  readonly congested: boolean;
+}
+/** Keyed sends coalesced at a rate that adapts to the link. Create with {@link createWebSocketSendRate}. */
+interface WebSocketSendRate<Out> {
+  /** The client the messages are sent on. */
+  readonly client: WebSocketClient<any, Out>;
+  /**
+   * Send `message` at the next tick. A message with the same `key` still waiting for it is
+   * replaced, so only the newest one goes out. Sent with `volatile`.
+   */
+  send(message: Out, key: string): void;
+  /** Send everything waiting now, e.g. right before a one-shot action that must carry the latest aim. */
+  flush(): void;
+  /** The current {@link SendRate}. Returns the same object until it changes. */
+  getSnapshot(): SendRate;
+  /** Called whenever the rate or `congested` changes. Compatible with `useSyncExternalStore`. */
+  subscribe(listener: () => void): () => void;
+  /** Stop sending and listening. Only needed for instances created dynamically. */
+  dispose(): void;
+}
+/**
+ * Send high-rate state, such as aim, cursor or position, at a rate that adapts to the
+ * connection. Messages are coalesced per key between ticks. The rate drops by half when the
+ * send buffer fills up or the round trip grows, and climbs back one tick per second at a time
+ * when the link keeps up, so players on a poor connection degrade smoothly instead of building
+ * up lag.
+ *
+ * Ticks run only while the socket is open and something is waiting. Messages waiting during a
+ * reconnect go out after it; `close()` drops them. It doesn't open the connection by itself.
+ *
+ * @example
+ * ```ts
+ * export const stream = createWebSocketSendRate(game, { latency, maxRate: 30 });
+ *
+ * // On every pointer move: at most 30 a second, fewer on a congested link.
+ * stream.send({ type: 'aim', angle }, 'aim');
+ * ```
+ */
+export declare function createWebSocketSendRate<Out>(client: WebSocketClient<any, Out>, options?: WebSocketSendRateOptions): WebSocketSendRate<Out>;
+//#endregion
 //#region src/state.d.ts
 /** Options for {@link createWebSocketState}. */
 interface WebSocketStateOptions<S, In> {
@@ -659,6 +768,17 @@ interface WebSocketStateOptions<S, In> {
    * change, or the same `state` to ignore the message (subscribers aren't notified).
    */
   reduce: (state: S, message: In) => S;
+  /**
+   * `'frame'`: notify subscribers at most once per animation frame instead of once per
+   * message, so a fast stream (tokens, tickers, game state) renders once per frame.
+   * `getState()` is always current; only notifications wait. `setState` and `reset` still
+   * notify right away.
+   *
+   * Browsers pause animation frames in background tabs: the state keeps up, and subscribers
+   * hear about it when the tab is visible again. Without `requestAnimationFrame` (Node, some
+   * workers), it waits about 16 ms instead.
+   */
+  batch?: 'frame';
 }
 /**
  * State derived from a client's messages. Read it with `useWebSocketState(store, selector)`,
@@ -748,5 +868,5 @@ interface WebSocketTopics {
  */
 export declare function createWebSocketTopics<const Out>(client: WebSocketClient<any, Out>, options: WebSocketTopicsOptions<NoInfer<Out>>): WebSocketTopics;
 //#endregion
-export type { CloseInfo, EventMap, HeartbeatOptions, IncomingRequest, Latency, QueueOptions, ReconnectOptions, RequestHandler, RequestOptions, SendData, SendOptions, Snapshot, StandardSchemaV1, Status, UrlSource, WebSocketClient, WebSocketLatency, WebSocketLatencyOptions, WebSocketOptions, WebSocketRequests, WebSocketRequestsOptions, WebSocketResponder, WebSocketResponderOptions, WebSocketState, WebSocketStateOptions, WebSocketTopics, WebSocketTopicsOptions };
+export type { CloseInfo, EventMap, HeartbeatOptions, IncomingRequest, Latency, QueueOptions, ReconnectOptions, RequestHandler, RequestOptions, SendData, SendOptions, SendRate, Snapshot, StandardSchemaV1, Status, UrlSource, WebSocketClient, WebSocketLatency, WebSocketLatencyOptions, WebSocketOptions, WebSocketRequests, WebSocketRequestsOptions, WebSocketResponder, WebSocketResponderOptions, WebSocketSendRate, WebSocketSendRateOptions, WebSocketState, WebSocketStateOptions, WebSocketTopics, WebSocketTopicsOptions };
 //# sourceMappingURL=core.d.ts.map

package/dist/core.js

@@ -348,13 +348,18 @@ function createClient(url, options = {}) {
 		set({ lastMessage: message });
 		emit("message", message, event);
 	}
-	function send(message, sendOptions) {
+	function send(message, sendOptions = {}) {
 		const data = options.serialize ? options.serialize(message) : options.json ? JSON.stringify(message) : message;
+		const { key, priority, maxBuffered } = sendOptions;
 		if (ws && ws.readyState === OPEN) {
+			if (maxBuffered !== void 0 && ws.bufferedAmount > maxBuffered) {
+				log("dropped message: send buffer above maxBuffered");
+				return false;
+			}
 			ws.send(data);
 			return true;
 		}
-		if (queueLimit === 0 || sendOptions?.volatile) {
+		if (queueLimit === 0 || sendOptions.volatile) {
 			log("dropped message: socket is not open");
 			return false;
 		}
@@ -362,19 +367,23 @@ function createClient(url, options = {}) {
 			log("dropped message: no WebSocket implementation available");
 			return false;
 		}
-		const key = sendOptions?.key;
 		if (key !== void 0) pending = pending.filter((entry) => {
 			if (entry.key !== key) return true;
 			dropped(entry);
 			return false;
 		});
-		pending.push({
+		let head = pending.findIndex((entry) => !entry.priority);
+		if (head < 0) head = pending.length;
+		const entry = {
 			data,
 			key,
-			onDrop: sendOptions?.onDrop
-		});
+			priority,
+			onDrop: sendOptions.onDrop
+		};
+		if (priority) pending.splice(head++, 0, entry);
+		else pending.push(entry);
 		if (pending.length > queueLimit) {
-			dropped(pending.shift());
+			dropped(pending.splice(head < pending.length ? head : 0, 1)[0]);
 			log(`dropped oldest queued message: queue limit (${queueLimit}) reached`);
 		}
 		return false;
@@ -743,6 +752,7 @@ function createWebSocketRequests(client, options) {
 					return;
 				}
 				if (sent) entry.socket = client.socket;
+				else if (client.socket?.readyState === 1) entry.reject(/* @__PURE__ */ new Error("WebSocket send buffer is full: request dropped"));
 				else if (requestOptions.volatile) entry.reject(/* @__PURE__ */ new Error("WebSocket is not open: request dropped"));
 			});
 		},
@@ -755,7 +765,7 @@ function createWebSocketRequests(client, options) {
 }
 //#endregion
 //#region src/responder.ts
-const VOLATILE = { volatile: true };
+const VOLATILE$1 = { volatile: true };
 const abortError = (message) => new DOMException(message, "AbortError");
 /**
 * Answer requests the server sends: run a handler for tools that only exist in the browser
@@ -796,9 +806,9 @@ function createWebSocketResponder(client, options) {
 	/** Send a reply, or an `error` reply if building or encoding it throws. */
 	function reply(id, build) {
 		try {
-			return client.send(build(), VOLATILE);
+			return client.send(build(), VOLATILE$1);
 		} catch (error) {
-			return client.send(options.error(id, error), VOLATILE);
+			return client.send(options.error(id, error), VOLATILE$1);
 		}
 	}
 	function receive(incoming) {
@@ -897,6 +907,123 @@ function createWebSocketResponder(client, options) {
 	};
 }
 //#endregion
+//#region src/sendrate.ts
+const VOLATILE = { volatile: true };
+/**
+* Send high-rate state, such as aim, cursor or position, at a rate that adapts to the
+* connection. Messages are coalesced per key between ticks. The rate drops by half when the
+* send buffer fills up or the round trip grows, and climbs back one tick per second at a time
+* when the link keeps up, so players on a poor connection degrade smoothly instead of building
+* up lag.
+*
+* Ticks run only while the socket is open and something is waiting. Messages waiting during a
+* reconnect go out after it; `close()` drops them. It doesn't open the connection by itself.
+*
+* @example
+* ```ts
+* export const stream = createWebSocketSendRate(game, { latency, maxRate: 30 });
+*
+* // On every pointer move: at most 30 a second, fewer on a congested link.
+* stream.send({ type: 'aim', angle }, 'aim');
+* ```
+*/
+function createWebSocketSendRate(client, options = {}) {
+	const { maxBuffered = 1024, latency, maxRttIncrease = 100 } = options;
+	const maxRate = options.maxRate ?? 30;
+	const minRate = Math.min(options.minRate ?? 5, maxRate);
+	const listeners = /* @__PURE__ */ new Set();
+	const pending = /* @__PURE__ */ new Map();
+	let rate = maxRate;
+	let snapshot = {
+		rate: maxRate,
+		congested: false
+	};
+	let last = -Infinity;
+	let best = Infinity;
+	let slow = false;
+	let measured;
+	let timer;
+	let disposed = false;
+	function flush() {
+		for (const [key, message] of pending) {
+			if (!client.send(message, VOLATILE)) return;
+			pending.delete(key);
+		}
+	}
+	function publish(congested) {
+		const rounded = Math.round(rate);
+		if (rounded === snapshot.rate && congested === snapshot.congested) return;
+		snapshot = {
+			rate: rounded,
+			congested
+		};
+		for (const listener of [...listeners]) listener();
+	}
+	function schedule() {
+		if (disposed || timer !== void 0 || !pending.size || client.getSnapshot().status !== "open") return;
+		timer = setTimeout(tick, Math.max(0, last + 1e3 / rate - performance.now()));
+	}
+	function stop() {
+		clearTimeout(timer);
+		timer = void 0;
+	}
+	function tick() {
+		timer = void 0;
+		last = performance.now();
+		const measurement = latency?.getSnapshot();
+		if (measurement !== measured) {
+			measured = measurement;
+			const rtt = measurement?.rtt;
+			if (rtt !== void 0) {
+				best = Math.min(best, rtt);
+				slow = rtt - best > maxRttIncrease;
+				if (slow) rate /= 2;
+			}
+		}
+		const full = (client.socket?.bufferedAmount ?? 0) > maxBuffered;
+		if (full) rate /= 2;
+		else {
+			flush();
+			if (!slow) rate++;
+		}
+		rate = Math.min(maxRate, Math.max(minRate, rate));
+		publish(full || slow);
+		schedule();
+	}
+	const offs = [client.on("open", () => {
+		best = Infinity;
+		slow = false;
+		measured = latency?.getSnapshot();
+		schedule();
+	}), client.subscribe(() => {
+		const { status } = client.getSnapshot();
+		if (status !== "open") stop();
+		if (status === "closed" || status === "idle") pending.clear();
+	})];
+	return {
+		client,
+		send(message, key) {
+			pending.delete(key);
+			pending.set(key, message);
+			schedule();
+		},
+		flush,
+		getSnapshot: () => snapshot,
+		subscribe(listener) {
+			listeners.add(listener);
+			return () => {
+				listeners.delete(listener);
+			};
+		},
+		dispose() {
+			disposed = true;
+			stop();
+			pending.clear();
+			offs.forEach((off) => off());
+		}
+	};
+}
+//#endregion
 //#region src/state.ts
 /**
 * Keep state derived from a client's messages, like a reducer that runs on every message.
@@ -917,14 +1044,30 @@ function createWebSocketResponder(client, options) {
 * ```
 */
 function createWebSocketState(client, options) {
-	const { initialState, reduce } = options;
+	const { initialState, reduce, batch } = options;
 	let state = initialState;
+	let notified = state;
+	let frame = false;
 	const listeners = /* @__PURE__ */ new Set();
-	function setState(update) {
-		const next = typeof update === "function" ? update(state) : update;
+	function notify() {
+		if (Object.is(state, notified)) return;
+		notified = state;
+		for (const listener of [...listeners]) listener();
+	}
+	function flush() {
+		frame = false;
+		notify();
+	}
+	function update(change, later) {
+		const next = typeof change === "function" ? change(state) : change;
 		if (Object.is(next, state)) return;
 		state = next;
-		for (const listener of [...listeners]) listener();
+		if (!later) notify();
+		else if (!frame) {
+			frame = true;
+			if (typeof requestAnimationFrame === "function") requestAnimationFrame(flush);
+			else setTimeout(flush, 16);
+		}
 	}
 	return {
 		client,
@@ -936,9 +1079,9 @@ function createWebSocketState(client, options) {
 				listeners.delete(listener);
 			};
 		},
-		setState,
-		reset: () => setState(initialState),
-		dispose: client.on("message", (message) => setState((current) => reduce(current, message)))
+		setState: (change) => update(change),
+		reset: () => update(initialState),
+		dispose: client.on("message", (message) => update((current) => reduce(current, message), batch === "frame"))
 	};
 }
 //#endregion
@@ -1025,6 +1168,6 @@ function createWebSocketTopics(client, options) {
 	};
 }
 //#endregion
-export { MessageError, createWebSocket, createWebSocketLatency, createWebSocketRequests, createWebSocketResponder, createWebSocketState, createWebSocketTopics };
+export { MessageError, createWebSocket, createWebSocketLatency, createWebSocketRequests, createWebSocketResponder, createWebSocketSendRate, createWebSocketState, createWebSocketTopics };
 
 //# sourceMappingURL=core.js.map