@barefootjs/client 0.10.1 → 0.11.0

package/dist/runtime/index.js

@@ -8,9 +8,55 @@ import {
   onCleanup,
   onMount,
   untrack as untrack3,
-  batch
+  batch,
+  setProfilerSink,
+  beginTurn,
+  endTurn,
+  __bfReportOutput as __bfReportOutput2
 } from "@barefootjs/client/reactive";
 
+// src/profiler-events.ts
+function createRecordingSink() {
+  const events = [];
+  const turnStack = [];
+  let seq = 0;
+  let turnCounter = 0;
+  const top = () => turnStack.length > 0 ? turnStack[turnStack.length - 1] : null;
+  const push = (e) => {
+    const t = top();
+    events.push({ seq: seq++, turn: t?.handlerId ?? null, turnSeq: t?.turnSeq ?? null, ...e });
+  };
+  const sink = {
+    signalSet: (id, batched) => push({ type: "signalSet", signal: id, batched }),
+    subscribeAdd: (signal, subscriber) => push({ type: "subscribeAdd", signal, subscriber }),
+    subscribeRemove: (signal, subscriber) => push({ type: "subscribeRemove", signal, subscriber }),
+    effectCreate: (id, kind) => push({ type: "effectCreate", subscriber: id, kind }),
+    effectEnter: (id) => push({ type: "effectEnter", subscriber: id }),
+    effectExit: (id, dur) => push({ type: "effectExit", subscriber: id, dur }),
+    effectOutput: (id, changed) => push({ type: "effectOutput", subscriber: id, changed }),
+    effectDispose: (id) => push({ type: "effectDispose", subscriber: id }),
+    batchBegin: (depth) => push({ type: "batchBegin", depth }),
+    batchFlush: (flushed) => push({ type: "batchFlush", flushed }),
+    turnBegin: (handlerId, loc) => {
+      push({ type: "turnBegin", handlerId, loc });
+      turnStack.push({ handlerId, turnSeq: ++turnCounter });
+    },
+    turnEnd: () => {
+      turnStack.pop();
+      push({ type: "turnEnd" });
+    }
+  };
+  return {
+    sink,
+    events,
+    reset() {
+      events.length = 0;
+      turnStack.length = 0;
+      seq = 0;
+      turnCounter = 0;
+    }
+  };
+}
 // src/split-props.ts
 function splitProps(props, keys) {
   const keySet = new Set(keys);
@@ -1640,7 +1686,7 @@ function createItemScope(item, index, renderItem, existingPrimary, existingExtra
   });
   return { startMarker, primaryEl, extras, dispose, setItem };
 }
-function mapArray(accessor, container, getKey, renderItem, markerId) {
+function mapArray(accessor, container, getKey, renderItem, markerId, bfId) {
   if (!container)
     return;
   const scopes = new Map;
@@ -1760,7 +1806,7 @@ function mapArray(accessor, container, getKey, renderItem, markerId) {
         insertScope(scope, container, anchor);
       }
     }
-  });
+  }, bfId);
 }
 var ITEM_PREFIX = `${BF_LOOP_ITEM}:`;
 function isItemAnchor(node) {
@@ -1823,7 +1869,7 @@ function createAnchorScope(item, index, key, renderItem, existingAnchor) {
   }
   return { anchor, pending: frag, dispose, setItem };
 }
-function mapArrayAnchored(accessor, container, getKey, renderItem, markerId) {
+function mapArrayAnchored(accessor, container, getKey, renderItem, markerId, bfId) {
   if (!container)
     return;
   const scopes = new Map;
@@ -1904,7 +1950,7 @@ function mapArrayAnchored(accessor, container, getKey, renderItem, markerId) {
         placeAnchorScope(scope, container, end, end);
       }
     }
-  });
+  }, bfId);
 }
 // src/runtime/apply-rest-attrs.ts
 import { createEffect as createEffect2 } from "@barefootjs/client/reactive";
