@replayablejs/devtools 0.1.0-alpha.0

package/dist/stats/enabled.js

@@ -0,0 +1,1081 @@
+import { t as installDevtoolsInteraction } from "../install-devtools-interaction-1Flxw89C.js";
+import { t as disabledStats } from "../disabled-stats-DrzL4cm1.js";
+import { subscribeWebglContexts } from "./webgl/enabled.js";
+import { playable } from "@replayablejs/runtime";
+import { scaleLinear } from "d3-scale";
+import { area, line } from "d3-shape";
+//#region src/stats/lifecycle/run-stats-cleanup.ts
+/**
+* Attempts every cleanup in the supplied order, then reports failures.
+* Callers clear retained ownership before invoking this function, so a failed
+* cleanup cannot leave a stale subscription handle or block later destruction.
+* A single failure keeps its original identity; multiple failures are preserved.
+*/
+function runStatsCleanup(actions) {
+	const errors = [];
+	for (const action of actions) try {
+		action();
+	} catch (error) {
+		errors.push(error);
+	}
+	if (errors.length === 1) throw errors[0];
+	if (errors.length > 1) throw new AggregateError(errors, "Failed to release every stats resource.");
+}
+/** Preserves the setup failure even when rolling back acquired resources also fails. */
+function failStatsSetup(cause, cleanup) {
+	const errors = [cause];
+	try {
+		cleanup();
+	} catch (cleanupError) {
+		errors.push(cleanupError);
+	}
+	if (errors.length > 1) throw new AggregateError(errors, "Stats setup and cleanup both failed.", { cause });
+	throw cause;
+}
+//#endregion
+//#region src/stats/lifecycle/create-stats-lifecycle.ts
+/**
+* Connects measurement and presentation to Replayable's visibility and updates.
+* Host visibility never overrides manual hide intent. This owns every runtime
+* subscription and releases them together when the stats instance is destroyed.
+*/
+function createStatsLifecycle(sampler, view) {
+	let hostVisible = playable.state.visible;
+	let manuallyVisible = true;
+	let destroyed = false;
+	let removePostRenderListener;
+	const removeVisibilityListener = playable.on("visibilitychange", handleVisibilityChange);
+	try {
+		updateVisibility();
+	} catch (error) {
+		return failStatsSetup(error, destroy);
+	}
+	return {
+		show,
+		hide,
+		destroy
+	};
+	/** Requests stats visibility without overriding the host's visibility state. */
+	function show() {
+		if (destroyed || removePostRenderListener !== void 0) return;
+		manuallyVisible = true;
+		try {
+			updateVisibility();
+		} catch (error) {
+			manuallyVisible = false;
+			throw error;
+		}
+	}
+	/** Releases stats' frame demand until explicitly shown again. */
+	function hide() {
+		if (destroyed || !manuallyVisible) return;
+		manuallyVisible = false;
+		updateVisibility();
+	}
+	/** Permanently releases subscriptions and DOM; later public calls are inert. */
+	function destroy() {
+		if (destroyed) return;
+		destroyed = true;
+		runStatsCleanup([
+			removeVisibilityListener,
+			stopSampling,
+			() => view.destroy()
+		]);
+	}
+	/** Applies host visibility without changing the caller's show/hide request. */
+	function handleVisibilityChange(visible) {
+		if (destroyed) return;
+		hostVisible = visible;
+		updateVisibility();
+	}
+	/** Ignore callbacks retained in runtime's dispatch snapshot after stopSampling(). */
+	function handlePostRender({ timestamp }) {
+		if (removePostRenderListener === void 0) return;
+		const sample = sampler.update(timestamp);
+		if (sample !== void 0) view.update(sample);
+	}
+	/** Stats run only when both the host and caller permit them. */
+	function updateVisibility() {
+		if (hostVisible && manuallyVisible) startSampling();
+		else stopSampling();
+	}
+	/** Fresh measurements and history start together; lifetime extrema survive. */
+	function startSampling() {
+		if (removePostRenderListener !== void 0) return;
+		try {
+			sampler.reset(performance.now());
+			sampler.start();
+			view.clearHistory();
+			view.show();
+			removePostRenderListener = playable.postRender.add(handlePostRender);
+		} catch (error) {
+			return failStatsSetup(error, stopSampling);
+		}
+	}
+	/** The unsubscribe handle is also the single source of subscription state. */
+	function stopSampling() {
+		const unsubscribe = removePostRenderListener;
+		removePostRenderListener = void 0;
+		runStatsCleanup([
+			() => unsubscribe?.(),
+			sampler.stop,
+			() => view.hide()
+		]);
+	}
+}
+//#endregion
+//#region src/stats/measurement/create-stats-metrics.ts
+/** Creates independent measurement instances for the enabled registry definitions. */
+function createStatsMetrics(definitions) {
+	const metrics = definitions.map((definition) => ({
+		key: definition.key,
+		metric: definition.create()
+	}));
+	return {
+		start,
+		stop,
+		reset,
+		measure,
+		collect
+	};
+	/** CPU metrics need no subscription; external metrics acquire their shared source. */
+	function start() {
+		try {
+			for (const { metric } of metrics) metric.start();
+		} catch (error) {
+			return failStatsSetup(error, stop);
+		}
+	}
+	/** Release sources before discarding a partial window; lifetime ranges survive. */
+	function stop() {
+		runStatsCleanup(metrics.flatMap(({ metric }) => [() => metric.stop(), () => metric.reset()]));
+	}
+	/** Delegates window cleanup; the collection does not own individual metric state. */
+	function reset() {
+		for (const { metric } of metrics) metric.reset();
+	}
+	/** Every enabled metric receives the same real, unclamped frame interval. */
+	function measure(deltaMilliseconds, frameTimestamp) {
+		for (const { metric } of metrics) metric.measure(deltaMilliseconds, frameTimestamp);
+	}
+	/** Preserves unavailable readings as undefined and leaves earlier snapshots untouched. */
+	function collect() {
+		const readings = /* @__PURE__ */ new Map();
+		for (const { key, metric } of metrics) readings.set(key, metric.collect());
+		return readings;
+	}
+}
+//#endregion
+//#region src/stats/measurement/create-stats-sampling-clock.ts
+const REFRESH_INTERVAL_MILLISECONDS = 500;
+/** Delivers frames with real elapsed time (initially zero) and permits collection twice per second. */
+function createStatsSamplingClock() {
+	let previousTimestamp;
+	let nextRefreshTimestamp = 0;
+	let hasFrameIntervals = false;
+	return {
+		reset,
+		advance
+	};
+	/** The first subsequent frame establishes a baseline, excluding all hidden time. */
+	function reset(timestamp) {
+		previousTimestamp = void 0;
+		nextRefreshTimestamp = timestamp + REFRESH_INTERVAL_MILLISECONDS;
+		hasFrameIntervals = false;
+	}
+	/** Delivers the frame before collection so the deadline-crossing frame belongs to this window. */
+	function advance(timestamp, onFrame) {
+		advanceFrame(timestamp, onFrame);
+		if (timestamp < nextRefreshTimestamp) return false;
+		nextRefreshTimestamp = timestamp + REFRESH_INTERVAL_MILLISECONDS;
+		if (!hasFrameIntervals) return false;
+		hasFrameIntervals = false;
+		return true;
+	}
+	/** Delivers the initial frame with zero elapsed time; repeated timestamps are ignored. */
+	function advanceFrame(timestamp, onFrame) {
+		const previous = previousTimestamp;
+		previousTimestamp = timestamp;
+		if (previous === void 0) {
+			onFrame(0);
+			return;
+		}
+		const deltaMilliseconds = timestamp - previous;
+		if (deltaMilliseconds <= 0) return;
+		hasFrameIntervals = true;
+		onFrame(deltaMilliseconds);
+	}
+}
+//#endregion
+//#region src/stats/measurement/create-stats-sampler.ts
+/** Dispatches real frame intervals to enabled metrics and collects them twice per second. */
+function createStatsSampler(definitions) {
+	const metrics = createStatsMetrics(definitions);
+	const clock = createStatsSamplingClock();
+	return {
+		start: metrics.start,
+		stop: metrics.stop,
+		reset,
+		update
+	};
+	/** Discards partial measurements and excludes the visibility gap, preserving extrema. */
+	function reset(timestamp) {
+		clock.reset(timestamp);
+		metrics.reset();
+	}
+	/** The clock delivers this frame's interval before permitting metric collection. */
+	function update(timestamp) {
+		if (!clock.advance(timestamp, (deltaMilliseconds) => {
+			metrics.measure(deltaMilliseconds, timestamp);
+		})) return;
+		return metrics.collect();
+	}
+}
+//#endregion
+//#region src/stats/presentation/create-stats-card-selection.ts
+/** Owns available-card selection and cycling; it never renders or changes measurements. */
+function createStatsCardSelection(cards) {
+	let current = cards.find((card) => card.available);
+	return {
+		get current() {
+			return current;
+		},
+		resolve,
+		cycle
+	};
+	/** Preserves selection while available; an empty collection has no selected card. */
+	function resolve() {
+		if (!current?.available) current = cards.find((card) => card.available);
+	}
+	/** Skips unavailable cards and wraps without recording or clearing their history. */
+	function cycle() {
+		const available = cards.filter((card) => card.available);
+		if (available.length === 0) return;
+		current = available[((current === void 0 ? -1 : available.indexOf(current)) + 1) % available.length];
+	}
+}
+//#endregion
+//#region src/stats/presentation/create-stats-card-elements.ts
+/** Builds an unmounted card with its graph behind the label, value, and range. */
+function createStatsCardElements(metric, graph) {
+	const root = document.createElement("div");
+	root.className = "replayable-stats__card";
+	root.dataset.label = metric.label;
+	root.setAttribute("aria-label", metric.label);
+	if (metric.description !== "") root.title = metric.description;
+	const heading = document.createElement("span");
+	heading.className = "replayable-stats__label";
+	heading.textContent = metric.label;
+	const value = document.createElement("span");
+	value.className = "replayable-stats__value";
+	value.textContent = "—";
+	const range = document.createElement("span");
+	range.className = "replayable-stats__range";
+	range.hidden = true;
+	root.append(graph, heading, value, range);
+	return {
+		root,
+		value,
+		range
+	};
+}
+//#endregion
+//#region src/stats/presentation/create-stats-graph-elements.ts
+const SVG_NAMESPACE = "http://www.w3.org/2000/svg";
+/** Creates an unmounted decorative SVG with its filled area behind the line. */
+function createStatsGraphElements(width, height) {
+	const root = document.createElementNS(SVG_NAMESPACE, "svg");
+	root.setAttribute("viewBox", `0 0 ${width} ${height}`);
+	root.setAttribute("aria-hidden", "true");
+	root.classList.add("replayable-stats__graph");
+	const fill = document.createElementNS(SVG_NAMESPACE, "path");
+	fill.classList.add("replayable-stats__graph-area");
+	const stroke = document.createElementNS(SVG_NAMESPACE, "path");
+	stroke.classList.add("replayable-stats__graph-line");
+	stroke.setAttribute("fill", "none");
+	root.append(fill, stroke);
+	return {
+		root,
+		fill,
+		stroke
+	};
+}
+const GRAPH_WIDTH = 96;
+const GRAPH_HEIGHT = 56;
+const GRAPH_INSET = 2;
+/**
+* Creates one reusable line and filled area. D3 only calculates
+* paths and coordinates; it does not manage DOM, transitions, or a frame loop.
+*
+* Observe samples before rendering. Keeping observation separate lets compact
+* cards remember peaks without redrawing hidden graphs on every refresh.
+*/
+function createStatsGraph(initialCeiling) {
+	const elements = createStatsGraphElements(GRAPH_WIDTH, GRAPH_HEIGHT);
+	let ceiling = initialCeiling;
+	const xScale = scaleLinear().domain([0, 59]).range([GRAPH_INSET, 94]);
+	const yScale = scaleLinear().domain([0, ceiling]).range([54, GRAPH_INSET]);
+	const linePath = line().y((value) => yScale(value));
+	const areaPath = area().y0(yScale(0)).y1((value) => yScale(value));
+	return {
+		element: elements.root,
+		get ceiling() {
+			return ceiling;
+		},
+		observe,
+		render
+	};
+	/** Grows the scale for new peaks without redrawing a potentially hidden graph. */
+	function observe(value) {
+		while (value > ceiling) ceiling *= 2;
+	}
+	/** Updates existing paths from recorded history; fewer than two samples draw no trace. */
+	function render(history) {
+		yScale.domain([0, ceiling]);
+		if (history.length < 2) {
+			elements.fill.removeAttribute("d");
+			elements.stroke.removeAttribute("d");
+			return;
+		}
+		const firstSlot = 60 - history.length;
+		linePath.x((_value, index) => xScale(firstSlot + index));
+		areaPath.x((_value, index) => xScale(firstSlot + index));
+		elements.stroke.setAttribute("d", linePath(history) ?? "");
+		elements.fill.setAttribute("d", areaPath(history) ?? "");
+	}
+}
+//#endregion
+//#region src/stats/presentation/create-stats-card.ts
+/** Owns one metric's recorded history and renders it into reusable card elements. */
+function createStatsCard(metric) {
+	const graph = createStatsGraph(metric.ceiling);
+	const elements = createStatsCardElements(metric, graph.element);
+	const history = [];
+	let isAvailable = metric.initiallyAvailable;
+	let currentValue;
+	let currentRange;
+	return {
+		key: metric.key,
+		element: elements.root,
+		label: metric.label,
+		get available() {
+			return isAvailable;
+		},
+		record,
+		render,
+		clearHistory
+	};
+	/** Records data and graph peaks without redrawing, including while this card is hidden. */
+	function record(reading) {
+		isAvailable = reading !== void 0;
+		if (reading === void 0) {
+			clearHistory();
+			return;
+		}
+		currentValue = reading.value;
+		currentRange = reading.range;
+		history.push(reading.graphValue);
+		if (history.length > 60) history.shift();
+		graph.observe(reading.graphValue);
+	}
+	/** Draws stored values and history without recording another observation. */
+	function render() {
+		elements.value.textContent = currentValue?.toFixed(1) ?? "—";
+		elements.range.hidden = currentRange === void 0;
+		elements.range.textContent = formatRange(currentRange);
+		graph.render(history);
+	}
+	/** Discards the trace and value, preserving availability, lifetime range, and graph scale. */
+	function clearHistory() {
+		history.length = 0;
+		currentValue = void 0;
+	}
+}
+/** Formats lifetime extrema as a compact label, leaving an unavailable range empty. */
+function formatRange(range) {
+	if (range === void 0) return "";
+	return `(${Math.round(range.min)}–${Math.round(range.max)})`;
+}
+//#endregion
+//#region src/stats/presentation/create-stats-cards.ts
+/** Owns card instances, recorded samples, and selection in registry order. */
+function createStatsCards(definitions, display) {
+	const cards = definitions.map(createStatsCard);
+	const selection = createStatsCardSelection(cards);
+	const render = display === "compact" ? renderCompact : renderExpanded;
+	return {
+		elements: cards.map((card) => card.element),
+		get selectedLabel() {
+			return selection.current?.label;
+		},
+		record,
+		cycle: selection.cycle,
+		render,
+		clearHistory
+	};
+	/** Hidden cards still receive samples so cycling never loses their history. */
+	function record(sample) {
+		for (const card of cards) card.record(sample.get(card.key));
+	}
+	/** Displays only the selected available card; hidden cards retain their history. */
+	function renderCompact() {
+		selection.resolve();
+		for (const card of cards) renderCard(card, card === selection.current);
+	}
+	/** Displays every available card without resolving compact selection. */
+	function renderExpanded() {
+		for (const card of cards) renderCard(card, card.available);
+	}
+	/** Clears traces, preserving availability, scales, and selection. */
+	function clearHistory() {
+		for (const card of cards) card.clearHistory();
+	}
+	/** Applies visibility and avoids redrawing hidden cards in either display mode. */
+	function renderCard(card, visible) {
+		card.element.hidden = !visible;
+		if (visible) card.render();
+	}
+}
+//#endregion
+//#region src/stats/presentation/stats.scss?inline
+var stats_default = ".replayable-stats{left:calc(2vmin + env(safe-area-inset-left,0px));bottom:calc(2vmin + env(safe-area-inset-bottom,0px));z-index:2147483647;max-width:calc(100% - 4vmin - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px));pointer-events:none;-webkit-user-select:none;user-select:none;font-variant-numeric:tabular-nums;color:#e6f5ff;flex-wrap:wrap;gap:1vmin;margin:0;padding:0;font:2.75vmin/1.4 ui-monospace,monospace;display:flex;position:fixed}.replayable-stats--compact[role=button]{pointer-events:auto;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent}.replayable-stats--compact[role=button]:focus-visible{outline-offset:.5vmin;outline:.25vmin solid #a7bdd1}.replayable-stats[hidden],.replayable-stats [hidden]{display:none}.replayable-stats__card{box-sizing:border-box;white-space:nowrap;background:#0c131ce6;border:.25vmin solid #435366;border-radius:1vmin;flex:0 0 24vmin;width:24vmin;height:14vmin;padding:1vmin 1.5vmin;position:relative;overflow:hidden}.replayable-stats__label,.replayable-stats__value{text-shadow:0 .25vmin .5vmin #0c131c;display:block;position:relative}.replayable-stats__label{color:#a7bdd1;font-size:2.5vmin}.replayable-stats__value{font-size:3vmin;position:absolute;bottom:.5vmin;left:1.5vmin}.replayable-stats__graph{width:100%;height:100%;position:absolute;inset:0}.replayable-stats__graph-area{fill:#5cbedc1f}.replayable-stats__graph-line{stroke:#70d3ef73;stroke-width:1px}.replayable-stats__range{color:#8095a8;text-shadow:0 .25vmin .5vmin #0c131c;font-size:1.75vmin;position:absolute;bottom:.5vmin;right:.5vmin}\n";
+//#endregion
+//#region src/stats/presentation/create-stats-shell-elements.ts
+/** Builds the unmounted shell and stylesheet without installing input listeners. */
+function createStatsShellElements(cardElements, display) {
+	const root = document.createElement("aside");
+	root.className = "replayable-stats";
+	root.setAttribute("aria-label", "Development stats");
+	root.classList.toggle("replayable-stats--compact", display === "compact");
+	root.append(...cardElements);
+	const style = document.createElement("style");
+	style.textContent = stats_default;
+	return {
+		root,
+		style
+	};
+}
+//#endregion
+//#region src/stats/presentation/create-stats-shell.ts
+/** Mounts the shell, stylesheet, and optional compact input interception. */
+function createStatsShell(cardElements, display, onCycleCard) {
+	const compact = display === "compact";
+	const { root, style } = createStatsShellElements(cardElements, display);
+	const updateAccessibility = compact ? updateCompactAccessibility : noop$4;
+	document.head.append(style);
+	document.body.append(root);
+	const removeInteraction = compact ? installDevtoolsInteraction(root, onCycleCard) : void 0;
+	return {
+		updateAccessibility,
+		show,
+		hide,
+		destroy
+	};
+	/** Describes selection without leaving an empty view as an invisible click target. */
+	function updateCompactAccessibility(label) {
+		if (label !== void 0) {
+			root.setAttribute("role", "button");
+			root.tabIndex = 0;
+			root.setAttribute("aria-label", `${label}. Show next stats card`);
+		} else {
+			root.removeAttribute("role");
+			root.removeAttribute("tabindex");
+			root.setAttribute("aria-label", "Development stats");
+		}
+	}
+	/** Visibility alone does not change card data or selection. */
+	function show() {
+		root.hidden = false;
+	}
+	/** Hidden shells do not intercept input. */
+	function hide() {
+		root.hidden = true;
+	}
+	/** Removes this shell's input listeners, DOM, and stylesheet. */
+	function destroy() {
+		removeInteraction?.();
+		root.remove();
+		style.remove();
+	}
+}
+/** Expanded accessibility is static and already initialized by the shell elements. */
+function noop$4() {}
+//#endregion
+//#region src/stats/presentation/create-stats-view.ts
+/** Coordinates metric cards and their mounted presentation shell. */
+function createStatsView(definitions, display) {
+	const cards = createStatsCards(definitions, display);
+	const shell = createStatsShell(cards.elements, display, cycleCard);
+	render();
+	return {
+		update,
+		clearHistory,
+		show: shell.show,
+		hide: shell.hide,
+		destroy
+	};
+	/** Records a refresh before redrawing the visible cards. */
+	function update(sample) {
+		cards.record(sample);
+		render();
+	}
+	/** Clears traces after a measurement gap without changing selection. */
+	function clearHistory() {
+		cards.clearHistory();
+		render();
+	}
+	/** Changes the displayed card without recording another sample. */
+	function cycleCard() {
+		cards.cycle();
+		render();
+	}
+	/** Keeps shell accessibility in sync with resolved card selection. */
+	function render() {
+		cards.render();
+		shell.updateAccessibility(cards.selectedLabel);
+	}
+	/** Releases recorded histories and removes the shell without a final redraw. */
+	function destroy() {
+		shell.destroy();
+		cards.clearHistory();
+	}
+}
+//#endregion
+//#region src/stats/measurement/create-stats-range.ts
+/** Tracks extrema without storing samples or allocating on each measured frame. */
+function createStatsRange() {
+	let min = Infinity;
+	let max = -Infinity;
+	return {
+		get current() {
+			return min === Infinity ? void 0 : {
+				min,
+				max
+			};
+		},
+		observe(value) {
+			if (!Number.isFinite(value) || value < 0) return;
+			min = Math.min(min, value);
+			max = Math.max(max, value);
+		}
+	};
+}
+//#endregion
+//#region src/stats/measurement/metrics/create-fps-metric.ts
+const MILLISECONDS_PER_SECOND = 1e3;
+/** Counts complete frame intervals against real elapsed time, not instantaneous reciprocals. */
+function createFpsMetric() {
+	const range = createStatsRange();
+	let intervalCount = 0;
+	let totalMilliseconds = 0;
+	return {
+		start: noop$3,
+		stop: noop$3,
+		measure,
+		collect,
+		reset
+	};
+	function measure(deltaMilliseconds) {
+		if (deltaMilliseconds === 0) return;
+		intervalCount += 1;
+		totalMilliseconds += deltaMilliseconds;
+	}
+	/** Lifetime extrema describe published FPS windows, not individual frames. */
+	function collect() {
+		if (intervalCount === 0) return;
+		const value = intervalCount * MILLISECONDS_PER_SECOND / totalMilliseconds;
+		range.observe(value);
+		reset();
+		return {
+			value,
+			graphValue: value,
+			range: range.current
+		};
+	}
+	function reset() {
+		intervalCount = 0;
+		totalMilliseconds = 0;
+	}
+}
+/** FPS uses supplied frame intervals and owns no external subscriptions. */
+function noop$3() {}
+//#endregion
+//#region src/stats/measurement/metrics/create-frame-interval-metric.ts
+/** Displays the average, graphs the peak, and retains extrema of individual intervals. */
+function createFrameIntervalMetric() {
+	const range = createStatsRange();
+	let intervalCount = 0;
+	let totalMilliseconds = 0;
+	let peakMilliseconds = 0;
+	return {
+		start: noop$2,
+		stop: noop$2,
+		measure,
+		collect,
+		reset
+	};
+	function measure(deltaMilliseconds) {
+		if (deltaMilliseconds === 0) return;
+		intervalCount += 1;
+		totalMilliseconds += deltaMilliseconds;
+		peakMilliseconds = Math.max(peakMilliseconds, deltaMilliseconds);
+		range.observe(deltaMilliseconds);
+	}
+	function collect() {
+		if (intervalCount === 0) return;
+		const reading = {
+			value: totalMilliseconds / intervalCount,
+			graphValue: peakMilliseconds,
+			range: range.current
+		};
+		reset();
+		return reading;
+	}
+	function reset() {
+		intervalCount = 0;
+		totalMilliseconds = 0;
+		peakMilliseconds = 0;
+	}
+}
+/** Frame intervals are supplied by runtime; no external resources need acquisition. */
+function noop$2() {}
+//#endregion
+//#region src/stats/measurement/metrics/create-js-heap-metric.ts
+const BYTES_PER_MEGABYTE = 1e6;
+/** Reads browser memory only on refresh; it has no per-frame or partial-window work. */
+function createJsHeapMetric() {
+	const range = createStatsRange();
+	return {
+		start: noop$1,
+		stop: noop$1,
+		measure: noop$1,
+		reset: noop$1,
+		collect
+	};
+	function collect() {
+		const value = readJsHeap();
+		if (value === void 0) return;
+		range.observe(value);
+		return {
+			value,
+			graphValue: value,
+			range: range.current
+		};
+	}
+}
+/**
+* Reads the optional browser heap estimate only on collection.
+* This is not total playable memory: it excludes GPU allocations and may
+* include other work sharing the browser's JavaScript heap.
+*/
+function readJsHeap() {
+	if (!("memory" in performance)) return;
+	const { memory } = performance;
+	if (typeof memory !== "object" || memory === null || !("usedJSHeapSize" in memory)) return;
+	const bytes = memory.usedJSHeapSize;
+	if (typeof bytes !== "number" || !Number.isFinite(bytes) || bytes < 0) return;
+	return bytes / BYTES_PER_MEGABYTE;
+}
+/** Heap observations need no subscriptions, frame accumulation, or window reset. */
+function noop$1() {}
+//#endregion
+//#region src/stats/webgl/observe-webgl-method.ts
+/**
+* Shadows a method on this context/extension only, leaving browser prototypes alone.
+* Observation happens after a normal return: thrown calls retain their exception
+* and are not counted. WebGL error flags are deliberately never queried.
+*/
+function observeWebglMethod(target, name, observe) {
+	const original = Reflect.get(target, name);
+	if (typeof original !== "function") return noop;
+	const method = original;
+	const descriptor = Object.getOwnPropertyDescriptor(target, name);
+	let active = true;
+	Object.defineProperty(target, name, {
+		configurable: true,
+		enumerable: descriptor?.enumerable ?? false,
+		writable: true,
+		value: observedMethod
+	});
+	return restore;
+	/** Preserve the receiver, argument identities, return value, and native exceptions. */
+	function observedMethod(...args) {
+		const result = Reflect.apply(method, this, args);
+		if (active) observe(args);
+		return result;
+	}
+	/** Never overwrite a wrapper installed by another tool after ours. */
+	function restore() {
+		if (!active) return;
+		active = false;
+		if (Object.getOwnPropertyDescriptor(target, name)?.value !== observedMethod) return;
+		if (descriptor === void 0) {
+			if (!Reflect.deleteProperty(target, name)) throw new TypeError(`Unable to remove the stats wrapper for ${name}.`);
+		} else Object.defineProperty(target, name, descriptor);
+	}
+}
+/** Missing WebGL2/extension methods need no instrumentation or cleanup. */
+function noop() {}
+//#endregion
+//#region src/stats/webgl/create-webgl-tracker.ts
+const trackers = /* @__PURE__ */ new WeakMap();
+/**
+* Instruments one renderer-created context, reusing it when renderers share it.
+* No scheduling, context creation, GPU queries, or renderer knowledge lives here.
+* The later sampling lifecycle owns this tracker and calls collect after rendering.
+*/
+function createWebglTracker(context) {
+	const existing = trackers.get(context);
+	if (existing !== void 0) return existing;
+	let drawCalls = 0;
+	let textureBinds = 0;
+	let programUses = 0;
+	const restoreMethods = [];
+	const tracker = {
+		collect,
+		reset,
+		destroy
+	};
+	try {
+		observeDrawMethods();
+		observe(context, "bindTexture", recordTextureBind);
+		observe(context, "useProgram", recordProgramUse);
+		observeExtensions();
+	} catch (error) {
+		return failStatsSetup(error, destroy);
+	}
+	trackers.set(context, tracker);
+	return tracker;
+	/** Instanced submissions count once, regardless of how many instances they draw. */
+	function observeDrawMethods() {
+		for (const name of [
+			"drawArrays",
+			"drawElements",
+			"drawRangeElements",
+			"drawArraysInstanced",
+			"drawElementsInstanced"
+		]) observe(context, name, recordDraw);
+	}
+	/**
+	* Retrieve extension objects once so already-cached objects are instrumented too.
+	* This enables supported extensions, but never creates a WebGL context. Native
+	* extension objects are reused by getExtension; unsupported ones return null.
+	* A function copied/bound before installation cannot be intercepted retroactively.
+	* https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_multi_draw
+	*/
+	function observeExtensions() {
+		const instancing = context.getExtension("ANGLE_instanced_arrays");
+		if (typeof instancing === "object" && instancing !== null) {
+			observe(instancing, "drawArraysInstancedANGLE", recordDraw);
+			observe(instancing, "drawElementsInstancedANGLE", recordDraw);
+		}
+		const multiDraw = context.getExtension("WEBGL_multi_draw");
+		if (typeof multiDraw === "object" && multiDraw !== null) {
+			observe(multiDraw, "multiDrawArraysWEBGL", (args) => recordMultiDraw(args[5]));
+			observe(multiDraw, "multiDrawElementsWEBGL", (args) => recordMultiDraw(args[6]));
+			observe(multiDraw, "multiDrawArraysInstancedWEBGL", (args) => recordMultiDraw(args[7]));
+			observe(multiDraw, "multiDrawElementsInstancedWEBGL", (args) => recordMultiDraw(args[8]));
+		}
+	}
+	/** Keeps installation and cleanup paired for both context and extension methods. */
+	function observe(target, name, record) {
+		restoreMethods.push(observeWebglMethod(target, name, record));
+	}
+	/** One ordinary API submission, including zero-count draws; no GPU success claim. */
+	function recordDraw() {
+		drawCalls += 1;
+	}
+	/** Reads the signature's drawcount, ignoring extra arguments as WebGL does. */
+	function recordMultiDraw(count) {
+		if (typeof count === "number" && Number.isInteger(count) && count > 0) drawCalls += count;
+	}
+	/** Repeated bindings and null unbindings are still API calls. */
+	function recordTextureBind() {
+		textureBinds += 1;
+	}
+	/** Counts useProgram calls, not unique programs or successful shader switches. */
+	function recordProgramUse() {
+		programUses += 1;
+	}
+	/** Allocate only at the caller's sampling boundary, never a snapshot per GL call. */
+	function collect() {
+		const counts = {
+			drawCalls,
+			textureBinds,
+			programUses
+		};
+		reset();
+		return counts;
+	}
+	/** Discards a partial frame without changing the installed wrappers. */
+	function reset() {
+		drawCalls = 0;
+		textureBinds = 0;
+		programUses = 0;
+	}
+	/** Idempotent cleanup; stale owners cannot remove a newer tracker. */
+	function destroy() {
+		const restores = restoreMethods.splice(0).reverse();
+		reset();
+		if (trackers.get(context) === tracker) trackers.delete(context);
+		runStatsCleanup(restores);
+	}
+}
+//#endregion
+//#region src/stats/webgl/create-webgl-context-sampling.ts
+/** Owns instrumentation and loss listeners for one registered, renderer-created context. */
+function createWebglContextSampling(context) {
+	let tracker;
+	let destroyed = false;
+	try {
+		context.canvas.addEventListener("webglcontextlost", handleContextLost);
+		context.canvas.addEventListener("webglcontextrestored", handleContextRestored);
+		handleContextRestored();
+	} catch (error) {
+		return failStatsSetup(error, destroy);
+	}
+	return {
+		collect,
+		destroy
+	};
+	/** Lost contexts are unavailable, not zero-work frames. */
+	function collect() {
+		return tracker?.collect();
+	}
+	/** Leave preventDefault/restoration policy to the renderer; discard partial counts. */
+	function handleContextLost() {
+		const previousTracker = tracker;
+		tracker = void 0;
+		previousTracker?.destroy();
+	}
+	/** Reacquire extension objects and wrappers after restoration, with fresh counters. */
+	function handleContextRestored() {
+		if (!destroyed && tracker === void 0 && !context.isContextLost()) tracker = createWebglTracker(context);
+	}
+	/** Removes listeners before releasing wrappers; does not destroy the canvas or GL context. */
+	function destroy() {
+		if (destroyed) return;
+		destroyed = true;
+		runStatsCleanup([
+			() => context.canvas.removeEventListener("webglcontextlost", handleContextLost),
+			() => context.canvas.removeEventListener("webglcontextrestored", handleContextRestored),
+			handleContextLost
+		]);
+	}
+}
+//#endregion
+//#region src/stats/webgl/subscribe-webgl-frames.ts
+const listeners = /* @__PURE__ */ new Set();
+const contexts = /* @__PURE__ */ new Map();
+let collectedTimestamp;
+let removeContextListener;
+/**
+* Acquires frame sampling until the returned release is called (hide/destroy).
+* The first consumer installs instrumentation; the last release restores it.
+* Stats lifecycle releases consumers when hidden; this source owns no visibility policy.
+* Merely importing this module allocates no DOM, wrappers, or subscriptions.
+*/
+function subscribeWebglFrames(listener) {
+	const deliver = (timestamp, counts) => listener(timestamp, counts);
+	listeners.add(deliver);
+	if (listeners.size === 1) try {
+		startSampling();
+	} catch (error) {
+		return failStatsSetup(error, release);
+	}
+	return release;
+	/** Idempotent release; other visible stats instances keep their shared tracker. */
+	function release() {
+		if (!listeners.delete(deliver) || listeners.size !== 0) return;
+		stopSampling();
+	}
+}
+/** Replay existing contexts before the next update, or observe later registrations. */
+function startSampling() {
+	if (removeContextListener !== void 0) return;
+	removeContextListener = subscribeWebglContexts(updateContexts);
+}
+/** Release every owned wrapper and context reference, invalidating the previous frame. */
+function stopSampling() {
+	collectedTimestamp = void 0;
+	const unsubscribe = removeContextListener;
+	removeContextListener = void 0;
+	const samplings = [...contexts.values()];
+	contexts.clear();
+	runStatsCleanup([() => unsubscribe?.(), ...samplings.map((sampling) => sampling.destroy)]);
+}
+/** Registry snapshots already deduplicate contexts shared by Pixi and Three. */
+function updateContexts(registered) {
+	const removals = [];
+	for (const [context, sampling] of contexts) if (!registered.includes(context)) {
+		contexts.delete(context);
+		removals.push(sampling.destroy);
+	}
+	runStatsCleanup(removals);
+	for (const context of registered) if (!contexts.has(context)) contexts.set(context, createWebglContextSampling(context));
+}
+/**
+* Called by metric sampling after rendering, never by an independent scheduler.
+* Motion's frame timestamp is shared across stats instances, unlike their local
+* performance.now() readings. It makes collection/reset happen once per frame.
+* Delivery updates all subscribed metrics before any instance collects its readings.
+*/
+function collectWebglFrame(timestamp) {
+	if (removeContextListener === void 0 || collectedTimestamp === timestamp) return;
+	collectedTimestamp = timestamp;
+	let available = false;
+	let drawCalls = 0;
+	let textureBinds = 0;
+	let programUses = 0;
+	for (const sampling of contexts.values()) {
+		const counts = sampling.collect();
+		if (counts !== void 0) {
+			available = true;
+			drawCalls += counts.drawCalls;
+			textureBinds += counts.textureBinds;
+			programUses += counts.programUses;
+		}
+	}
+	const counts = available ? Object.freeze({
+		drawCalls,
+		textureBinds,
+		programUses
+	}) : void 0;
+	for (const listener of [...listeners]) if (listeners.has(listener)) listener(timestamp, counts);
+}
+//#endregion
+//#region src/stats/measurement/metrics/create-webgl-metric.ts
+/** One counter's frame average, graph peak, and lifetime per-frame extrema. */
+function createWebglMetric(key) {
+	const range = createStatsRange();
+	let unsubscribeFromFrames;
+	let frames = 0;
+	let total = 0;
+	let peak = 0;
+	return {
+		start,
+		stop,
+		measure,
+		collect,
+		reset
+	};
+	/** The source collects once per frame even when all three metrics subscribe. */
+	function start() {
+		unsubscribeFromFrames ??= subscribeWebglFrames(recordFrame);
+	}
+	/** Releases frame sampling and clears this metric's subscription state. */
+	function stop() {
+		const unsubscribe = unsubscribeFromFrames;
+		unsubscribeFromFrames = void 0;
+		unsubscribe?.();
+	}
+	/** All metrics use the same post-render measurement path; the source deduplicates frames. */
+	function measure(_deltaMilliseconds, frameTimestamp) {
+		collectWebglFrame(frameTimestamp);
+	}
+	/** A missing/lost context invalidates this window rather than publishing stale work. */
+	function recordFrame(_timestamp, counts) {
+		if (counts === void 0) {
+			reset();
+			return;
+		}
+		const count = counts[key];
+		frames += 1;
+		total += count;
+		peak = Math.max(peak, count);
+		range.observe(count);
+	}
+	/** Average includes idle zero-work frames; graph and extrema retain individual peaks. */
+	function collect() {
+		if (frames === 0) return;
+		const reading = {
+			value: total / frames,
+			graphValue: peak,
+			range: range.current
+		};
+		reset();
+		return reading;
+	}
+	/** Discard partial counts without clearing the metric's lifetime range. */
+	function reset() {
+		frames = 0;
+		total = 0;
+		peak = 0;
+	}
+}
+//#endregion
+//#region src/stats/stats-metrics.ts
+/**
+* The single built-in registry: order, presentation, and measurement factory.
+* Add a metric implementation here; sampler, lifecycle, and cards need no edits.
+* A new authored toggle also belongs in config's strict stats schema and runtime type.
+*/
+const STATS_METRICS = [
+	{
+		key: "fps",
+		label: "FPS",
+		description: "",
+		ceiling: 120,
+		initiallyAvailable: true,
+		create: createFpsMetric
+	},
+	{
+		key: "frameInterval",
+		label: "Frame · ms",
+		description: "",
+		ceiling: 100,
+		initiallyAvailable: true,
+		create: createFrameIntervalMetric
+	},
+	{
+		key: "jsHeap",
+		label: "JS heap · MB",
+		description: "Approximate browser-reported JS heap; not total playable memory.",
+		ceiling: 64,
+		initiallyAvailable: false,
+		create: createJsHeapMetric
+	},
+	{
+		key: "drawCalls",
+		label: "Draw calls",
+		description: "Submitted draws per frame; instanced draws count once, multi-draw counts each draw.",
+		ceiling: 100,
+		initiallyAvailable: false,
+		create: () => createWebglMetric("drawCalls")
+	},
+	{
+		key: "textureBinds",
+		label: "Texture binds",
+		description: "bindTexture calls per frame, including repeated bindings and null unbindings.",
+		ceiling: 100,
+		initiallyAvailable: false,
+		create: () => createWebglMetric("textureBinds")
+	},
+	{
+		key: "programUses",
+		label: "Program uses",
+		description: "useProgram calls per frame, not unique programs or shaders.",
+		ceiling: 100,
+		initiallyAvailable: false,
+		create: () => createWebglMetric("programUses")
+	}
+];
+//#endregion
+//#region src/create-stats.ts
+/** Creates optional development stats after await playable.ready(). */
+function createStats() {
+	const config = playable.config.devtools.stats;
+	if (config === false) return disabledStats;
+	const metrics = STATS_METRICS.filter((metric) => config[metric.key]);
+	if (metrics.length === 0) return disabledStats;
+	requireRuntimeReady();
+	return createStatsLifecycle(createStatsSampler(metrics), createStatsView(metrics, config.display));
+}
+/** Requires await playable.ready() before stats can allocate DOM or subscribe. */
+function requireRuntimeReady() {
+	playable.state;
+}
+//#endregion
+export { createStats };
+
+//# sourceMappingURL=enabled.js.map