nuxt-devtools-observatory 0.1.18 → 0.1.19

package/client/src/views/RenderHeatmap.vue

@@ -177,14 +177,19 @@ const activeRoute = ref('')
 // Separate thresholds per mode so switching modes doesn't produce nonsense results.
 // Count: flag components that rendered 3+ times (1 hydration mount is normal).
 // Time: flag components averaging 16ms+ (one animation frame budget).
-const countThreshold = ref(3)
-const timeThreshold = ref(16)
+const COUNT_THRESHOLD = import.meta.env.VITE_OBSERVATORY_HEATMAP_THRESHOLD_COUNT ?? 3
+const TIME_THRESHOLD = import.meta.env.VITE_OBSERVATORY_HEATMAP_THRESHOLD_TIME ?? 1600
+const countThreshold = ref(Number(COUNT_THRESHOLD))
+const timeThreshold = ref(Number(TIME_THRESHOLD))
 // Writable computed so the threshold slider can use v-model directly.
 const activeThreshold = computed({
     get: () => (activeMode.value === 'count' ? countThreshold.value : timeThreshold.value),
     set: (val: number) => {
-        if (activeMode.value === 'count') countThreshold.value = val
-        else timeThreshold.value = val
+        if (activeMode.value === 'count') {
+            countThreshold.value = val
+        } else {
+            timeThreshold.value = val
+        }
     },
 })
 const activeHotOnly = ref(false)
