@ogygia/devtools 0.11.4 → 0.13.0

package/README.md

@@ -23,4 +23,4 @@ export default defineConfig(({ mode }) => ({
 
 Code for the profiler: `@ogygia/devtools/profiler` (`span`, `instrument`), `@ogygia/devtools/profiler/client` (`mark`), and stores at `@ogygia/devtools/profiler/storage/sqlite`, `/redis`, `/postgres`.
 
-Docs: [Devtools](https://ogygiajs.dev/docs/devtools/overview) and [the profiler](https://ogygiajs.dev/docs/profiler/overview).
+Docs: [@ogygia/devtools](https://ogygiajs.dev/docs/devtools/overview), with [the dock](https://ogygiajs.dev/docs/devtools/dock) and [the profiler](https://ogygiajs.dev/docs/devtools/profiler/overview).

package/dist/app.d.ts

@@ -0,0 +1,3 @@
+import { ServerApp } from "@ogygia/core/plugin";
+export declare function set_devtools_app(app: ServerApp<unknown> | null): void;
+export declare function devtools_app(): ServerApp<unknown> | null;

package/dist/app.js

@@ -0,0 +1,9 @@
+// src/app.ts
+const slot = globalThis[Symbol.for("ogygia.devtools.app.v1")] ??= { app: null };
+function set_devtools_app(app) {
+	slot.app = app;
+}
+function devtools_app() {
+	return slot.app;
+}
+export { devtools_app, set_devtools_app };

package/dist/devtools/BoundaryOverlay.svelte

@@ -15,6 +15,7 @@
 	 * the real element under the cursor via `<svelte:window>`. A pure consumer, drawn only while on.
 	 */
 	import { onMount } from 'svelte';
+	import { scope } from '@ogygia/machine';
 	import {
 		all_regions,
 		region_info,
@@ -45,19 +46,22 @@
 		const onkey = (e) => {
 			if (e.key === 'Escape' && picking) picking = false;
 		};
-		window.addEventListener('keydown', onkey);
-		return () => window.removeEventListener('keydown', onkey);
+		const s = scope();
+		s.on(window, 'keydown', onkey);
+		return () => s.close();
 	});
 	// The rAF loop runs ONLY while the overlay is on (it follows the `overlay` prop, hence an effect):
 	// a loop left running with the overlay off asked the browser for a frame sixty times a second on
 	// every page with devtools, the dock closed — ~90 ms of main-thread work each 5 s of idle
 	$effect(() => {
 		if (!overlay) return;
-		let raf = requestAnimationFrame(function loop() {
+		const s = scope();
+		const loop = () => {
 			frame++;
-			raf = requestAnimationFrame(loop);
-		});
-		return () => cancelAnimationFrame(raf);
+			s.timeout(loop, 'frame');
+		};
+		s.timeout(loop, 'frame');
+		return () => s.close();
 	});
 
 	const boxes = $derived.by(() => {

package/dist/devtools/Devtools.svelte

@@ -29,7 +29,8 @@ shadow boundary keeps it from the dock — a built dock opened unstyled. -->
 	import PageTab from './PageTab.svelte';
 	import SessionTab from './SessionTab.svelte';
 	import HydrationTab from './HydrationTab.svelte';
-	import { onMount } from 'svelte';
+	import { onDestroy, onMount } from 'svelte';
+	import { scope, STALE } from '@ogygia/machine';
 	import BoundaryOverlay from './BoundaryOverlay.svelte';
 	import IslandDetail from './IslandDetail.svelte';
 	import { to_trace } from '@ogygia/core/events';
@@ -93,7 +94,7 @@ shadow boundary keeps it from the dock — a built dock opened unstyled. -->
 				JSON.stringify({ open, launch: launchPos, win: winPos, rz: winResizeOff, size: winSize })
 			);
 		} catch {
-			/* private mode / quota — layout just won't persist */
+			// ok: private mode or quota: the layout is not kept
 		}
 	}
 
@@ -155,15 +156,19 @@ shadow boundary keeps it from the dock — a built dock opened unstyled. -->
 	// Explicit hover state for the launcher (pointerenter/leave — a `:hover` descendant selector proved
 	// flaky against neodrag's inline transform). `up` = fully revealed; otherwise it peeks below the fold.
 	let launchHover = $state(false);
-	let tickTimer = /** @type {ReturnType<typeof setInterval> | null} */ (null);
+	/** The dock's own work in the page (its keys, its timers, its fetch): let go when it unmounts. */
+	const owner = scope();
+	onDestroy(() => owner.close());
+	/** The live refresh while the window is open: a child of the dock's scope. */
+	let refresh = /** @type {import('@ogygia/machine').Scope | null} */ (null);
 	function refresh_on() {
-		if (!tickTimer) tickTimer = setInterval(() => tick++, 700);
+		if (refresh) return;
+		refresh = owner.child();
+		refresh.every(() => tick++, 700);
 	}
 	function refresh_off() {
-		if (tickTimer) {
-			clearInterval(tickTimer);
-			tickTimer = null;
-		}
+		refresh?.close();
+		refresh = null;
 	}
 	function place_near_launcher() {
 		winPos = {
@@ -216,10 +221,12 @@ shadow boundary keeps it from the dock — a built dock opened unstyled. -->
 			a.href = url;
 			a.download = `ogygia-trace-${Date.now()}.json`;
 			a.click();
+			// (the download is the page's, not the dock's: it lets go of the file even if the dock goes)
+			// oxlint-disable-next-line ogygia/owned-effects -- one-shot, ends itself, outlives the dock on purpose
 			setTimeout(() => URL.revokeObjectURL(url), 1000);
 			copied = 'saved as a file';
 		}
-		setTimeout(() => (copied = ''), 1600);
+		owner.timeout(() => (copied = ''), 1600);
 	}
 
 	// One-time setup: Alt+O toggle, the compiler's devtools metadata, and (re)starting the refresh timer
@@ -231,28 +238,27 @@ shadow boundary keeps it from the dock — a built dock opened unstyled. -->
 				toggle_open();
 			}
 		};
-		window.addEventListener('keydown', onkey);
+		owner.on(window, 'keydown', onkey);
 
 		// `names` (island id → component name) and `bytes` (island id → transitive dev-graph size) label
 		// the tabs with real names/costs. Best-effort — the endpoint only exists on the dev server (a
 		// build carries its names in the dock's own module: ui-app.ts).
 		if (!LAZY)
-			fetch('/__ogygia_devtools_meta')
-				.then((r) => (r.ok ? r.json() : null))
+			owner
+				.task((signal) =>
+					fetch('/__ogygia_devtools_meta', { signal }).then((r) => (r.ok ? r.json() : null))
+				)
 				.then((meta) => {
-					if (!meta || typeof meta !== 'object') return;
+					// (STALE: the dock unmounted first)
+					if (!meta || meta === STALE || typeof meta !== 'object') return;
 					if (meta.names) window.__ogygia_region_names = meta.names;
 					if (meta.bytes) window.__ogygia_region_bytes = meta.bytes;
 					tick++;
 				})
-				.catch(() => {});
+				.catch(() => {}); // ok: best effort (dev server only): without names the tabs show hashes
 
 		if (startOpen && !open) set_open(true);
 		else if (open) refresh_on();
-		return () => {
-			window.removeEventListener('keydown', onkey);
-			refresh_off();
-		};
 	});
 </script>
 