@@ -2075,7 +2121,7 @@ function normalizeTemplate(value) {
 function evalBranchTemplate(branch) {
   return untrack2(() => normalizeTemplate(branch.template()));
 }
-function insert(scope, id, conditionFn, whenTrue, whenFalse) {
+function insert(scope, id, conditionFn, whenTrue, whenFalse, bfId) {
   if (!scope)
     return;
   const region = makeRegion(scope);
@@ -2163,7 +2209,7 @@ function insert(scope, id, conditionFn, whenTrue, whenFalse) {
     const cleanup = branch.bindEvents(region.bindScope, { isFirstRun: false });
     branchCleanup = typeof cleanup === "function" ? cleanup : null;
     autoFocusConditionalElement(region, id);
-  });
+  }, bfId);
 }
 function autoFocusConditionalElement(region, id) {
   requestAnimationFrame(() => {
@@ -2282,15 +2328,20 @@ function __bfSlot(value, slots) {
   return escapeText(value);
 }
 // src/runtime/dynamic-text.ts
+import { __bfReportOutput } from "@barefootjs/client/reactive";
 var END_MARKER = "/";
 function clearSlotRegion(start, keep) {
+  let removed = false;
   let n = start.nextSibling;
   while (n && !(n.nodeType === Node.COMMENT_NODE && n.nodeValue === END_MARKER)) {
     const next = n.nextSibling;
-    if (n !== keep)
+    if (n !== keep) {
       n.parentNode?.removeChild(n);
+      removed = true;
+    }
     n = next;
   }
+  return removed;
 }
 function slotStart(node) {
   let n = node.previousSibling;
@@ -2304,9 +2355,12 @@ function __bfText(current, value) {
   if (value != null && value.__isSlot)
     return current;
   if (typeof Node !== "undefined" && value instanceof Node) {
-    if (value === current)
+    if (value === current) {
+      __bfReportOutput(false);
       return current;
+    }
     const start2 = current.previousSibling;
+    __bfReportOutput(true);
     if (start2 && start2.nodeType === Node.COMMENT_NODE) {
       clearSlotRegion(start2);
       start2.parentNode?.insertBefore(value, start2.nextSibling);
@@ -2317,12 +2371,14 @@ function __bfText(current, value) {
   }
   const text = String(value ?? "");
   if (current.nodeType === Node.TEXT_NODE) {
+    const textChanged = current.nodeValue !== text;
     current.nodeValue = text;
     const start2 = slotStart(current);
-    if (start2 && start2.nodeType === Node.COMMENT_NODE)
-      clearSlotRegion(start2, current);
+    const clearedStale = start2 != null && start2.nodeType === Node.COMMENT_NODE && clearSlotRegion(start2, current);
+    __bfReportOutput(textChanged || clearedStale);
     return current;
   }
+  __bfReportOutput(true);
   const start = current.previousSibling;
   const textNode = (current.ownerDocument ?? document).createTextNode(text);
   if (start && start.nodeType === Node.COMMENT_NODE) {
@@ -2437,6 +2493,7 @@ export {
   spreadAttrs,
   splitProps,
   setupStreaming,
+  setProfilerSink,
   setCurrentScope,
   renderChild,
   render,
@@ -2475,9 +2532,11 @@ export {
   find,
   escapeText,
   escapeAttr,
+  endTurn,
   cssEscape,
   createSignal2 as createSignal,
   createRoot2 as createRoot,
+  createRecordingSink,
   createPortal,
   createMemo,
   createEffect4 as createEffect,
@@ -2485,12 +2544,14 @@ export {
   createContext,
   createComponent,
   cleanupPortalPlaceholder,
+  beginTurn,
   batch,
   applyRestAttrs,
   __slot,
   __bf_swap,
   __bfText,
   __bfSlot,
+  __bfReportOutput2 as __bfReportOutput,
   $t,
   $c,
   $

package/dist/runtime/insert.d.ts

@@ -71,5 +71,5 @@ export interface BranchConfig {
  * @param whenTrue - Branch config for when condition is true
  * @param whenFalse - Branch config for when condition is false
  */
-export declare function insert(scope: Element | Comment | null, id: string, conditionFn: () => boolean, whenTrue: BranchConfig, whenFalse: BranchConfig): void;
+export declare function insert(scope: Element | Comment | null, id: string, conditionFn: () => boolean, whenTrue: BranchConfig, whenFalse: BranchConfig, bfId?: string): void;
 //# sourceMappingURL=insert.d.ts.map

package/dist/runtime/insert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"insert.d.ts","sourceRoot":"","sources":["../../src/runtime/insert.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAmFH;;;;;GAKG;AACH,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,IAAI,EAAE,CAAA;CACd;AAED;;;GAGG;AACH,MAAM,WAAW,YAAY;IAC3B;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,QAAQ,EAAE,MAAM,MAAM,GAAG,oBAAoB,CAAA;IAE7C;;;;;;OAMG;IACH,UAAU,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE;QAAE,UAAU,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,CAAA;CACrF;AAyBD;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CACpB,KAAK,EAAE,OAAO,GAAG,OAAO,GAAG,IAAI,EAC/B,EAAE,EAAE,MAAM,EACV,WAAW,EAAE,MAAM,OAAO,EAC1B,QAAQ,EAAE,YAAY,EACtB,SAAS,EAAE,YAAY,GACtB,IAAI,CA+IN"}
+{"version":3,"file":"insert.d.ts","sourceRoot":"","sources":["../../src/runtime/insert.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAmFH;;;;;GAKG;AACH,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,IAAI,EAAE,CAAA;CACd;AAED;;;GAGG;AACH,MAAM,WAAW,YAAY;IAC3B;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,QAAQ,EAAE,MAAM,MAAM,GAAG,oBAAoB,CAAA;IAE7C;;;;;;OAMG;IACH,UAAU,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE;QAAE,UAAU,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,CAAA;CACrF;AAyBD;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CACpB,KAAK,EAAE,OAAO,GAAG,OAAO,GAAG,IAAI,EAC/B,EAAE,EAAE,MAAM,EACV,WAAW,EAAE,MAAM,OAAO,EAC1B,QAAQ,EAAE,YAAY,EACtB,SAAS,EAAE,YAAY,EACvB,IAAI,CAAC,EAAE,MAAM,GACZ,IAAI,CA+IN"}

package/dist/runtime/map-array.d.ts

@@ -28,7 +28,7 @@
  *                     When `existing` is passed, initializes the SSR-rendered element and returns it.
  *                     When `existing` is undefined, creates a new element and returns it.
  */
-export declare function mapArray<T>(accessor: () => T[], container: HTMLElement | null, getKey: ((item: T, index: number) => string) | null, renderItem: (item: () => T, index: number, existing?: HTMLElement) => HTMLElement, markerId?: string): void;
+export declare function mapArray<T>(accessor: () => T[], container: HTMLElement | null, getKey: ((item: T, index: number) => string) | null, renderItem: (item: () => T, index: number, existing?: HTMLElement) => HTMLElement, markerId?: string, bfId?: string): void;
 /**
  * Per-item scoped list rendering for whole-item conditionals (#1665).
  *
@@ -37,5 +37,5 @@ export declare function mapArray<T>(accessor: () => T[], container: HTMLElement
  * (hydration). Items may render zero elements; the anchor is the stable
  * identity and position.
  */
-export declare function mapArrayAnchored<T>(accessor: () => T[], container: HTMLElement | null, getKey: ((item: T, index: number) => string) | null, renderItem: (item: () => T, index: number, existing?: Comment) => DocumentFragment | Comment, markerId?: string): void;
+export declare function mapArrayAnchored<T>(accessor: () => T[], container: HTMLElement | null, getKey: ((item: T, index: number) => string) | null, renderItem: (item: () => T, index: number, existing?: Comment) => DocumentFragment | Comment, markerId?: string, bfId?: string): void;
 //# sourceMappingURL=map-array.d.ts.map

package/dist/runtime/map-array.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"map-array.d.ts","sourceRoot":"","sources":["../../src/runtime/map-array.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AA6LH;;;;;;;;;;GAUG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EACxB,QAAQ,EAAE,MAAM,CAAC,EAAE,EACnB,SAAS,EAAE,WAAW,GAAG,IAAI,EAC7B,MAAM,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC,GAAG,IAAI,EACnD,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,WAAW,KAAK,WAAW,EACjF,QAAQ,CAAC,EAAE,MAAM,GAChB,IAAI,CAwKN;AAqHD;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,EAChC,QAAQ,EAAE,MAAM,CAAC,EAAE,EACnB,SAAS,EAAE,WAAW,GAAG,IAAI,EAC7B,MAAM,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC,GAAG,IAAI,EACnD,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,KAAK,gBAAgB,GAAG,OAAO,EAC5F,QAAQ,CAAC,EAAE,MAAM,GAChB,IAAI,CA+FN"}
+{"version":3,"file":"map-array.d.ts","sourceRoot":"","sources":["../../src/runtime/map-array.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AA6LH;;;;;;;;;;GAUG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EACxB,QAAQ,EAAE,MAAM,CAAC,EAAE,EACnB,SAAS,EAAE,WAAW,GAAG,IAAI,EAC7B,MAAM,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC,GAAG,IAAI,EACnD,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,WAAW,KAAK,WAAW,EACjF,QAAQ,CAAC,EAAE,MAAM,EACjB,IAAI,CAAC,EAAE,MAAM,GACZ,IAAI,CAwKN;AAqHD;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,EAChC,QAAQ,EAAE,MAAM,CAAC,EAAE,EACnB,SAAS,EAAE,WAAW,GAAG,IAAI,EAC7B,MAAM,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC,GAAG,IAAI,EACnD,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,KAAK,gBAAgB,GAAG,OAAO,EAC5F,QAAQ,CAAC,EAAE,MAAM,EACjB,IAAI,CAAC,EAAE,MAAM,GACZ,IAAI,CA+FN"}

package/dist/runtime/standalone.js

@@ -1,16 +1,41 @@
 // src/reactive.ts
+var profilerSink = null;
+var signalSeq = 0;
+var subscriberSeq = 0;
+function setProfilerSink(sink) {
+  profilerSink = sink;
+}
+function beginTurn(handlerId, loc) {
+  if (profilerSink)
+    profilerSink.turnBegin(handlerId, loc);
+}
+function endTurn() {
+  if (profilerSink)
+    profilerSink.turnEnd();
+}
+function __bfReportOutput(changed) {
+  if (!profilerSink || !Owner)
+    return;
+  Owner.outputReported = true;
+  if (changed)
+    Owner.outputChanged = true;
+}
 var Owner = null;
 var Listener = null;
 var MAX_EFFECT_RUNS = 100;
 var BatchDepth = 0;
 var PendingEffects = new Set;
-function createSignal(initialValue) {
+function createSignal(initialValue, __bfId) {
   let value = initialValue;
   const subscribers = new Set;
+  const id = __bfId ?? (profilerSink ? `s${++signalSeq}` : "");
+  subscribers.__bfSignalId = id;
   const get = () => {
     if (Listener) {
       subscribers.add(Listener);
       Listener.dependencies.add(subscribers);
+      if (profilerSink)
+        profilerSink.subscribeAdd(id, Listener.id);
     }
     return value;
   };
@@ -20,6 +45,8 @@ function createSignal(initialValue) {
       return;
     }
     value = newValue;
+    if (profilerSink)
+      profilerSink.signalSet(id, BatchDepth > 0);
     if (BatchDepth > 0) {
       for (const effect of subscribers) {
         PendingEffects.add(effect);
@@ -33,7 +60,7 @@ function createSignal(initialValue) {
   };
   return [get, set];
 }
-function createEffect(fn) {
+function createEffect(fn, __bfId, __bfKind = "effect") {
   const effect = {
     fn,
     cleanup: null,
@@ -41,8 +68,14 @@ function createEffect(fn) {
     owner: Owner,
     children: [],
     disposed: false,
-    runCount: 0
+    runCount: 0,
+    id: __bfId ?? (profilerSink ? `e${++subscriberSeq}` : ""),
+    kind: __bfKind,
+    outputReported: false,
+    outputChanged: false
   };
+  if (profilerSink)
+    profilerSink.effectCreate(effect.id, effect.kind);
   if (Owner)
     Owner.children.push(effect);
   runEffect(effect);
@@ -55,18 +88,25 @@ function runEffect(effect) {
     effect.runCount = 0;
     throw new Error(`Circular dependency detected: effect re-entered itself ${MAX_EFFECT_RUNS} times.`);
   }
+  if (profilerSink)
+    profilerSink.effectEnter(effect.id);
   if (effect.cleanup) {
     effect.cleanup();
     effect.cleanup = null;
   }
   for (const dep of effect.dependencies) {
     dep.delete(effect);
+    if (profilerSink)
+      profilerSink.subscribeRemove(dep.__bfSignalId ?? "", effect.id);
   }
   effect.dependencies.clear();
   const prevOwner = Owner;
   const prevListener = Listener;
   Owner = effect;
   Listener = effect;
+  effect.outputReported = false;
+  effect.outputChanged = false;
+  const start = profilerSink ? performance.now() : 0;
   try {
     const result = effect.fn();
     if (typeof result === "function") {
@@ -76,6 +116,11 @@ function runEffect(effect) {
     Owner = prevOwner;
     Listener = prevListener;
     effect.runCount--;
+    if (profilerSink) {
+      profilerSink.effectExit(effect.id, performance.now() - start);
+      if (effect.outputReported)
+        profilerSink.effectOutput?.(effect.id, effect.outputChanged);
+    }
   }
 }
 function disposeSubtree(effect) {
@@ -92,8 +137,12 @@ function disposeSubtree(effect) {
   }
   for (const dep of effect.dependencies) {
     dep.delete(effect);
+    if (profilerSink)
+      profilerSink.subscribeRemove(dep.__bfSignalId ?? "", effect.id);
   }
   effect.dependencies.clear();
+  if (profilerSink)
+    profilerSink.effectDispose(effect.id);
   effect.owner = null;
 }
 function disposeEffect(effect) {
@@ -114,8 +163,14 @@ function createRoot(fn) {
     owner: Owner,
     children: [],
     disposed: false,
-    runCount: 0
+    runCount: 0,
+    id: profilerSink ? `r${++subscriberSeq}` : "",
+    kind: "root",
+    outputReported: false,
+    outputChanged: false
   };
+  if (profilerSink)
+    profilerSink.effectCreate(root.id, "root");
   if (Owner)
     Owner.children.push(root);
   const prevOwner = Owner;
@@ -129,7 +184,7 @@ function createRoot(fn) {
     Listener = prevListener;
   }
 }
-function createDisposableEffect(fn) {
+function createDisposableEffect(fn, __bfId) {
   let disposed = false;
   const effect = {
     fn: () => {
@@ -142,8 +197,14 @@ function createDisposableEffect(fn) {
     owner: Owner,
     children: [],
     disposed: false,
-    runCount: 0
+    runCount: 0,
+    id: __bfId ?? (profilerSink ? `e${++subscriberSeq}` : ""),
+    kind: "effect",
+    outputReported: false,
+    outputChanged: false
   };
+  if (profilerSink)
+    profilerSink.effectCreate(effect.id, effect.kind);
   if (Owner)
     Owner.children.push(effect);
   runEffect(effect);
@@ -173,6 +234,8 @@ function untrack(fn) {
 }
 function batch(fn) {
   BatchDepth++;
+  if (profilerSink)
+    profilerSink.batchBegin(BatchDepth);
   try {
     return fn();
   } finally {
@@ -186,6 +249,8 @@ function flushEffects() {
   while (PendingEffects.size > 0) {
     const effects = [...PendingEffects];
     PendingEffects.clear();
+    if (profilerSink)
+      profilerSink.batchFlush(effects.length);
     for (const effect of effects) {
       runEffect(effect);
     }
@@ -194,14 +259,64 @@ function flushEffects() {
 function onMount(fn) {
   createEffect(() => untrack(fn));
 }
-function createMemo(fn) {
-  const [value, setValue] = createSignal(undefined);
+function createMemo(fn, __bfId) {
+  const id = __bfId ?? (profilerSink ? `m${++subscriberSeq}` : "");
+  const [value, setValue] = createSignal(undefined, id);
+  let prev;
+  let hasPrev = false;
   createEffect(() => {
     const result = fn();
+    if (profilerSink) {
+      __bfReportOutput(!hasPrev || !Object.is(prev, result));
+      prev = result;
+      hasPrev = true;
+    }
     setValue(() => result);
-  });
+  }, id, "memo");
   return value;
 }
+// src/profiler-events.ts
+function createRecordingSink() {
+  const events = [];
+  const turnStack = [];
+  let seq = 0;
+  let turnCounter = 0;
+  const top = () => turnStack.length > 0 ? turnStack[turnStack.length - 1] : null;
+  const push = (e) => {
+    const t = top();
+    events.push({ seq: seq++, turn: t?.handlerId ?? null, turnSeq: t?.turnSeq ?? null, ...e });
+  };
+  const sink = {
+    signalSet: (id, batched) => push({ type: "signalSet", signal: id, batched }),
+    subscribeAdd: (signal, subscriber) => push({ type: "subscribeAdd", signal, subscriber }),
+    subscribeRemove: (signal, subscriber) => push({ type: "subscribeRemove", signal, subscriber }),
+    effectCreate: (id, kind) => push({ type: "effectCreate", subscriber: id, kind }),
+    effectEnter: (id) => push({ type: "effectEnter", subscriber: id }),
+    effectExit: (id, dur) => push({ type: "effectExit", subscriber: id, dur }),
+    effectOutput: (id, changed) => push({ type: "effectOutput", subscriber: id, changed }),
+    effectDispose: (id) => push({ type: "effectDispose", subscriber: id }),
+    batchBegin: (depth) => push({ type: "batchBegin", depth }),
+    batchFlush: (flushed) => push({ type: "batchFlush", flushed }),
+    turnBegin: (handlerId, loc) => {
+      push({ type: "turnBegin", handlerId, loc });
+      turnStack.push({ handlerId, turnSeq: ++turnCounter });
+    },
+    turnEnd: () => {
+      turnStack.pop();
+      push({ type: "turnEnd" });
+    }
+  };
+  return {
+    sink,
+    events,
+    reset() {
+      events.length = 0;
+      turnStack.length = 0;
+      seq = 0;
+      turnCounter = 0;
+    }
+  };
+}
 // src/split-props.ts
 function splitProps(props, keys) {
   const keySet = new Set(keys);
@@ -1829,7 +1944,7 @@ function createItemScope(item, index, renderItem, existingPrimary, existingExtra
   });
   return { startMarker, primaryEl, extras, dispose, setItem };
 }
-function mapArray(accessor, container, getKey, renderItem, markerId) {
+function mapArray(accessor, container, getKey, renderItem, markerId, bfId) {
   if (!container)
     return;
   const scopes = new Map;
@@ -1949,7 +2064,7 @@ function mapArray(accessor, container, getKey, renderItem, markerId) {
         insertScope(scope, container, anchor);
       }
     }
-  });
+  }, bfId);
 }
 var ITEM_PREFIX = `${BF_LOOP_ITEM}:`;
 function isItemAnchor(node) {
@@ -2012,7 +2127,7 @@ function createAnchorScope(item, index, key, renderItem, existingAnchor) {
   }
   return { anchor, pending: frag, dispose, setItem };
 }
-function mapArrayAnchored(accessor, container, getKey, renderItem, markerId) {
+function mapArrayAnchored(accessor, container, getKey, renderItem, markerId, bfId) {
   if (!container)
     return;
   const scopes = new Map;
@@ -2093,7 +2208,7 @@ function mapArrayAnchored(accessor, container, getKey, renderItem, markerId) {
         placeAnchorScope(scope, container, end, end);
       }
     }
-  });
+  }, bfId);
 }
 // src/runtime/style.ts
 function styleToCss(value) {
@@ -2260,7 +2375,7 @@ function normalizeTemplate(value) {
 function evalBranchTemplate(branch) {
   return untrack(() => normalizeTemplate(branch.template()));
 }
-function insert(scope, id, conditionFn, whenTrue, whenFalse) {
+function insert(scope, id, conditionFn, whenTrue, whenFalse, bfId) {
   if (!scope)
     return;
   const region = makeRegion(scope);
@@ -2348,7 +2463,7 @@ function insert(scope, id, conditionFn, whenTrue, whenFalse) {
     const cleanup = branch.bindEvents(region.bindScope, { isFirstRun: false });
     branchCleanup = typeof cleanup === "function" ? cleanup : null;
     autoFocusConditionalElement(region, id);
-  });
+  }, bfId);
 }
 function autoFocusConditionalElement(region, id) {
   requestAnimationFrame(() => {
@@ -2469,13 +2584,17 @@ function __bfSlot(value, slots) {
 // src/runtime/dynamic-text.ts
 var END_MARKER = "/";
 function clearSlotRegion(start, keep) {
+  let removed = false;
   let n = start.nextSibling;
   while (n && !(n.nodeType === Node.COMMENT_NODE && n.nodeValue === END_MARKER)) {
     const next = n.nextSibling;
-    if (n !== keep)
+    if (n !== keep) {
       n.parentNode?.removeChild(n);
+      removed = true;
+    }
     n = next;
   }
+  return removed;
 }
 function slotStart(node) {
   let n = node.previousSibling;
@@ -2489,9 +2608,12 @@ function __bfText(current, value) {
   if (value != null && value.__isSlot)
     return current;
   if (typeof Node !== "undefined" && value instanceof Node) {
-    if (value === current)
+    if (value === current) {
+      __bfReportOutput(false);
       return current;
+    }
     const start2 = current.previousSibling;
+    __bfReportOutput(true);
     if (start2 && start2.nodeType === Node.COMMENT_NODE) {
       clearSlotRegion(start2);
       start2.parentNode?.insertBefore(value, start2.nextSibling);
@@ -2502,12 +2624,14 @@ function __bfText(current, value) {
   }
   const text = String(value ?? "");
   if (current.nodeType === Node.TEXT_NODE) {
+    const textChanged = current.nodeValue !== text;
     current.nodeValue = text;
     const start2 = slotStart(current);
-    if (start2 && start2.nodeType === Node.COMMENT_NODE)
-      clearSlotRegion(start2, current);
+    const clearedStale = start2 != null && start2.nodeType === Node.COMMENT_NODE && clearSlotRegion(start2, current);
+    __bfReportOutput(textChanged || clearedStale);
     return current;
   }
+  __bfReportOutput(true);
   const start = current.previousSibling;
   const textNode = (current.ownerDocument ?? document).createTextNode(text);
   if (start && start.nodeType === Node.COMMENT_NODE) {
@@ -2622,6 +2746,7 @@ export {
   spreadAttrs,
   splitProps,
   setupStreaming,
+  setProfilerSink,
   setCurrentScope,
   renderChild,
   render,
@@ -2660,9 +2785,11 @@ export {
   find,
   escapeText,
   escapeAttr,
+  endTurn,
   cssEscape,
   createSignal,
   createRoot,
+  createRecordingSink,
   createPortal,
   createMemo,
   createEffect,
@@ -2670,12 +2797,14 @@ export {
   createContext,
   createComponent,
   cleanupPortalPlaceholder,
+  beginTurn,
   batch,
   applyRestAttrs,
   __slot,
   __bf_swap,
   __bfText,
   __bfSlot,
+  __bfReportOutput,
   $t,
   $c,
   $

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@barefootjs/client",
-  "version": "0.10.1",
+  "version": "0.11.0",
   "description": "BarefootJS client package: reactive primitives (SSR-safe) plus browser runtime under the `/runtime` subpath (compiler target)",
   "type": "module",
   "main": "./dist/index.js",
@@ -55,7 +55,7 @@
     "directory": "packages/client"
   },
   "dependencies": {
-    "@barefootjs/shared": "0.10.1"
+    "@barefootjs/shared": "0.11.0"
   },
   "peerDependencies": {
     "@barefootjs/jsx": ">=0.2.0"

package/src/index.ts

@@ -11,13 +11,26 @@ export {
   onMount,
   untrack,
   batch,
+  setProfilerSink,
+  beginTurn,
+  endTurn,
+  __bfReportOutput,
   type Reactive,
   type Signal,
   type Memo,
   type CleanupFn,
   type EffectFn,
+  type ProfilerEventSink,
+  type SubscriberKind,
 } from '@barefootjs/client/reactive'
 
+export {
+  createRecordingSink,
+  type ProfilerEvent,
+  type ProfilerEventType,
+  type RecordingSink,
+} from './profiler-events.ts'
+
 export { splitProps } from './split-props.ts'
 
 export { __slot, type SlotMarker } from './slot.ts'