@@ -299,6 +304,7 @@ function countSubtree(node: ComponentNode): number {
 function collectIds(node: ComponentNode, target = new Set<string>()) {
     target.add(node.id)
     node.children.forEach((child) => collectIds(child, target))
+
     return target
 }
 
@@ -344,13 +350,16 @@ function defaultExpandedIds(root: ComponentNode | null) {
     // Expand all nodes that have children — gives a fully-open tree on first load.
     // The user can collapse individual branches as needed.
     const expanded = new Set<string>()
+
     function expandAll(node: ComponentNode) {
         if (node.children.length > 0) {
             expanded.add(node.id)
             node.children.forEach(expandAll)
         }
     }
+
     expandAll(root)
+
     return expanded
 }
 
@@ -413,10 +422,16 @@ function subtreeHasHotNode(node: ComponentNode): boolean {
 }
 
 function nodeMatchesRoute(node: ComponentNode): boolean {
-    if (!activeRoute.value) return true
+    if (!activeRoute.value) {
+        return true
+    }
+
     // A component is visible for a route if it was first seen on that route
     // OR if any of its timeline events happened on that route.
-    if (node.route === activeRoute.value) return true
+    if (node.route === activeRoute.value) {
+        return true
+    }
+
     return node.timeline.some((e) => e.route === activeRoute.value)
 }
 
@@ -495,8 +510,12 @@ const appEntries = computed(() =>
 
 const knownRoutes = computed(() => {
     const routes = new Set<string>()
+
     for (const node of allComponents.value) {
-        if (node.route) routes.add(node.route)
+        if (node.route) {
+            routes.add(node.route)
+        }
+
         for (const event of node.timeline) {
             if (event.route) routes.add(event.route)
         }
@@ -525,6 +544,7 @@ watch(
             activeSelectedId.value = null
             expandedIds.value = new Set()
             expansionReady.value = false
+
             return
         }
 
@@ -544,12 +564,12 @@ watch(
         if (!expansionReady.value) {
             expandedIds.value = defaultExpandedIds(activeRoot.value)
             expansionReady.value = true
+
             return
         }
 
         if (!search.value.trim() && activeSelectedId.value && activeRoot.value) {
             const selectedPath = pathToNode(activeRoot.value, activeSelectedId.value) ?? []
-
             selectedPath.forEach((id) => preserved.add(id))
         }
 
@@ -567,13 +587,14 @@ watch(search, (term) => {
 
     if (normalized) {
         expandedIds.value = searchExpandedIds(activeRoot.value, normalized)
+
         return
     }
 
     if (activeSelectedId.value) {
         const selectedPath = pathToNode(activeRoot.value, activeSelectedId.value)
-
         expandedIds.value = selectedPath ? new Set(selectedPath) : defaultExpandedIds(activeRoot.value)
+
         return
     }
 
@@ -589,6 +610,7 @@ watch([activeHotOnly, activeThreshold, activeMode, filteredRoots], () => {
 
     if (!topLevelRoot) {
         activeSelectedId.value = null
+
         return
     }
 
@@ -596,6 +618,7 @@ watch([activeHotOnly, activeThreshold, activeMode, filteredRoots], () => {
 
     if (!firstHot) {
         activeSelectedId.value = null
+
         return
     }
 
@@ -646,6 +669,7 @@ function toggleFreeze() {
     if (frozen.value) {
         frozen.value = false
         frozenSnapshot.value = []
+
         return
     }
 
@@ -663,9 +687,16 @@ function basename(file: string) {
 }
 
 function openInEditor(file: string) {
-    if (!file || file === 'unknown') return
+    if (!file || file === 'unknown') {
+        return
+    }
+
     const origin = getObservatoryOrigin()
-    if (!origin) return
+
+    if (!origin) {
+        return
+    }
+
     window.top?.postMessage({ type: 'observatory:open-in-editor', file }, origin)
 }
 

package/dist/module.d.mts

@@ -1,6 +1,36 @@
 import * as _nuxt_schema from '@nuxt/schema';
 
 interface ModuleOptions {
+    /**
+     * Maximum number of fetch entries to keep in memory
+     * @default 200
+     */
+    maxFetchEntries?: number;
+    /**
+     * Maximum payload size (bytes) to store per fetch entry
+     * @default 10000
+     */
+    maxPayloadBytes?: number;
+    /**
+     * Maximum number of transition entries to keep in memory
+     * @default 500
+     */
+    maxTransitions?: number;
+    /**
+     * Maximum number of composable history events per entry
+     * @default 50
+     */
+    maxComposableHistory?: number;
+    /**
+     * Maximum number of composable entries to keep in memory
+     * @default 300
+     */
+    maxComposableEntries?: number;
+    /**
+     * Maximum number of render timeline events per entry
+     * @default 100
+     */
+    maxRenderTimeline?: number;
     /**
      * Enable the useFetch / useAsyncData dashboard tab
      * @default true
@@ -28,9 +58,14 @@ interface ModuleOptions {
     transitionTracker?: boolean;
     /**
      * Minimum render count / ms threshold to highlight in the heatmap
-     * @default 5
+     * @default 3
+     */
+    heatmapThresholdCount?: number;
+    /**
+     * Minimum render count / ms threshold to highlight in the heatmap
+     * @default 1600
      */
-    heatmapThreshold?: number;
+    heatmapThresholdTime?: number;
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
 

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": "^3.0.0 || ^4.0.0"
   },
-  "version": "0.1.18",
+  "version": "0.1.19",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -524,7 +524,14 @@ const module$1 = defineNuxtModule({
     composableTracker: true,
     renderHeatmap: true,
     transitionTracker: true,
-    heatmapThreshold: 5
+    heatmapThresholdCount: process.env.OBSERVATORY_HEATMAP_THRESHOLD_COUNT ? Number(process.env.OBSERVATORY_HEATMAP_THRESHOLD_COUNT) : 3,
+    heatmapThresholdTime: process.env.OBSERVATORY_HEATMAP_THRESHOLD_TIME ? Number(process.env.OBSERVATORY_HEATMAP_THRESHOLD_TIME) : 1600,
+    maxFetchEntries: process.env.OBSERVATORY_MAX_FETCH_ENTRIES ? Number(process.env.OBSERVATORY_MAX_FETCH_ENTRIES) : 200,
+    maxPayloadBytes: process.env.OBSERVATORY_MAX_PAYLOAD_BYTES ? Number(process.env.OBSERVATORY_MAX_PAYLOAD_BYTES) : 1e4,
+    maxTransitions: process.env.OBSERVATORY_MAX_TRANSITIONS ? Number(process.env.OBSERVATORY_MAX_TRANSITIONS) : 500,
+    maxComposableHistory: process.env.OBSERVATORY_MAX_COMPOSABLE_HISTORY ? Number(process.env.OBSERVATORY_MAX_COMPOSABLE_HISTORY) : 50,
+    maxComposableEntries: process.env.OBSERVATORY_MAX_COMPOSABLE_ENTRIES ? Number(process.env.OBSERVATORY_MAX_COMPOSABLE_ENTRIES) : 300,
+    maxRenderTimeline: process.env.OBSERVATORY_MAX_RENDER_TIMELINE ? Number(process.env.OBSERVATORY_MAX_RENDER_TIMELINE) : 100
   },
   setup(options, nuxt) {
     if (!nuxt.options.dev) {
@@ -534,6 +541,21 @@ const module$1 = defineNuxtModule({
       process.env.LAUNCH_EDITOR = "code";
     }
     const resolver = createResolver(import.meta.url);
+    const resolved = {
+      fetchDashboard: options.fetchDashboard ?? (process.env.OBSERVATORY_FETCH_DASHBOARD ? process.env.OBSERVATORY_FETCH_DASHBOARD === "true" : true),
+      provideInjectGraph: options.provideInjectGraph ?? (process.env.OBSERVATORY_PROVIDE_INJECT_GRAPH ? process.env.OBSERVATORY_PROVIDE_INJECT_GRAPH === "true" : true),
+      composableTracker: options.composableTracker ?? (process.env.OBSERVATORY_COMPOSABLE_TRACKER ? process.env.OBSERVATORY_COMPOSABLE_TRACKER === "true" : true),
+      renderHeatmap: options.renderHeatmap ?? (process.env.OBSERVATORY_RENDER_HEATMAP ? process.env.OBSERVATORY_RENDER_HEATMAP === "true" : true),
+      transitionTracker: options.transitionTracker ?? (process.env.OBSERVATORY_TRANSITION_TRACKER ? process.env.OBSERVATORY_TRANSITION_TRACKER === "true" : true),
+      heatmapThresholdCount: options.heatmapThresholdCount ?? (process.env.OBSERVATORY_HEATMAP_THRESHOLD_COUNT ? Number(process.env.OBSERVATORY_HEATMAP_THRESHOLD_COUNT) : 3),
+      heatmapThresholdTime: options.heatmapThresholdTime ?? (process.env.OBSERVATORY_HEATMAP_THRESHOLD_TIME ? Number(process.env.OBSERVATORY_HEATMAP_THRESHOLD_TIME) : 1600),
+      maxFetchEntries: options.maxFetchEntries ?? (process.env.OBSERVATORY_MAX_FETCH_ENTRIES ? Number(process.env.OBSERVATORY_MAX_FETCH_ENTRIES) : 200),
+      maxPayloadBytes: options.maxPayloadBytes ?? (process.env.OBSERVATORY_MAX_PAYLOAD_BYTES ? Number(process.env.OBSERVATORY_MAX_PAYLOAD_BYTES) : 1e4),
+      maxTransitions: options.maxTransitions ?? (process.env.OBSERVATORY_MAX_TRANSITIONS ? Number(process.env.OBSERVATORY_MAX_TRANSITIONS) : 500),
+      maxComposableHistory: options.maxComposableHistory ?? (process.env.OBSERVATORY_MAX_COMPOSABLE_HISTORY ? Number(process.env.OBSERVATORY_MAX_COMPOSABLE_HISTORY) : 50),
+      maxComposableEntries: options.maxComposableEntries ?? (process.env.OBSERVATORY_MAX_COMPOSABLE_ENTRIES ? Number(process.env.OBSERVATORY_MAX_COMPOSABLE_ENTRIES) : 300),
+      maxRenderTimeline: options.maxRenderTimeline ?? (process.env.OBSERVATORY_MAX_RENDER_TIMELINE ? Number(process.env.OBSERVATORY_MAX_RENDER_TIMELINE) : 100)
+    };
     nuxt.hook("vite:extendConfig", (config) => {
       const alias = config.resolve?.alias;
       const aliases = Array.isArray(alias) ? {} : alias ?? {};
@@ -544,22 +566,22 @@ const module$1 = defineNuxtModule({
       aliases["nuxt-devtools-observatory/runtime/fetch-registry"] = resolver.resolve("./runtime/composables/fetch-registry");
       config.resolve = { ...config.resolve, alias: aliases };
     });
-    if (options.fetchDashboard) {
+    if (resolved.fetchDashboard) {
       addVitePlugin(fetchInstrumentPlugin());
     }
-    if (options.provideInjectGraph) {
+    if (resolved.provideInjectGraph) {
       addVitePlugin(provideInjectPlugin());
     }
-    if (options.composableTracker) {
+    if (resolved.composableTracker) {
       addVitePlugin(composableTrackerPlugin());
     }
-    if (options.transitionTracker) {
+    if (resolved.transitionTracker) {
       addVitePlugin(transitionTrackerPlugin());
     }
-    if (options.fetchDashboard || options.provideInjectGraph || options.composableTracker || options.renderHeatmap || options.transitionTracker) {
+    if (resolved.fetchDashboard || resolved.provideInjectGraph || resolved.composableTracker || resolved.renderHeatmap || resolved.transitionTracker) {
       addPlugin(resolver.resolve("./runtime/plugin"));
     }
-    if (options.fetchDashboard) {
+    if (resolved.fetchDashboard) {
       addServerPlugin(resolver.resolve("./runtime/nitro/fetch-capture"));
     }
     const CLIENT_PORT = 4949;
@@ -590,56 +612,38 @@ const module$1 = defineNuxtModule({
       });
     });
     const base = clientOrigin;
-    nuxt.hook("devtools:customTabs", (tabs) => {
-      if (options.fetchDashboard) {
-        tabs.push({
-          name: "observatory-fetch",
-          title: "useFetch",
-          icon: "carbon:radio-button",
-          view: { type: "iframe", src: `${base}/fetch` }
-        });
+    nuxt.hook("render:response", (response, { url }) => {
+      if (url.startsWith("/trackers") || url === "/" || url.startsWith("/index.html")) {
+        const configScript = `<script>window.__observatoryConfig = ${JSON.stringify(nuxt.options.runtimeConfig.public.observatory)};<\/script>`;
+        response.body = response.body.replace("<head>", `<head>
+${configScript}`);
       }
-      if (options.provideInjectGraph) {
-        tabs.push({
-          name: "observatory-provide",
-          title: "provide/inject",
-          icon: "carbon:branch",
-          view: { type: "iframe", src: `${base}/provide` }
-        });
-      }
-      if (options.composableTracker) {
-        tabs.push({
-          name: "observatory-composables",
-          title: "Composables",
-          icon: "carbon:function",
-          view: { type: "iframe", src: `${base}/composables` }
-        });
-      }
-      if (options.renderHeatmap) {
+    });
+    nuxt.hook("devtools:customTabs", (tabs) => {
+      if (resolved.fetchDashboard || resolved.provideInjectGraph || resolved.composableTracker || resolved.renderHeatmap || resolved.transitionTracker) {
         tabs.push({
-          name: "observatory-heatmap",
-          title: "Heatmap",
+          name: "observatory-trackers",
+          title: "Observatory Trackers",
           icon: "carbon:heat-map",
-          view: { type: "iframe", src: `${base}/heatmap` }
-        });
-      }
-      if (options.transitionTracker) {
-        tabs.push({
-          name: "observatory-transitions",
-          title: "Transitions",
-          icon: "carbon:movement",
-          view: { type: "iframe", src: `${base}/transitions` }
+          view: { type: "iframe", src: `${base}/trackers` }
         });
       }
     });
     nuxt.options.runtimeConfig.public.observatory = {
-      heatmapThreshold: options.heatmapThreshold ?? 5,
+      heatmapThresholdCount: resolved.heatmapThresholdCount,
+      heatmapThresholdTime: resolved.heatmapThresholdTime,
       clientOrigin,
-      fetchDashboard: options.fetchDashboard,
-      provideInjectGraph: options.provideInjectGraph,
-      composableTracker: options.composableTracker,
-      renderHeatmap: options.renderHeatmap,
-      transitionTracker: options.transitionTracker
+      fetchDashboard: resolved.fetchDashboard,
+      provideInjectGraph: resolved.provideInjectGraph,
+      composableTracker: resolved.composableTracker,
+      renderHeatmap: resolved.renderHeatmap,
+      transitionTracker: resolved.transitionTracker,
+      maxFetchEntries: resolved.maxFetchEntries,
+      maxPayloadBytes: resolved.maxPayloadBytes,
+      maxTransitions: resolved.maxTransitions,
+      maxComposableHistory: resolved.maxComposableHistory,
+      maxComposableEntries: resolved.maxComposableEntries,
+      maxRenderTimeline: resolved.maxRenderTimeline
     };
   }
 });

package/dist/runtime/composables/composable-registry.d.ts

@@ -41,7 +41,20 @@ export interface ComposableEntry {
  * - `register`: Registers a new composable entry.
  * - `update`: Updates an existing composable entry.
  * - `getAll`: Retrieves all composable entries.
- * @returns {{ register: (entry: ComposableEntry) => void, update: (id: string, patch: Partial<ComposableEntry>) => void, getAll: () => ComposableEntry[] }} An object with `register`, `update`, and `getAll` methods.
+ * - `getSnapshot`: Returns a cached pre-serialized JSON string, rebuilt only when dirty.
+ * @returns {{
+ *   register: (entry: ComposableEntry) => void,
+ *   registerLiveRefs: (id: string, refs: Record<string, import('vue').Ref<unknown>>) => void,
+ *   registerRawRefs: (id: string, refs: Record<string, unknown>) => void,
+ *   onComposableChange: (cb: () => void) => void,
+ *   clear: () => void,
+ *   setRoute: (path: string) => void,
+ *   getRoute: () => string,
+ *   update: (id: string, patch: Partial<ComposableEntry>) => void,
+ *   getAll: () => ComposableEntry[],
+ *   getSnapshot: () => string,
+ *   editValue: (id: string, key: string, value: unknown) => void
+ * }} An object with `register`, `update`, `getAll`, `getSnapshot`, and related methods.
  */
 export declare function setupComposableRegistry(): {
     register: (entry: ComposableEntry) => void;
@@ -53,6 +66,7 @@ export declare function setupComposableRegistry(): {
     getRoute: () => string;
     update: (id: string, patch: Partial<ComposableEntry>) => void;
     getAll: () => ComposableEntry[];
+    getSnapshot: () => string;
     editValue: (id: string, key: string, value: unknown) => void;
 };
 export declare function __trackComposable<T>(name: string, callFn: () => T, meta: {

package/dist/runtime/composables/composable-registry.js

@@ -1,16 +1,22 @@
-import { ref, isRef, isReactive, isReadonly, unref, computed, watchEffect, getCurrentInstance, onUnmounted } from "vue";
+import { isRef, isReactive, isReadonly, unref, computed, watchEffect, getCurrentInstance, onUnmounted } from "vue";
 export function setupComposableRegistry() {
-  const entries = ref(/* @__PURE__ */ new Map());
+  const entries = /* @__PURE__ */ new Map();
   const liveRefs = /* @__PURE__ */ new Map();
   const liveRefWatchers = /* @__PURE__ */ new Map();
-  const MAX_HISTORY = 50;
-  const MAX_COMPOSABLE_ENTRIES = 300;
-  const entryHistory2 = /* @__PURE__ */ new Map();
+  const MAX_HISTORY = typeof process !== "undefined" && process.env.OBSERVATORY_MAX_COMPOSABLE_HISTORY ? Number(process.env.OBSERVATORY_MAX_COMPOSABLE_HISTORY) : 50;
+  const MAX_COMPOSABLE_ENTRIES = typeof process !== "undefined" && process.env.OBSERVATORY_MAX_COMPOSABLE_ENTRIES ? Number(process.env.OBSERVATORY_MAX_COMPOSABLE_ENTRIES) : 300;
+  const entryHistory = /* @__PURE__ */ new Map();
   const prevValues = /* @__PURE__ */ new Map();
   const rawRefs = /* @__PURE__ */ new Map();
   const sharedKeysCache = /* @__PURE__ */ new Map();
+  let dirty = true;
+  let cachedSnapshot = "[]";
+  function markDirty() {
+    dirty = true;
+  }
   function invalidateSharedKeysForName(name) {
     sharedKeysCache.delete(name);
+    markDirty();
   }
   function deleteEntry(entryId, entryName) {
     const stop = liveRefWatchers.get(entryId);
@@ -21,8 +27,8 @@ export function setupComposableRegistry() {
     liveRefs.delete(entryId);
     rawRefs.delete(entryId);
     prevValues.delete(entryId);
-    entryHistory2.delete(entryId);
-    entries.value.delete(entryId);
+    entryHistory.delete(entryId);
+    entries.delete(entryId);
     invalidateSharedKeysForName(entryName);
   }
   function getSharedKeys(id, name) {
@@ -32,7 +38,7 @@ export function setupComposableRegistry() {
     }
     nameCache = /* @__PURE__ */ new Map();
     sharedKeysCache.set(name, nameCache);
-    const peers = [...entries.value.entries()].filter(([, e]) => e.name === name);
+    const peers = [...entries.entries()].filter(([, e]) => e.name === name);
     for (const [eid] of peers) {
       const ownRaw = rawRefs.get(eid);
       if (!ownRaw) {
@@ -66,16 +72,17 @@ export function setupComposableRegistry() {
     return currentRoute;
   }
   function register(entry) {
-    if (entries.value.size >= MAX_COMPOSABLE_ENTRIES) {
-      const unmountedId = [...entries.value.entries()].find(([, e]) => e.status === "unmounted")?.[0];
-      const evictId = unmountedId ?? entries.value.keys().next().value;
+    if (entries.size >= MAX_COMPOSABLE_ENTRIES) {
+      const unmountedId = [...entries.entries()].find(([, e]) => e.status === "unmounted")?.[0];
+      const evictId = unmountedId ?? entries.keys().next().value;
       if (evictId !== void 0) {
-        const evictName = entries.value.get(evictId)?.name ?? "";
+        const evictName = entries.get(evictId)?.name ?? "";
         deleteEntry(evictId, evictName);
       }
     }
-    entries.value.set(entry.id, entry);
+    entries.set(entry.id, entry);
     invalidateSharedKeysForName(entry.name);
+    markDirty();
     emit("composable:register", entry);
   }
   function registerLiveRefs(id, refs) {
@@ -111,13 +118,14 @@ export function setupComposableRegistry() {
         const prev = prevValues.get(id);
         if (prev && serialised !== prev[k]) {
           const t = typeof performance !== "undefined" ? performance.now() : Date.now();
-          const history = entryHistory2.get(id) ?? [];
+          const history = entryHistory.get(id) ?? [];
           history.push({ t, key: k, value: safeValue(val) });
           if (history.length > MAX_HISTORY) {
             history.shift();
           }
-          entryHistory2.set(id, history);
+          entryHistory.set(id, history);
           prev[k] = serialised;
+          markDirty();
           _scheduleOnChange();
         }
       });
@@ -144,12 +152,13 @@ export function setupComposableRegistry() {
     _onChange = cb;
   }
   function update(id, patch) {
-    const existing = entries.value.get(id);
+    const existing = entries.get(id);
     if (!existing) {
       return;
     }
     const updated = { ...existing, ...patch };
-    entries.value.set(id, updated);
+    entries.set(id, updated);
+    markDirty();
     emit("composable:update", updated);
   }
   function safeValue(val) {
@@ -197,7 +206,7 @@ export function setupComposableRegistry() {
       leak: entry.leak,
       leakReason: entry.leakReason,
       refs: freshRefs,
-      history: entryHistory2.get(entry.id) ?? [],
+      history: entryHistory.get(entry.id) ?? [],
       sharedKeys: getSharedKeys(entry.id, entry.name),
       watcherCount: entry.watcherCount,
       intervalCount: entry.intervalCount,
@@ -208,7 +217,19 @@ export function setupComposableRegistry() {
     };
   }
   function getAll() {
-    return [...entries.value.values()].map(sanitize);
+    return [...entries.values()].map(sanitize);
+  }
+  function getSnapshot() {
+    if (!dirty) {
+      return cachedSnapshot;
+    }
+    try {
+      cachedSnapshot = JSON.stringify([...entries.values()].map(sanitize)) ?? "[]";
+    } catch {
+      cachedSnapshot = "[]";
+    }
+    dirty = false;
+    return cachedSnapshot;
   }
   function emit(event, data) {
     if (!import.meta.client) {
@@ -227,9 +248,10 @@ export function setupComposableRegistry() {
     liveRefs.clear();
     rawRefs.clear();
     prevValues.clear();
-    entryHistory2.clear();
+    entryHistory.clear();
     sharedKeysCache.clear();
-    entries.value.clear();
+    entries.clear();
+    markDirty();
     emit("composable:clear", {});
   }
   function editValue(id, key, value) {
@@ -241,7 +263,7 @@ export function setupComposableRegistry() {
     if (!r) {
       return;
     }
-    const entry = entries.value.get(id);
+    const entry = entries.get(id);
     if (!entry) {
       return;
     }
@@ -250,7 +272,19 @@ export function setupComposableRegistry() {
     }
     r.value = value;
   }
-  return { register, registerLiveRefs, registerRawRefs, onComposableChange, clear, setRoute, getRoute, update, getAll, editValue };
+  return {
+    register,
+    registerLiveRefs,
+    registerRawRefs,
+    onComposableChange,
+    clear,
+    setRoute,
+    getRoute,
+    update,
+    getAll,
+    getSnapshot,
+    editValue
+  };
 }
 export function __trackComposable(name, callFn, meta) {
   if (!import.meta.dev) {
@@ -367,7 +401,6 @@ export function __trackComposable(name, callFn, meta) {
         }
       });
       registry.registerLiveRefs(id, {});
-      entryHistory.delete(id);
     });
   }
   return result;

package/dist/runtime/composables/fetch-registry.d.ts

@@ -1,5 +1,5 @@
 export interface FetchEntry {
-    id: string;
+    id: number | string;
     key: string;
     url: string;
     status: 'pending' | 'ok' | 'error' | 'cached';
@@ -45,9 +45,10 @@ export declare function setupFetchRegistry(): {
     register: (entry: FetchEntry) => void;
     update: (id: string, patch: Partial<FetchEntry>) => void;
     getAll: () => FetchEntry[];
+    getSnapshot: () => FetchEntry[];
     clear: () => void;
-    entries: Readonly<import("vue").Ref<ReadonlyMap<string, {
-        readonly id: string;
+    entries: ReadonlyMap<string | number, {
+        readonly id: number | string;
         readonly key: string;
         readonly url: string;
         readonly status: "pending" | "ok" | "error" | "cached";
@@ -61,22 +62,7 @@ export declare function setupFetchRegistry(): {
         readonly error?: Readonly<unknown> | undefined;
         readonly file?: string | undefined;
         readonly line?: number | undefined;
-    }>, ReadonlyMap<string, {
-        readonly id: string;
-        readonly key: string;
-        readonly url: string;
-        readonly status: "pending" | "ok" | "error" | "cached";
-        readonly origin: "ssr" | "csr";
-        readonly startTime: number;
-        readonly endTime?: number | undefined;
-        readonly ms?: number | undefined;
-        readonly size?: number | undefined;
-        readonly cached: boolean;
-        readonly payload?: Readonly<unknown> | undefined;
-        readonly error?: Readonly<unknown> | undefined;
-        readonly file?: string | undefined;
-        readonly line?: number | undefined;
-    }>>>;
+    }>;
 };
 export declare function __devFetchHandler(handler: (...args: unknown[]) => unknown, key: unknown, meta: FetchMeta): (...args: unknown[]) => Promise<unknown>;
 export declare function __devFetchCall(originalFn: (url: string, opts: FetchOptions) => FetchResult, url: string, opts: FetchOptions, meta: FetchMeta): FetchResult;