@abide/abide 0.43.0 → 0.44.0

package/src/lib/ui/router.ts

@@ -4,6 +4,7 @@ import { outlet } from './dom/outlet.ts'
 import { effect } from './effect.ts'
 import { matchRoute } from './matchRoute.ts'
 import { navigatePath } from './navigate.ts'
+import { CHILD_PRESENT } from './runtime/CHILD_PRESENT.ts'
 import { clientPage } from './runtime/clientPage.ts'
 import { enterRenderPass } from './runtime/enterRenderPass.ts'
 import { exitRenderPass } from './runtime/exitRenderPass.ts'
@@ -15,6 +16,7 @@ import type { AbideHistoryState } from './runtime/types/AbideHistoryState.ts'
 import type { NavVerdict } from './runtime/types/NavVerdict.ts'
 import type { Route } from './runtime/types/Route.ts'
 import type { RouteLoader } from './runtime/types/RouteLoader.ts'
+import type { UiProps } from './runtime/types/UiProps.ts'
 import { untrack } from './runtime/untrack.ts'
 
 /* An outlet boundary — the `<!--abide:outlet-->`…`<!--/abide:outlet-->` marker pair a
@@ -192,6 +194,23 @@ export function router(
                 outlet(host)
                 rootBoundary = PENDING_OUTLET.current as Boundary
             }
+            /* Route params as reactive thunks: reading `clientPage.value.params` inside the
+               thunk tracks the page signal, so an in-place same-route hop (params change, the
+               page stays mounted) re-runs each `props()` derive. The key set is stable across
+               same-route hops, so the bag need not rebuild. A layout also gets `$children`
+               set to `CHILD_PRESENT` when a child layer exists below it, read by
+               `{#if children}` (a layout's `{children()}` lowers to its `outlet()` boundary,
+               so it ignores this value). */
+            const propsBag = (hasChild: boolean): UiProps => {
+                const bag: UiProps = {}
+                for (const key of Object.keys(params)) {
+                    bag[key] = () => clientPage.value.params[key]
+                }
+                if (hasChild) {
+                    bag.$children = CHILD_PRESENT
+                }
+                return bag
+            }
             let boundary = baseBoundary(index)
             for (let depth = index; depth < layoutViews.length; depth += 1) {
                 const view = layoutViews[depth] as Route
@@ -200,14 +219,15 @@ export function router(
                     boundary.open,
                     boundary.close,
                     view.build,
-                    params,
+                    /* A layout always has a child below: a deeper layout, or the page. */
+                    propsBag(depth < layoutViews.length - 1 || pageView !== undefined),
                     /* The layout's route key names its scope in the inspector's Reactive tab
                        (no host element to read a tag from — see `scopeLabel`). */
                     chainKeys[depth],
                 )
                 const slot = PENDING_OUTLET.current
                 if (slot === undefined) {
-                    throw new Error('[abide] a layout.abide must contain a <slot/> outlet')
+                    throw new Error('[abide] a layout.abide must contain a {children()} outlet')
                 }
                 mountedLayouts.push({ key: chainKeys[depth] as string, dispose, slot })
                 boundary = slot
@@ -220,7 +240,8 @@ export function router(
                 boundary.open,
                 boundary.close,
                 pageView.build,
-                params,
+                /* A page is a leaf — no child layer. */
+                propsBag(false),
                 /* The page's route key names its scope in the inspector (see above). */
                 pageKey,
             ).dispose
@@ -253,9 +274,16 @@ export function router(
     }
     const onPageHide = (): void => {
         /* Mirror the live scroll into the active entry's state before it unloads, so a
-           reload can recover it — the in-memory bucket is gone and `manual` keeps the
-           browser from restoring. */
+           non-hydratable reload (which tears the SSR DOM down) can recover it from the
+           manual bucket. */
         historyEntries.persist()
+        /* Re-enable native scroll restoration for the NEXT document load (a reload): the
+           browser restores the SSR DOM's offset before paint, flash-free — where the
+           manual bucket, gated behind the async chunk import, would re-apply post-paint
+           (a visible scroll). The first paint flips back to `manual` for in-session nav. */
+        if ('scrollRestoration' in history) {
+            history.scrollRestoration = 'auto'
+        }
     }
     const onClick = (event: MouseEvent): void => {
         /* Let the browser own anything that isn't a plain primary-button click:
@@ -297,12 +325,18 @@ export function router(
         navigatePath(destination.pathname + destination.search + destination.hash)
     }
     if (typeof window !== 'undefined') {
-        /* Own scroll restoration: the browser would restore against the pre-teardown
-           DOM. Adopt the initial entry's id (survives a reload) and stamp it onto the
-           landing entry — merging so any `scroll` a prior unload persisted into this
-           entry's state stays put for the first-paint `restore` to recover. */
+        /* Scroll restoration is the browser's job on a document load (reload / first
+           paint): native restoration runs BEFORE paint, so a hydrating in-place adopt
+           returns to the reload offset flash-free (`auto` here also self-heals an entry a
+           prior session left `manual`). The first paint then flips to `manual` (below) so
+           an in-session back/forward — which tears the page down and rebuilds — restores
+           against the new DOM instead of letting the browser restore against the
+           torn-down one; `onPageHide` flips back to `auto` for the next load. Still adopt
+           the initial entry's id (survives a reload) and stamp it onto the landing entry —
+           merging so any `scroll` a prior unload persisted stays put for a non-hydratable
+           first paint's manual `restore` to recover. */
         if ('scrollRestoration' in history) {
-            history.scrollRestoration = 'manual'
+            history.scrollRestoration = 'auto'
         }
         historyEntries.adopt(entryOf())
         const landingState = (history.state as AbideHistoryState | null) ?? {}
@@ -421,6 +455,7 @@ export function router(
                     ) {
                         divergence += 1
                     }
+                    const firstPaint = first
                     const hydrating = first && pageView?.hydratable === true
                     first = false
                     /* Same page, same layout chain — only params/url differ (e.g. stepping
@@ -483,11 +518,27 @@ export function router(
                         )
                         /* Reapply the destination entry's scroll once its DOM exists — a
                        back/forward restores its offset, a fresh nav scrolls to the `#hash`
-                       anchor (now built) or the top. Runs on the initial paint too: with
-                       `scrollRestoration='manual'` the browser does NOT restore a reload's
-                       offset, so first paint recovers it from the persisted `history.state`
-                       (a fresh load with no persisted offset falls through to hash/top). */
-                        historyEntries.restore(url.hash)
+                       anchor (now built) or the top. SKIPPED on a hydrating first paint:
+                       the SSR DOM is adopted in place, so the browser's native restoration
+                       already returned the entry to its reload offset before paint — the
+                       manual bucket, gated behind the async chunk import above, would only
+                       re-apply post-paint (a visible scroll = the flash). A non-hydratable
+                       first paint tore the SSR DOM down and rebuilt, so it still needs the
+                       manual restore (recovered from the persisted `history.state`). */
+                        if (!hydrating) {
+                            historyEntries.restore(url.hash)
+                        }
+                        /* Take over scroll restoration once abide owns the DOM: a later
+                       same-document back/forward must restore against the rebuilt page, so
+                       the browser must not. `onPageHide` flips back to `auto` so the next
+                       document load restores natively (flash-free) again. */
+                        if (
+                            firstPaint &&
+                            typeof history !== 'undefined' &&
+                            'scrollRestoration' in history
+                        ) {
+                            history.scrollRestoration = 'manual'
+                        }
                     }
                     /* Build / hydrate is the deterministic surface — a codegen defect or a
                        throw in user render code fails the SAME way every load, so reloading

package/src/lib/ui/rpcOutbox/createOutboxQueue.ts

@@ -41,7 +41,7 @@ const keyFor = (url: string): string => `abide:outbox:${url}`
 /*
 A durable, app-owned FIFO retry queue for one RPC. A call fetches directly and throws as
 before while the queue is empty; when the server can't be reached — a transport failure or
-a 502/503/504/52x — the caller `park`s the request here (a side-effect; the call still
+a 502/503/504/520–527/530 — the caller `park`s the request here (a side-effect; the call still
 throws), and once a backlog exists the caller parks every later call at the tail too, so
 FIFO order is preserved on replay. Built on `doc` + `persist`, so the queue IS a persisted
 document that survives a reload. Draining is manual — the app calls `retry()` (per-entry or

package/src/lib/ui/runtime/CHILD_PRESENT.ts

@@ -0,0 +1,8 @@
+/*
+A no-op truthiness marker the router (client) and `renderChain` (SSR) set as a layout's
+`$props.$children` when a child layer (a nested layout or the page) exists below it. Read
+only by `{#if children}` (→ `$props?.$children`); a layout's `{children()}` lowers to the
+`outlet()` boundary the router fills, so this value is never invoked — it exists purely so
+`{#if children}` reads a uniform presence signal on both the client and the server.
+*/
+export const CHILD_PRESENT = (_host: Element): void => {}

package/src/lib/ui/runtime/OUTLET_MARKER.ts

@@ -2,8 +2,8 @@
    `<abide-outlet>` ELEMENT, so the next chain layer the router fills in lays out as a true
    direct child of the slot's parent (no wrapper box breaking the layout's flex/grid/`:first-child`).
 