package/dist/devtools/IslandDetail.svelte

@@ -12,6 +12,7 @@
 	 */
 	import { parse } from 'devalue';
 	import { onDestroy } from 'svelte';
+	import { scope } from '@ogygia/machine';
 	import { highlight, clear_highlight } from './highlight.js';
 	import {
 		region_info,
@@ -142,14 +143,15 @@
 	});
 
 	// scroll to it AND mark it for a moment: an island already on screen gave no sign at all
-	/** @type {ReturnType<typeof setTimeout> | undefined} */
-	let flash;
+	const owner = scope();
+	onDestroy(() => owner.close());
+	/** @type {(() => void) | null} */
+	let unflash = null;
 	function locate() {
 		highlight([el], model.name, true);
-		clearTimeout(flash);
-		flash = setTimeout(clear_highlight, 1400);
+		unflash?.();
+		unflash = owner.timeout(clear_highlight, 1400);
 	}
-	onDestroy(() => clearTimeout(flash));
 </script>
 
 <div class="detail" data-og-detail>

package/dist/devtools/PageTab.svelte

@@ -9,6 +9,7 @@
 	 * waterfall of every island's wake (module → turn → hydrate, against FCP / LCP / DCL / load), the
 	 * files that blocked the first paint, and the bytes by type. The analysis is page-insights.ts.
 	 */