-   `abide:outlet` / `/abide:outlet` deliberately match `skeleton`'s `isOpenMarker`/`isCloseMarker`
-   (the `abide:` / `/abide:` convention), so a layout's own hole-scanning treats the outlet's
+   `abide:outlet` / `/abide:outlet` deliberately match `markerDepthDelta`'s `startsWith('abide:')` /
+   `startsWith('/abide:')` rule (the `abide:` / `/abide:` convention), so a layout's own hole-scanning treats the outlet's
    future child content as a balanced range and skips it — exactly like an `await`/`try` boundary.
    The router fills the boundary with the next layer (see `outlet`/`fillBoundary`). */
 export const OUTLET_OPEN = 'abide:outlet'

package/src/lib/ui/runtime/RANGE_MARKER.ts

@@ -1,6 +1,6 @@
 /* The comment-marker "wire alphabet" — the single source of truth for the sentinel
    strings the SSR emit (`generateSSR`) writes into HTML comments and the hydrate scan
-   (`skeleton`) + every range-mount runtime (`when`/`switch`/`each`/`mountRange`/
+   (`skeleton`) + every range-mount runtime (`when`/`switchBlock`/`each`/`mountRange`/
    `mountSlot`/`appendSnippet`) creates as `document.createComment` nodes. Both sides
    reference THESE constants, so a marker the server writes and the marker the client
    looks for can never drift on a literal.

package/src/lib/ui/runtime/REACTIVE_CONTEXT.ts

@@ -2,13 +2,19 @@ import type { ReactiveNode } from './types/ReactiveNode.ts'
 
 /*
 Mutable singletons shared by every reactive primitive: the observer currently
-running (so a read can register itself as that observer's dependency), the set
+running (so a read can register itself as that observer's dependency), the queue
 of effects dirtied since the last flush, and the batch depth (writes inside a
 batch queue effects and flush once on exit). Held on one object so signal,
 computed, and effect all reference the same graph state without a barrel.
+
+`pendingEffects` is a plain array, not a `Set`: an effect is enqueued only on its
+CLEAN→dirty transition (`mark`'s `wasClean` gate), so it can be pushed at most once
+per flush cycle — the status machine already guarantees the dedup a `Set` would,
+without hashing every enqueue. The flush double-buffers (swaps in a fresh array) so
+effects re-dirtied mid-flush queue for the next pass.
 */
 export const REACTIVE_CONTEXT: {
     observer: ReactiveNode | undefined
-    pendingEffects: Set<ReactiveNode>
+    pendingEffects: ReactiveNode[]
     batchDepth: number
-} = { observer: undefined, pendingEffects: new Set(), batchDepth: 0 }
+} = { observer: undefined, pendingEffects: [], batchDepth: 0 }

package/src/lib/ui/runtime/captureModelDoc.ts

@@ -6,7 +6,7 @@ Runs a component `build` and returns its result (the mount handle / disposer)
 alongside the component's own `model` document — the serializable `state` doc,
 needed so a hot swap can carry its value across (see `hotReplace`). The model is
 found, not threaded: a component seeds its `model` first (the desugared
-`const model = doc({})` + its init patches run before any child mounts or
+`const $$model = scope()` + its init `replace` patches (state slots lowered by `lowerDocAccess`) run before any child mounts or
 control-flow blocks), so the FIRST patch announced on the bus during the build names
 it. A component with no `state` mints no model and emits nothing first — `model` is
 then `undefined` and there is nothing to preserve. Used only on the hot path; the

package/src/lib/ui/runtime/createDoc.ts

@@ -118,7 +118,11 @@ export function createDoc(initial: unknown): Doc {
                    and this very descend scan degrades linearly with it. The woken
                    reader re-mints a fresh node on its flush if the path ever returns.
                    Deleting the current entry mid-iteration is safe on a Map. */
-                const walk = walkPath(tree, candidate)
+                /* Walk from the already-resolved container (`rootValue`) using only the
+                   path SUFFIX past the shared prefix, instead of re-walking every
+                   candidate's full path from the tree root — the prefix is walked once
+                   per wake, not once per descendant. */
+                const walk = walkPath(rootValue, candidate.slice(prefix.length))
                 if (walk.exists) {
                     writeNode(node, walk.value)
                 } else {

package/src/lib/ui/runtime/createEffectNode.ts

@@ -1,6 +1,5 @@
 import { NODE_STATE } from './NODE_STATE.ts'
 import { OWNER } from './OWNER.ts'
-import { REACTIVE_CONTEXT } from './REACTIVE_CONTEXT.ts'
 import { runNode } from './runNode.ts'
 import { toTeardown } from './toTeardown.ts'
 import type { EffectResult } from './types/EffectResult.ts'
@@ -52,11 +51,12 @@ export function createEffectNode(fn: () => EffectResult): () => void {
         runCleanup()
         unlinkDeps(node)
         /* Clearing compute makes runNode a no-op: an effect disposed mid-flush (by an
-           earlier effect in the same batch) is still in flushEffects' snapshot array
-           after pendingEffects.delete, so it would otherwise re-run its body and
-           re-link into the graph — a disposed effect resurrected. */
+           earlier effect in the same batch) is still in the queue flushEffects is
+           draining, so without this it would re-run its body and re-link into the graph
+           — a disposed effect resurrected. This alone neutralizes it; the queue is a
+           plain array (no O(1) delete) and a settled no-op iteration is cheaper than an
+           O(n) splice, so the stale entry is left to be skipped on its flush. */
         node.compute = undefined
-        REACTIVE_CONTEXT.pendingEffects.delete(node)
     }
     if (OWNER.current !== undefined) {
         OWNER.current.push(dispose)

package/src/lib/ui/runtime/flushEffects.ts

@@ -1,20 +1,33 @@
 import { REACTIVE_CONTEXT } from './REACTIVE_CONTEXT.ts'
+import type { ReactiveNode } from './types/ReactiveNode.ts'
 import { updateIfNecessary } from './updateIfNecessary.ts'
 
 /*
 Drains queued effects synchronously. Each is queued when it first leaves CLEAN, but
 runs only if `updateIfNecessary` finds a dependency that truly changed — a CHECK
 effect whose deps all memoised back to equal values settles to CLEAN without
-running its body. Snapshots and clears the queue each pass so an effect that dirties
-further effects re-queues them for the next pass rather than mutating the set
-mid-iteration; loops until the graph settles.
+running its body. Double-buffers the queue each pass — swaps in a fresh array and
+drains the captured one — so an effect that dirties further effects re-queues them
+for the next pass rather than mutating the array mid-iteration; loops until the
+graph settles. The swap reuses the drained array as the next spare, so a steady
+flush allocates nothing.
 */
 export function flushEffects(): void {
-    while (REACTIVE_CONTEXT.pendingEffects.size > 0) {
-        const batch = [...REACTIVE_CONTEXT.pendingEffects]
-        REACTIVE_CONTEXT.pendingEffects.clear()
-        for (const node of batch) {
-            updateIfNecessary(node)
-        }
+    /* Empty-queue fast path allocates nothing — only the length check, matching the
+       old `Set.size` guard. Hot: a write with no subscribed effect (e.g. a reconcile's
+       index-cell write nobody reads) still calls here at batch-exit, thousands of times
+       per list op; the spare array below must not be born on that path. */
+    if (REACTIVE_CONTEXT.pendingEffects.length === 0) {
+        return
     }
+    let spare: ReactiveNode[] = []
+    do {
+        const batch = REACTIVE_CONTEXT.pendingEffects
+        REACTIVE_CONTEXT.pendingEffects = spare
+        for (let index = 0; index < batch.length; index += 1) {
+            updateIfNecessary(batch[index] as ReactiveNode)
+        }
+        batch.length = 0
+        spare = batch
+    } while (REACTIVE_CONTEXT.pendingEffects.length > 0)
 }

package/src/lib/ui/runtime/historyEntries.ts

@@ -2,7 +2,7 @@ import type { AbideHistoryState } from './types/AbideHistoryState.ts'
 
 /*
 Per-history-entry scroll buckets for manual scroll restoration. The browser's own
-restoration is disabled (`history.scrollRestoration = 'manual'` at router boot)
+restoration is disabled (`history.scrollRestoration = 'manual'` after the first build/hydration)
 because the router tears the page down and rebuilds it AFTER the browser would have
 restored scroll — so the offset is lost against a node that no longer exists. Instead
 each history entry carries a monotonic id (stamped into `history.state.abideEntry` by

package/src/lib/ui/runtime/track.ts

@@ -15,8 +15,10 @@ observer is reading the same source in the same order as before — advance the
 cursor and reuse the edge, allocating nothing. Otherwise splice a fresh edge in at
 the cursor; `runNode` trims whatever stale edges trail the cursor when compute ends.
 
-A consecutive re-read of the same source (`dep` already the edge at the cursor) is
-absorbed by the reuse check, so `{x} … {x}` in one computation links `x` once.
+On re-runs, an edge whose `dep` matches the next slot in the established list is
+reused in-place (cursor advances, no allocation). New edges are still appended for
+reads that extend the list or find a mismatched slot — including a second consecutive
+read of the same source when no matching edge yet follows the cursor.
 */
 export function track(dep: ReactiveNode): void {
     const sub = REACTIVE_CONTEXT.observer

package/src/lib/ui/runtime/trigger.ts

@@ -15,27 +15,41 @@ reaches). `nextSub` is read before recursing so the walk holds no edge a deeper
 pass could detach.
 */
 function mark(node: ReactiveNode, status: number): void {
-    if (node.status >= status) {
-        return
-    }
-    const wasClean = node.status === NODE_STATE.CLEAN
-    node.status = status
-    if (node.isEffect) {
-        if (wasClean) {
-            REACTIVE_CONTEXT.pendingEffects.add(node)
+    /* Tail-iterative down the subscriber cone: a node with a single subscriber (a
+       linear computed chain) advances by reassigning `node` instead of recursing, so a
+       deep chain costs a loop, not a 500-frame call stack. Only a true fan-out (>1
+       subscriber) recurses, and only for the extra branches. */
+    let nextStatus = status
+    for (;;) {
+        if (node.status >= nextStatus) {
+            return
         }
-        return
-    }
-    /* A computed propagates CHECK to its subscribers only on its first move out of
-       CLEAN — they are already CHECK on any later upgrade, so re-walking is wasted. */
-    if (!wasClean) {
-        return
-    }
-    let link = node.subsHead
-    while (link !== undefined) {
-        const next = link.nextSub
-        mark(link.sub, NODE_STATE.CHECK)
-        link = next
+        const wasClean = node.status === NODE_STATE.CLEAN
+        node.status = nextStatus
+        if (node.isEffect) {
+            if (wasClean) {
+                REACTIVE_CONTEXT.pendingEffects.push(node)
+            }
+            return
+        }
+        /* A computed propagates CHECK to its subscribers only on its first move out of
+           CLEAN — they are already CHECK on any later upgrade, so re-walking is wasted. */
+        if (!wasClean) {
+            return
+        }
+        const head = node.subsHead
+        if (head === undefined) {
+            return
+        }
+        /* Recurse into every branch but the last; continue the loop on the last, so the
+           common single-subscriber chain never recurses. */
+        let link = head
+        while (link.nextSub !== undefined) {
+            mark(link.sub, NODE_STATE.CHECK)
+            link = link.nextSub
+        }
+        node = link.sub
+        nextStatus = NODE_STATE.CHECK
     }
 }
 

package/src/lib/ui/runtime/types/Route.ts

@@ -1,8 +1,8 @@
 /* A routable page/layout. Callable to mount directly into a host (the direct-mount
    API), but the router instead uses `build` — the bare client build — to fill the
    layer into its outlet boundary as a marker range (no `<abide-outlet>` wrapper; see
-   `fillBoundary`/`outlet`). `hydratable` (false when the page has an `await` block)
-   tells the router whether the first paint adopts the SSR DOM in place. */
+   `fillBoundary`/`outlet`). `hydratable` (always true for compiled components; undefined on manually-constructed
+   Route objects) tells the router whether the first paint adopts the SSR DOM in place. */
 export type Route = ((host: Element, props?: unknown) => (() => void) | undefined) & {
     build: (host: Node, props?: unknown) => void
     hydratable?: boolean

package/src/lib/ui/runtime/types/UiComponent.ts

@@ -10,8 +10,9 @@ page/route registries carry — abide-ui's compiled-component shape.
 export type UiComponent = ((host: Element, props?: UiProps) => () => void) & {
     /* `ctx` is the request-local block-id counter, threaded so a child's ids share the
        page's depth-first numbering; omitted at the top level (a fresh counter defaults
-       in). Returns a Promise when the component has an inline `await` (a blocking `{#await
-       … then}` block or a child render); otherwise renders synchronously. Callers `await`
+       in). Returns a Promise when the component contains an inline `await` — a blocking
+       `{#await … then}` block, a child-component render, a `<slot>` read, or a
+       top-level `await` in the author script; otherwise renders synchronously. Callers `await`
        it either way (awaiting a sync value just returns it). */
     render: (props?: UiProps, ctx?: RenderContext) => SsrRender | Promise<SsrRender>
     hydrate?: (host: Element, props?: UiProps) => () => void

package/src/lib/ui/runtime/types/UiProps.ts

@@ -1,14 +1,11 @@
 /*
-What a component is invoked with. Two real shapes flow through the one parameter.
-A top-level page/layout is called by the router (client) and `renderChain` (SSR)
-with its decoded route params — a plain string map. A nested child is called by
-the compiler-emitted `mountChild` with a map of reactive thunks (each authored
-prop, read in the body as `$props[name]?.()`) plus an optional `$children` slot
-builder carrying the component's `<slot>` markup, mounting into the host element
-it is handed.
+What a component is invoked with. A top-level page/layout is called by the router
+(client) and `renderChain` (SSR) with its route params as reactive thunks, shaped
+identically to the thunk map `mountChild` passes a nested child — so `props()` reads
+(`$props[name]?.()`) work uniformly on both. `$children` is the slot builder a parent
+component passes (carrying the component's `{children()}` content), or `CHILD_PRESENT`
+the router/SSR set on a layout that has a child layer below it.
 */
-export type UiProps =
-    | Record<string, string>
-    | (Record<string, () => unknown> & {
-          $children?: (host: Element) => void
-      })
+export type UiProps = Record<string, (() => unknown) | ((host: Element) => void)> & {
+    $children?: (host: Element) => void
+}

package/src/lib/ui/runtime/walkPath.ts

@@ -17,13 +17,25 @@ export function walkPath(tree: unknown, path: string): PathWalk {
     if (path === '') {
         return { exists: tree !== undefined, value: tree }
     }
+    /* A path with no `~` carries no escape in any segment, so the per-segment
+       unescape is skipped wholesale — the case for every plain-identifier path. */
+    const escaped = path.includes('~')
     let current: unknown = tree
-    for (const rawSegment of path.split('/')) {
-        const segment = unescapeKey(rawSegment)
+    /* Scan `/`-separated segments by index, no `split` array allocated — this runs
+       once per candidate on the structural descend scan, the hot path's hot loop. */
+    let start = 0
+    for (;;) {
+        const slash = path.indexOf('/', start)
+        const end = slash === -1 ? path.length : slash
+        const raw = path.slice(start, end)
+        const segment = escaped ? unescapeKey(raw) : raw
         if (current === null || typeof current !== 'object' || !(segment in current)) {
             return { exists: false, value: undefined }
         }
         current = (current as Record<string, unknown>)[segment]
+        if (slash === -1) {
+            return { exists: true, value: current }
+        }
+        start = slash + 1
     }
-    return { exists: true, value: current }
 }

package/src/lib/ui/startClient.ts

@@ -1,26 +1,41 @@
 import { createCacheStore } from '../shared/createCacheStore.ts'
+import { healthSeedSlot } from '../shared/healthSeedSlot.ts'
+import { rpcTimeoutSlot } from '../shared/rpcTimeoutSlot.ts'
+import { setAppName } from '../shared/setAppName.ts'
 import { setBaseResolver } from '../shared/setBaseResolver.ts'
 import { setCacheStoreResolver } from '../shared/setCacheStoreResolver.ts'
 import { setGlobalCacheStoreResolver } from '../shared/setGlobalCacheStoreResolver.ts'
 import { setPageResolver } from '../shared/setPageResolver.ts'
 import type { CacheSnapshotEntry } from '../shared/types/CacheSnapshotEntry.ts'
 import type { StreamedResolution } from '../shared/types/StreamedResolution.ts'
-import { installHotBridge } from './installHotBridge.ts'
-import { installInspectorBridge } from './installInspectorBridge.ts'
 import { probeNavigation } from './probeNavigation.ts'
+
+/* Build-time flag the production client defines false (see build.ts `define`) so the dev-only
+   hot bridge — and the entire DOM runtime it statically pulls in for re-builds — is dead-code-
+   eliminated, not even emitted as a chunk. Dev defines it true; the test preload sets it on
+   globalThis so the bare reference resolves there. */
+declare const __ABIDE_DEV__: boolean
+
 import { router } from './router.ts'
 import { clientPage } from './runtime/clientPage.ts'
 import type { RouteLoader } from './runtime/types/RouteLoader.ts'
 import { seedResolved } from './seedResolved.ts'
 
 /* The server's __SSR__ payload this entry consumes. */
-type SsrPayload = { cache?: CacheSnapshotEntry[]; base?: string }
+type SsrPayload = {
+    cache?: CacheSnapshotEntry[]
+    base?: string
+    app?: string
+    health?: Record<string, unknown>
+    clientTimeout?: number
+}
 
 /*
 The official abide-ui client entry. Reads the server's `window.__SSR__` payload,
 seeds a tab-scoped cache store from the inline snapshot (so a warm `cache()` read
-resolves synchronously and the matching `<template await>` adopts the SSR DOM with
-no re-fetch), installs the mount base, and starts the router — which imports the
+resolves synchronously and the matching `{#await}` adopts the SSR DOM with
+no re-fetch), installs the mount base, seeds the per-page __SSR__ stamps (app
+name, health, RPC timeout), and starts the router — which imports the
 current route's chunk, adopts the server-rendered `#app`, then drives SPA
 navigation — importing each further page's chunk on first visit and probing the
 destination through the server's app.handle so auth/redirect gating still applies.
@@ -37,19 +52,31 @@ export function startClient(
     if (target === null) {
         throw new Error('[abide] startClient: missing #app target')
     }
-    /* Dev only: the live-reload script sets `__abideDev` before this module runs,
-       so the runtime bridge is in place before any component mounts and records
-       its instances (mountChild) for hot replacement. */
-    if ((globalThis as { __abideDev?: boolean }).__abideDev) {
-        installHotBridge()
+    /* Dev only: the live-reload script sets `__abideDev` before this module runs, so the
+       runtime bridge is in place before any component mounts and records its instances
+       (mountChild) for hot replacement. Lazy-imported and `__ABIDE_DEV__`-gated so the
+       bridge (and the DOM runtime it drags in) is fully dead-code-eliminated in production
+       rather than shipped behind a runtime flag the minifier can't prove false. */
+    if (__ABIDE_DEV__ && (globalThis as { __abideDev?: boolean }).__abideDev) {
+        import('./installHotBridge.ts').then((module) => module.installHotBridge())
     }
-    /* Inspector only: the server injects `__abideInspect` when ABIDE_ENABLE_INSPECTOR
-       is on, so the scope/router bridge arms before the router builds any scope. */
+    /* Inspector only: the server injects `__abideInspect` when ABIDE_ENABLE_INSPECTOR is on,
+       so the scope/router bridge arms before the router builds any scope. Inspector can be
+       enabled in production, so this stays a lazy chunk (not `__ABIDE_DEV__`-gated) — emitted
+       but fetched only when the flag is set, never weighing down the default client load. */
     if ((globalThis as { __abideInspect?: boolean }).__abideInspect) {
-        installInspectorBridge()
+        import('./installInspectorBridge.ts').then((module) => module.installInspectorBridge())
     }
     const ssr = (globalThis as { __SSR__?: SsrPayload }).__SSR__ ?? {}
     setBaseResolver(() => ssr.base ?? '')
+    /* Seed the per-page __SSR__ stamps into their shared slots before mount: the app
+       name (default log channel), the health payload (so health()'s first probe is warm),
+       and the env-configured RPC timeout (ABIDE_CLIENT_TIMEOUT, shipped per request).
+       Without this the browser falls back to channel 'app', a cold first health probe,
+       and unbounded RPC fetches. */
+    setAppName(ssr.app)
+    healthSeedSlot.payload = ssr.health
+    rpcTimeoutSlot.ms = ssr.clientTimeout
     /* The `page` proxy reads route/params/url off the router-updated snapshot. */
     setPageResolver(() => clientPage.value)
 
@@ -61,7 +88,7 @@ export function startClient(
        (inline — reads settled at render-return, in __SSR__) and `__abideResumeCache` (pending
        {#await} reads whose `__abideResolve(...)` chunks the stream pushed during parse, before
        this deferred bundle ran). A warm entry lets a `cache()` read resolve synchronously so
-       `<template await>` adopts without a refetch; a miss marker re-fetches live. */
+       `{#await}` adopts without a refetch; a miss marker re-fetches live. */
     const streamed =
         (globalThis as { __abideResumeCache?: StreamedResolution[] }).__abideResumeCache ?? []
     for (const resolution of [...(ssr.cache ?? []), ...streamed]) {

package/src/lib/ui/state.ts

@@ -7,9 +7,9 @@ import { writeNode } from './runtime/writeNode.ts'
 A writable reactive cell — abide's from-scratch reactive primitive, with no
 compiler sigil and no external reactivity-library import. `.value` is a
 plain getter/setter over a signal node, so a read/write shows up as exactly that
-in a stack trace. The compiler's job (later) is only to auto-deref `{cell}` in
-templates and tag this declaration as a serializable manifest slot; the runtime
-needs no magic.
+in a stack trace. The compiler enforces scope attachment (bare `state()` is a compile
+error — use `scope().state()`), desugars plain `state(initial)` to a serializable `model`
+doc slot, and keeps `state(initial, transform)` as a `.value` cell; the runtime needs no magic.
 
 `transform` is an optional coercion gate on the write path: every `.value =`
 runs it and stores what it returns, with `previous` for clamp-relative writes or

package/src/lib/ui/types/Scope.ts

@@ -17,9 +17,9 @@ methods so a scope is a passable value: `<Child parentScope={scope} />`.
 Capabilities route where the scope's changes go: `record()` to an undo journal,
 `persist()` to durable storage, `broadcast()` to peers — declared once, then
 `undo`/`redo` act on a recorded scope. `id` is the scope's identity for the
-boundary-crossing capabilities — `persist()` defaults its key to it. `scope()` is
-the ONLY public entry; everything else is a method reached through it (the
-`history`/`persist`/`sync` helpers it composes are internal).
+boundary-crossing capabilities — `persist()` defaults its key to it. `scope()` is the only user-facing public entry; `effect` is also exported
+but only for generated binding code and the SSR strip (tagged plumbing). The
+`history`/`persist`/`sync` helpers it composes are internal.
 */
 export type Scope = {
     readonly id: string