+	import { scope } from '@ogygia/machine';
 	import { read_page, cpu_of, summary_lines } from './page.js';
 	import { first_difference, rate } from '@ogygia/core/insights';
 	import { beacon_record_cpu } from '@ogygia/core/internal/instruments';
@@ -48,14 +49,15 @@
 	const nav_key = $derived(view?.nav?.t ?? 0);
 	$effect(() => {
 		void nav_key;
-		const id = setTimeout(
+		const s = scope();
+		s.timeout(
 			() => {
 				check_styles();
 				check_cache();
 			},
 			nav_key ? 400 : 60
 		);
-		return () => clearTimeout(id);
+		return () => s.close();
 	});
 	const findings = $derived.by(() => {
 		if (!view) return [];

package/dist/devtools/ProfilerTab.svelte

@@ -12,6 +12,7 @@
 	 * the rest of devtools, so the profiler answers without a key.
 	 */
 	import { onMount } from 'svelte';
+	import { scope } from '@ogygia/machine';
 	import { run_profile, profile_for, profiles_version } from './profile-store.js';
 	import { page_anchors } from './profile-anchors.js';
 	import { highlight, clear_highlight } from './highlight.js';
@@ -27,13 +28,18 @@
 	let error = $state('');
 	let bump = $state(0); // a new profile landed
 
+	/** The tab's profiles (their requests, their waits for a busy profiler): end with the tab. */
+	const owner = scope();
 	onMount(() => {
 		path = location.pathname;
 		// Probe: a mounted profiler answers its base (200/redirect); an un-mounted one 404s.
 		fetch(BASE, { method: 'GET', redirect: 'manual' })
 			.then((r) => (available = r.status !== 404))
 			.catch(() => (available = false));
-		return () => clear_highlight(); // leaving the tab takes the boxes off the page
+		return () => {
+			clear_highlight(); // leaving the tab takes the boxes off the page
+			owner.close();
+		};
 	});
 
 	const prof = $derived.by(() => {
@@ -57,7 +63,7 @@
 		started = performance.now();
 		const p = path.startsWith('/') ? path : '/' + path;
 		try {
-			await run_profile(p, runs, BASE);
+			if ((await run_profile(p, runs, BASE, owner)) === null) return; // the tab was left
 			bump++;
 		} catch (e) {
 			error = `The profile failed: ${e instanceof Error ? e.message : String(e)}`;

package/dist/devtools/SessionTab.svelte

@@ -20,6 +20,7 @@
 	 * Engine: session.ts; analysis: session-insights.ts.
 	 */
 	import { onMount } from 'svelte';
+	import { flights, scope } from '@ogygia/machine';
 	import { start_session, recording, set_last_session, session_names } from './session.js';
 	import { run_profile, slim_profile } from './profile-store.js';
 	import { analyze_session, session_timeline } from '@ogygia/core/insights';
@@ -51,13 +52,19 @@
 	let server_window = $state(
 		/** @type {import('./profile-store.js').SlimProfile & { window?: any } | null} */ (null)
 	);
-	/** @type {Promise<boolean> | null} */
-	let probe = null;
+	/** Is the profiler here? Asked once and kept; a probe the network failed is not kept (the next
+	 *  ask probes again), and reads as no for now. */
+	const probe = flights({
+		name: 'devtools profiler probe',
+		run: () =>
+			fetch('/__profiler', { redirect: 'manual' }).then((r) => (profiler_here = r.status !== 404))
+	});
 	const probe_profiler = () =>
-		(probe ??= fetch('/__profiler', { redirect: 'manual' })
-			.then((r) => (profiler_here = r.status !== 404))
-			.catch(() => (profiler_here = false)));
-	onMount(() => void probe_profiler());
+		probe.get().then(
+			(here) => here === true,
+			() => (profiler_here = false)
+		);
+	onMount(() => void probe_profiler()); // ok: never rejects (a failed probe reads as no profiler)
 	let window_on = false;
 	/** the window's start in flight (a stop pressed before it answered waits, then stops it) */
 	let window_starting = /** @type {Promise<void> | null} */ (null);
@@ -174,12 +181,15 @@
 	let server = $state(
 		/** @type {Record<string, { busy?: boolean; error?: string; p?: import('./profile-store.js').SlimProfile }>} */ ({})
 	);
+	/** The tab's server profiles (their requests, their waits for a busy profiler): end with the tab. */
+	const owner = scope();
 	async function profile_request(url) {
 		const u = new URL(url);
 		const path = u.pathname + u.search;
 		server = { ...server, [url]: { busy: true } };
 		try {
-			const p = await run_profile(path, 3);
+			const p = await run_profile(path, 3, '/__profiler', owner);
+			if (p === null) return; // the tab was left
 			server = { ...server, [url]: { p } };
 		} catch (e) {
 			server = { ...server, [url]: { error: e instanceof Error ? e.message : String(e) } };
@@ -193,7 +203,10 @@
 				? (n / 1024).toFixed(1) + ' KB'
 				: (n / 1048576).toFixed(1) + ' MB';
 
-	onMount(() => () => clear_highlight());
+	onMount(() => () => {
+		clear_highlight();
+		owner.close();
+	});
 </script>
 
 <div class="rec" data-og-session>

package/dist/devtools/highlight.js

@@ -1,3 +1,4 @@
+import { scope } from "@ogygia/machine";
 // src/devtools/highlight.ts
 /**
 * Light up MANY elements on the page at once — the profile's "these 290 shadow roots", "every
@@ -9,14 +10,16 @@ let root = null;
 let layer = null;
 let current = [];
 let label = "";
-let frame = 0;
+/** The layer while it is shown: its scroll and resize watch and its queued frame. Hiding it closes. */
+let shown = null;
+let queued = false;
 const MAX_BOXES = 400;
 /** The dock's shadow root (ui-app.ts sets it at mount). */
 function set_highlight_root(r) {
 	root = r;
 }
 function draw() {
-	frame = 0;
+	queued = false;
 	if (!layer) return;
 	layer.textContent = "";
 	const vw = innerWidth;
@@ -40,7 +43,9 @@ function draw() {
 	}
 }
 const schedule = () => {
-	if (!frame) frame = requestAnimationFrame(draw);
+	if (queued || !shown) return;
+	queued = true;
+	shown.timeout(draw, "frame");
 };
 /** Show boxes over `els` (with a caption); `scroll` brings the first into view. */
 function highlight(els, caption = "", scroll = false) {
@@ -52,11 +57,12 @@ function highlight(els, caption = "", scroll = false) {
 		layer.setAttribute("data-og-highlight", "");
 		layer.style.cssText = "position:fixed;inset:0;pointer-events:none;z-index:2147483600";
 		root.prepend(layer);
-		addEventListener("scroll", schedule, {
+		shown = scope();
+		shown.on(globalThis, "scroll", schedule, {
 			passive: true,
 			capture: true
 		});
-		addEventListener("resize", schedule, { passive: true });
+		shown.on(globalThis, "resize", schedule, { passive: true });
 	}
 	if (scroll && els[0]) try {
 		els[0].scrollIntoView({
@@ -72,8 +78,9 @@ function clear_highlight() {
 	if (layer) {
 		layer.remove();
 		layer = null;
-		removeEventListener("scroll", schedule, { capture: true });
-		removeEventListener("resize", schedule);
+		shown?.close();
+		shown = null;
+		queued = false;
 	}
 }
 /** How many boxes are shown now (tests). */

package/dist/devtools/ledger-dom.js

@@ -2,6 +2,7 @@ import { byte_ledger } from "./bytes.js";
 import { all_regions, region_name } from "./regions.js";
 import { dynamic_imports, static_imports } from "@ogygia/core/insights";
 import { ISLAND_GRAPH_ATTR, decode_island_graph, tool_fetch, tool_made } from "@ogygia/core/internal/instruments";
+import { STALE, flights } from "@ogygia/machine";
 // src/devtools/ledger-dom.ts
 /**
 * The byte ledger's DOM side: the page's island graph (`script[data-ogygia-graph]`, a build writes
@@ -41,15 +42,11 @@ function runtime_parts(src) {
 	return parts.read;
 }
 async function read_parts(src) {
-	const cache = /* @__PURE__ */ new Map();
-	const text = (u) => {
-		let t = cache.get(u);
-		if (!t) {
-			t = tool_fetch(u, { cache: "force-cache" }).then((r) => r.ok ? r.text() : "").catch(() => "");
-			cache.set(u, t);
-		}
-		return t;
-	};
+	const texts = flights({
+		name: "devtools runtime parts",
+		run: (u) => tool_fetch(u, { cache: "force-cache" }).then((r) => r.ok ? r.text() : "")
+	});
+	const text = (u) => texts.get(u).then((t) => t === STALE ? "" : t, () => "");
 	const self = import.meta.url;
 	const roots = /* @__PURE__ */ new Map();
 	const dock = [];

package/dist/devtools/names.js

@@ -1,15 +1,16 @@
+import { flights } from "@ogygia/machine";
 import { names } from "virtual:ogygia/devtools-meta";
 // src/devtools/names.ts
 /**
 * The islands' component names for the dock and the testing API: a build carries them in
 * `virtual:ogygia/devtools-meta`; the dev server serves them live (`/__ogygia_devtools_meta`, the
 * registry as it is now). Both land on `window.__ogygia_region_names`, which regions.ts reads.
-* Once per page; best effort (a hash stands in for a name it cannot find).
+* Once per page; best effort (a hash stands in for a name it cannot find). A fetch that failed (the
+* network, not an answer) is not kept: the next ask fetches again.
 */
-let loading = null;
-function ensure_region_names() {
-	if (loading) return loading;
-	loading = (async () => {
+const loading = flights({
+	name: "devtools region names",
+	run: async () => {
 		if (typeof window === "undefined") return;
 		if (names && Object.keys(names).length) {
 			window.__ogygia_region_names = {
@@ -18,17 +19,17 @@ function ensure_region_names() {
 			};
 			return;
 		}
-		try {
-			const r = await fetch("/__ogygia_devtools_meta");
-			if (!r.ok) return;
-			const meta = await r.json();
-			if (meta?.names) window.__ogygia_region_names = {
-				...meta.names,
-				...window.__ogygia_region_names
-			};
-			if (meta?.bytes) window.__ogygia_region_bytes = meta.bytes;
-		} catch {}
-	})();
-	return loading;
+		const r = await fetch("/__ogygia_devtools_meta");
+		if (!r.ok) return;
+		const meta = await r.json().catch(() => null);
+		if (meta?.names) window.__ogygia_region_names = {
+			...meta.names,
+			...window.__ogygia_region_names
+		};
+		if (meta?.bytes) window.__ogygia_region_bytes = meta.bytes;
+	}
+});
+function ensure_region_names() {
+	return loading.get().then(() => {}, () => {});
 }
 export { ensure_region_names };

package/dist/devtools/page.d.ts

@@ -34,6 +34,8 @@ export interface PageView {
   holes_failed?: HoleFailure[];
 }
 export declare function region_facts(): RegionFact[];
+export declare function prebundled_packages(script_urls: readonly string[]): string[] | null;
+export declare function vary_of(url: string): string | null;
 /** This page's hydration failures, each island once: after an in-app navigation, the ones since it,
  *  and an earlier one only while its region is still on the page and still not awake (a kept
  *  island). Every visit to a page with a broken island failed it again: without this, the tab listed

package/dist/devtools/page.js

@@ -6,6 +6,7 @@ import { with_source_lines } from "./source-lines.js";
 import { since_load } from "./since-load.js";
 import { analyze_cpu, analyze_page, browser_of, defer_keys, dev_compile_ms, fp_compare, is_trace, prebundled_names, vital_parts } from "@ogygia/core/insights";
 import { PAGE_DEFER_KEY, PAGE_DEFER_REGISTRY_KEY, PAGE_SEED_SELECTOR, beacon_page, hole_request_times, is_headless, tool_fetch } from "@ogygia/core/internal/instruments";
+import { flights } from "@ogygia/machine";
 import { snapshot } from "@ogygia/core/events";
 // src/devtools/page.ts
 /**
@@ -166,29 +167,42 @@ function shown_under_media(el) {
 /** THE DEV SERVER'S PRE-BUNDLED PACKAGES, read once from its `.vite/deps/_metadata.json` (the folder of
 *  a pre-bundled script the page loaded — no guess at the app's base): the names its `optimized` keys
 *  belong to. Null until read; never off the dev server, nor on a page that loaded no pre-bundled file. */
-let prebundled = null;
-let prebundled_asked = false;
+const prebundled = flights({
+	name: "devtools prebundled packages",
+	run: async (dir, signal) => {
+		const r = await tool_fetch(dir + "_metadata.json", { signal });
+		if (r.status >= 500) throw new Error(`status ${r.status}`);
+		const m = r.ok ? await r.json() : null;
+		return prebundled_names(Object.keys(m?.optimized ?? {}));
+	}
+});
 function prebundled_packages(script_urls) {
-	if (!import.meta.env.DEV || prebundled_asked) return prebundled;
+	if (!import.meta.env.DEV) return null;
 	const one = script_urls.find((u) => u.includes("/node_modules/.vite/deps/"));
 	if (!one) return null;
-	prebundled_asked = true;
-	const dir = one.slice(0, one.indexOf("/node_modules/.vite/deps/") + 25);
-	tool_fetch(dir + "_metadata.json").then((r) => r.ok ? r.json() : null).then((m) => {
-		prebundled = prebundled_names(Object.keys(m?.optimized ?? {}));
-	}).catch(() => {});
-	return null;
+	return asked(prebundled, one.slice(0, one.indexOf("/node_modules/.vite/deps/") + 25));
 }
 /** A FILE THE BROWSER DOWNLOADED AGAIN: its answer's `Vary` header, asked once per URL with a HEAD
 *  (a tool's request, out of every measurement). Null until it is in, or when the answer has none. */
-const varies = /* @__PURE__ */ new Map();
-function vary_of(url) {
-	if (varies.has(url)) return varies.get(url) ?? null;
-	varies.set(url, null);
-	tool_fetch(url, {
+const varies = flights({
+	name: "devtools vary",
+	run: (url, signal) => tool_fetch(url, {
 		method: "HEAD",
-		cache: "no-store"
-	}).then((r) => varies.set(url, r.headers.get("vary"))).catch(() => {});
+		cache: "no-store",
+		signal
+	}).then((r) => r.headers.get("vary"))
+});
+function vary_of(url) {
+	return asked(varies, url);
+}
+/** What the dev server answered for `key`, read without waiting: the kept answer, or null while it
+*  is asked (the first read starts the ask). An answer is kept for the session; a failed ask is not,
+*  so a later read asks again. A read while the document goes (the `pagehide` save) asks nothing: the
+*  request could not land, and WebKit says the cancelled fetch as a page error. */
+function asked(f, key) {
+	const e = f.peek(key);
+	if (e?.kind === "kept") return e.answer;
+	if (e === void 0 && !leaving) f.get(key).catch(() => {});
 	return null;
 }
 function first_child_top(el) {
@@ -902,15 +916,21 @@ function install_page_hook() {
 	if (typeof window !== "undefined" && !hooked_hide) {
 		hooked_hide = true;
 		addEventListener("pagehide", () => {
+			leaving = true;
 			try {
 				const v = read_page();
 				if (v && !v.nav) sessionStorage.setItem(LOAD_KEY + location.pathname, JSON.stringify(snapshot_of(v)));
 			} catch {}
 		});
+		addEventListener("pageshow", () => {
+			leaving = false;
+		});
 	}
 }
 const LOAD_KEY = "ogygia:devtools:load:";
 let hooked_hide = false;
+/** The document is going (`pagehide`, until a `pageshow` brings it back): reads ask the server nothing. */
+let leaving = false;
 /** the previous load's picture of THIS page, read once per document (before this load overwrites it) */
 let prev_load;
 function previous_load() {
@@ -954,4 +974,4 @@ function snapshot_of(v) {
 		...v.report.findings.some((f) => f.dev_compile && (f.code === "shift-cause" || f.code === "vital-cls")) ? { cls_dev: true } : {}
 	};
 }
-export { cpu_of, failures, held_open, hole_batches, hole_failures, hole_waits, install_page_hook, last_nav, read_page, region_facts, since_nav, summary_lines, unmeasured };
+export { cpu_of, failures, held_open, hole_batches, hole_failures, hole_waits, install_page_hook, last_nav, prebundled_packages, read_page, region_facts, since_nav, summary_lines, unmeasured, vary_of };

package/dist/devtools/profile-store.d.ts

@@ -1,10 +1,4 @@
-/**
- * The devtools' copy of the last SSR profile per page — the native Profiler tab writes it, the Lens
- * roster and the island detail read it (joined by fingerprint, then by entry), so a server cost sits
- * next to the browser's numbers for the same island. Kept SLIM: the profiler's JSON answer is
- * hundreds of KB; the dock needs the score, the forecast, the findings, the islands, the top
- * components and the calls. The slim copy also survives a reload (sessionStorage, best effort).
- */
+import { Scope } from "@ogygia/machine";
 export interface SlimIsland {
   name: string;
   fp: string | null;
@@ -155,9 +149,10 @@ export interface SlimProfile {
 }
 /**
  * Profile a same-origin path on the server, now (the profiler's `/page?format=json`; a 409 = the
- * recorder is busy: wait and ask again). Stores the slim copy and returns it.
+ * recorder is busy: wait and ask again, `fetch_when_free`). Stores the slim copy and returns it;
+ * `null` once `owner` (the tab that asked) ended first.
  */
-export declare function run_profile(path: string, runs?: number, base?: string): Promise<SlimProfile>;
+export declare function run_profile(path: string, runs: number, base: string, owner: Scope): Promise<SlimProfile | null>;
 /**
  * A record of the profiler's JSON answer, untyped on the wire (and possibly from another version):
  * read deep and tolerant (`r.since?.score?.a`), with every value checked before use (`num`, `str`,

package/dist/devtools/profile-store.js

@@ -1,30 +1,35 @@
+import { fetch_when_free } from "../profiler/busy.js";
+import { STALE } from "@ogygia/machine";
 // src/devtools/profile-store.ts
 /**
+* The devtools' copy of the last SSR profile per page — the native Profiler tab writes it, the Lens
+* roster and the island detail read it (joined by fingerprint, then by entry), so a server cost sits
+* next to the browser's numbers for the same island. Kept SLIM: the profiler's JSON answer is
+* hundreds of KB; the dock needs the score, the forecast, the findings, the islands, the top
+* components and the calls. The slim copy also survives a reload (sessionStorage, best effort).
+*/
+/**
 * Profile a same-origin path on the server, now (the profiler's `/page?format=json`; a 409 = the
-* recorder is busy: wait and ask again). Stores the slim copy and returns it.
+* recorder is busy: wait and ask again, `fetch_when_free`). Stores the slim copy and returns it;
+* `null` once `owner` (the tab that asked) ended first.
 */
-async function run_profile(path, runs = 3, base = "/__profiler") {
+async function run_profile(path, runs, base, owner) {
 	const url = `${base}/page?p=${encodeURIComponent(path)}&runs=${runs}&format=json`;
-	for (let tries = 0; tries < 30; tries++) {
-		const r = await fetch(url, { headers: { accept: "application/json" } });
-		if (r.status === 409) {
-			await new Promise((ok) => setTimeout(ok, 2e3));
-			continue;
-		}
-		if (!r.ok) {
-			const text = await r.text();
-			let said = text;
-			try {
-				const j = JSON.parse(text);
-				said = typeof j.error === "string" ? j.error : typeof j.message === "string" ? j.message : text;
-			} catch {}
-			throw new Error(r.status === 503 ? said.slice(0, 600) : `the profiler answered ${r.status}: ${said.slice(0, 300)}`);
-		}
-		const p = slim_profile(await r.json());
-		set_profile(p);
-		return p;
+	const r = await fetch_when_free(owner, url, { headers: { accept: "application/json" } });
+	if (r === STALE) return null;
+	if (r.status === 409) throw new Error("another profile kept the recorder busy for two minutes");
+	if (!r.ok) {
+		const text = await r.text();
+		let said = text;
+		try {
+			const j = JSON.parse(text);
+			said = typeof j.error === "string" ? j.error : typeof j.message === "string" ? j.message : text;
+		} catch {}
+		throw new Error(r.status === 503 ? said.slice(0, 600) : `the profiler answered ${r.status}: ${said.slice(0, 300)}`);
 	}
-	throw new Error("another profile kept the recorder busy for a minute");
+	const p = slim_profile(await r.json());
+	set_profile(p);
+	return p;
 }
 const num = (v) => typeof v === "number" && Number.isFinite(v) ? v : null;
 const str = (v) => typeof v === "string" ? v : null;