@abide/abide 0.57.0 → 0.57.1

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # abide
 
+## 0.57.1
+
+### Patch Changes
+
+- 866c96d: degrade a mangled **SSR** payload to a cold boot (ADR-0051) ([`adfee02`](https://github.com/briancray/abide/commit/adfee024d570e8bf46230fac1fa2521fcaae056f))
+- 1abc943: Reuse the keyed-list (`{#for}`) reconcile scratch across passes so a steady-state reconcile allocates nothing
+
+    Each `each` reconcile built two fresh arrays per list change — `list.map(keyOf)` for the desired keys and `new Array(n)` for the resolved rows — then threw them away. On a list re-reconciled per keystroke that churn showed up as avoidable minor-GC pressure mid-interaction. The two buffers are now hoisted into persistent per-`each` scratch, reused every pass and cleared down to the live length on shrink (so no disposed-row references are retained). The `keyOf` pass is fused into the resolve loop — still exactly one `keyOf` call per item. Behaviour is unchanged: keyed diffing, in-place row updates, duplicate-key collapse, and prune-before-place all resolve identically; only the per-pass allocation is gone. The `[...source]` materialization for non-array iterables (generators must be drained) is unchanged.
+
+- e137242: `spreadAttrs` — swallow a per-key suspend on a `{...rest}` spread
+
+    A `{...rest}` spread guards its enumeration against a pending blocking `await` read, but not the per-key value read. When `source()` is a restProps proxy (the `<Button {...rest}>` case), its `get` invokes the underlying prop thunk, so a key whose expression reads a still-pending blocking cell suspends inside `bindKeys` — after the enumeration guard has already passed — and the `SuspenseSignal` escaped the render, killing the mount (seen as a crash on a cold client remount, e.g. navigating back to a page whose top-level blocking cells re-fetch and are briefly `pending()`). The per-key read now catches the suspend and binds the key as a deferred attribute (its `attr` effect swallows the signal and fills the value in on settle), matching `attr` and the deferred-enumeration branch; event handlers, whose thunks return a function without reading a cell, never suspend and stay on the listener path.
+
+- 7367a23: SSR hydration payload ships as inert JSON instead of executable JavaScript (ADR-0051)
+
+    The `window.__SSR__` boot payload now ships as `<script type="application/json">` parsed once by the deferred client bundle with `JSON.parse`, rather than a `window.__SSR__ = {…}` statement the browser had to compile and evaluate as a multi-MB program on the critical path. The global still exists for debugging — the bundle republishes it after parsing. Additionally, a json cache body is now seeded pre-parsed (`data`) rather than as a re-escaped JSON string nested in the payload, so it's single-encoded (roughly half the wire bytes and gzip for a json-heavy grid) and read without a second parse. Warm-seed semantics — zero refetch, zero hydration divergence — are unchanged.
+
 ## 0.57.0
 
 ### Minor Changes

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@abide/abide",
-    "version": "0.57.0",
+    "version": "0.57.1",
     "type": "module",
     "sideEffects": false,
     "description": "Isomorphic multimodal HTTP framework built for humans and machines in a single Bun runtime",

package/src/lib/server/runtime/createUiPageRenderer.ts

@@ -6,6 +6,7 @@ import { formatTraceparent } from '../../shared/formatTraceparent.ts'
 import { hasSeedableRequest } from '../../shared/hasSeedableRequest.ts'
 import { layoutChainForRoute } from '../../shared/layoutChainForRoute.ts'
 import { resolvedCellsSlot } from '../../shared/resolvedCellsSlot.ts'
+import { SSR_SCRIPT_ID } from '../../shared/SSR_SCRIPT_ID.ts'
 import { safeJsonForScript } from '../../shared/safeJsonForScript.ts'
 import { socketTailsSlot } from '../../shared/socketTailsSlot.ts'
 import type { CacheEntry } from '../../shared/types/CacheEntry.ts'
@@ -213,7 +214,11 @@ export function createUiPageRenderer({
             health,
             clientTimeout,
         } satisfies SsrPayload)
-        return `<script>window.__SSR__ = ${payload};</script>`
+        /* Inert JSON data, NOT a `window.__SSR__ = {…}` statement (ADR-0051): the browser never
+           compiles this multi-MB payload as JavaScript on the critical path — the deferred bundle
+           reads it with one `JSON.parse`. `safeJsonForScript` has already `<`-escaped every
+           `<`, so an embedded `</script>` can't close the tag early. */
+        return `<script type="application/json" id="${SSR_SCRIPT_ID}">${payload}</script>`
     }
 
     /* Per-route `<link rel=modulepreload>`s for the route's page + layout-chain chunks

package/src/lib/server/runtime/snapshotEntryFromCache.ts

@@ -87,15 +87,29 @@ export async function snapshotEntryFromCache(
             headers: response.headers,
         }),
     )
-    return {
+    const wire: CacheSnapshotEntry = {
         key: entry.key,
         url: entry.request.url,
         method,
         status: response.status,
         statusText: response.statusText,
         headers: Array.from(response.headers.entries()),
-        body,
     }
+    /* Ship a json body PARSED so it single-encodes in the payload rather than nesting a
+       re-escaped JSON string (ADR-0051 — the double-encoding that ~2.35×'d the wire). On a
+       parse failure ship the raw string under `body`: the client decodes it async exactly as
+       before (warmValueFromSnapshot's own try/catch), so a malformed-but-json-typed body still
+       round-trips rather than throwing here. A text body always ships raw. */
+    if (kind === 'json') {
+        try {
+            wire.data = JSON.parse(body)
+            return wire
+        } catch {
+            /* fall through to the raw-string form */
+        }
+    }
+    wire.body = body
+    return wire
 }
 
 async function readSettled(promise: Promise<Response>): Promise<Response | undefined> {

package/src/lib/shared/SSR_SCRIPT_ID.ts

@@ -0,0 +1,11 @@
+/*
+The id of the `<script type="application/json">` element the server emits the
+`window.__SSR__` payload into and the client (`startClient`) parses back out
+(ADR-0051). Shipping the payload as inert JSON data — not a `window.__SSR__ = {…}`
+executable statement — means the browser never COMPILES a multi-MB object literal
+as JavaScript on the critical path; the deferred client bundle reads it with one
+`JSON.parse` (a restricted grammar parsed several times faster than equivalent JS
+source). Both sides import this constant so the write id and read id can't drift.
+*/
+// @documentation plumbing
+export const SSR_SCRIPT_ID = 'abide-ssr'

package/src/lib/shared/cacheEntryFromSnapshot.ts

@@ -15,7 +15,12 @@ the first cache() read adopts its call site's ttl (see CacheEntry).
 */
 export function cacheEntryFromSnapshot(entry: CacheSnapshotEntry): CacheEntry {
     const headers = new Headers(entry.headers)
-    const response = new Response(entry.body, {
+    /* Body text for async readers / shareable clones. A json body arrives PARSED as `data`
+       (ADR-0051): re-stringify it (compact JSON — value-identical to the server body, whose
+       `json()` also emits compact JSON) so a later `.json()`/`.text()`/`.clone()` still works.
+       A text (or parse-failed json) body arrives raw as `body`. */
+    const bodyText = 'data' in entry ? JSON.stringify(entry.data) : (entry.body ?? '')
+    const response = new Response(bodyText, {
         status: entry.status,
         statusText: entry.statusText,
         headers,
@@ -26,7 +31,7 @@ export function cacheEntryFromSnapshot(entry: CacheSnapshotEntry): CacheEntry {
         request: new Request(entry.url, { method: entry.method }),
         ttl: undefined,
         expiresAt: undefined,
-        value: warmValueFromSnapshot(entry.status, headers, entry.body),
+        value: warmValueFromSnapshot(entry, headers, bodyText),
         settled: true,
         hydrated: true,
     }
@@ -42,19 +47,23 @@ non-2xx, 204 (the status gate below), streaming, binary (the DEFER sentinel) —
 yields no warm value and defers to the async path, which throws HttpError /
 returns the streaming error / blobs exactly as a live call would.
 */
-function warmValueFromSnapshot(status: number, headers: Headers, body: string): unknown {
+function warmValueFromSnapshot(entry: CacheSnapshotEntry, headers: Headers, body: string): unknown {
     /* Status gate is side-specific: an error/204 has no warm value here, but the live
        read throws HttpError / returns undefined for the same status — so it stays out of
        the shared kind mapping. */
-    if (status === 204 || status < 200 || status >= 300) {
+    if (entry.status === 204 || entry.status < 200 || entry.status >= 300) {
         return undefined
     }
     const kind = contentBodyKind(contentTypeOf(headers))
     const value = bodyValueForKind(
         kind,
-        /* The body may still be malformed JSON; fall back to the async path rather than
-           throwing a SyntaxError synchronously during hydration. */
+        /* Pre-parsed json body (`data`, ADR-0051) IS the value — no second parse. A raw json
+           body may still be malformed; fall back to the async path rather than throwing a
+           SyntaxError synchronously during hydration. */
         () => {
+            if ('data' in entry) {
+                return entry.data
+            }
             try {
                 return JSON.parse(body)
             } catch {

package/src/lib/shared/types/CacheSnapshotEntry.ts

@@ -6,6 +6,15 @@ Any entry called inline during render (any method) with a textual Content-Type i
 emitted, so the client hydrates warm instead of re-firing the call after render;
 binary bodies don't survive a JSON round-trip. The seeded value is read warm once
 — it is never auto-replayed (that stays GET-only, see REPLAYABLE_METHODS).
+
+The body travels in ONE of two shapes, never both (ADR-0051): a json-kind body
+ships PARSED as `data` — a live JSON value nested directly in the payload — so the
+whole snapshot serialises once (the payload's own `JSON.stringify`) instead of the
+body being pre-serialised to a string and then re-escaped as a nested string
+literal (the double-encoding that ~2.35×'d the wire and forced the client to parse
+the body a second time). A text-kind body — or a json body the server couldn't
+parse — ships raw as `body`. The client re-derives which from the presence of
+`data` (`cacheEntryFromSnapshot`).
 */
 export type CacheSnapshotEntry = {
     key: string
@@ -14,5 +23,10 @@ export type CacheSnapshotEntry = {
     status: number
     statusText: string
     headers: Array<[string, string]>
-    body: string
+    /* Raw body text — present for a text-kind body, or a json body that failed to parse
+       server-side (shipped raw, decoded async client-side as before). Absent when `data` is. */
+    body?: string
+    /* Pre-parsed json-kind body, single-encoded. Present iff the body was json and parsed;
+       `'data' in entry` is the discriminator (a `null` json body still keys present). */
+    data?: unknown
 }

package/src/lib/ui/dom/each.ts

@@ -62,6 +62,12 @@ export function each<T>(
     /* Each row's scope, registered with the owner so every live row disposes on owner
        teardown (the effect's own disposer only unsubscribes it from `items()`). */
     const group = scopeGroup()
+    /* Persistent reconcile scratch, reused across passes so a steady-state reconcile
+       allocates nothing: `keys` holds each desired key (one `keyOf` call per item), `resolved`
+       its surviving row (or undefined → build). Both are sized to the current list each pass
+       and their stale tail is cleared, so a shrinking list retains no disposed-row refs. */
+    const keys: string[] = []
+    const resolved: (EachRow | undefined)[] = []
 
     /* Build a row's range. Hydrate mode (only while the claim cursor is active —
        read fresh, since a row built by a post-hydration reconcile must create, not
@@ -177,22 +183,30 @@ export function each<T>(
         withoutHydration(() => {
             /* Undefined source → empty list (see the hydration loop, ADR-0032 D3). */
             const list = source == null ? [] : Array.isArray(source) ? source : [...source]
-            const keys = list.map(keyOf)
+            const count = list.length
             generation += 1
             const pass = generation
-            /* Resolve each desired key to its surviving row once, here, stamping it with
-               this pass — so prune below is an int compare (no `Set`) and the placement
-               walk reuses the resolved row instead of a second `rows.get`. Halving the map
-               lookups per reconcile is a real win once the harness's O(n) `nextSibling` no
-               longer swamps it. `undefined` marks a key with no surviving row — a build. */
-            const resolved: (EachRow | undefined)[] = new Array(keys.length)
-            for (let index = 0; index < keys.length; index += 1) {
-                const row = rows.get(keys[index] as string)
+            /* Fill the reused scratch and resolve each desired key to its surviving row once,
+               here, stamping it with this pass — so prune below is an int compare (no `Set`)
+               and the placement walk reuses the resolved row instead of a second `rows.get`.
+               Halving the map lookups per reconcile is a real win once the harness's O(n)
+               `nextSibling` no longer swamps it. `undefined` marks a key with no surviving row
+               — a build. One `keyOf` call per item, cached in `keys` for the placement walk. */
+            for (let index = 0; index < count; index += 1) {
+                const key = keyOf(list[index] as T)
+                keys[index] = key
+                const row = rows.get(key)
                 if (row !== undefined) {
                     row.gen = pass
                 }
                 resolved[index] = row
             }
+            /* Drop the previous pass's longer tail so a shrunk list retains no disposed-row
+               refs and the scratch stays sized to the live list. */
+            if (keys.length > count) {
+                keys.length = count
+                resolved.length = count
+            }
             /* Prune departed rows first (those the resolve loop didn't reach this pass) so
                their ranges don't sit between survivors and throw off the in-place sibling
                checks below. */

package/src/lib/ui/dom/spreadAttrs.ts

@@ -70,7 +70,22 @@ function bindKeys(
         if (skip.has(key)) {
             continue
         }
-        const value = object[key]
+        /* Reading the value can itself throw a `SuspenseSignal`: when `source()` is a
+           restProps proxy (the `<Button {...rest}>` case), its `get` invokes the underlying
+           prop thunk, so a key whose expression reads a still-pending blocking `await` suspends
+           HERE — after the `source()` enumeration guard already passed. Classify it as an
+           attribute; `attr`'s own effect swallows the suspend and fills the value in on settle.
+           An event handler never suspends — its thunk returns a function without reading a cell. */
+        let value: unknown
+        try {
+            value = object[key]
+        } catch (signal) {
+            if (!(signal instanceof SuspenseSignal)) {
+                throw signal
+            }
+            attr(element, key, () => source()[key])
+            continue
+        }
         if (key.startsWith('on') && typeof value === 'function') {
             on(element, key.slice(2), value as EventListener)
         } else if (typeof value !== 'function') {

package/src/lib/ui/startClient.ts

@@ -7,6 +7,7 @@ import { cacheStoreSlot } from '../shared/cacheStoreSlot.ts'
 import { createCacheStore } from '../shared/createCacheStore.ts'
 import { pageSlot } from '../shared/pageSlot.ts'
 import { SOCKET_SEED } from '../shared/SOCKET_SEED.ts'
+import { SSR_SCRIPT_ID } from '../shared/SSR_SCRIPT_ID.ts'
 import { sharedCacheStoreSlot } from '../shared/sharedCacheStoreSlot.ts'
 import type { SsrPayload } from '../shared/types/SsrPayload.ts'
 import type { StreamedResolution } from '../shared/types/StreamedResolution.ts'
@@ -32,6 +33,39 @@ navigation — importing each further page's chunk on first visit and probing th
 destination through the server's app.handle so auth/redirect gating still applies.
 Returns a disposer. `target` defaults to `#app`; pass one explicitly in tests.
 */
+/*
+Reads the server's SSR payload. Production ships it as an inert `<script
+type="application/json">` (ADR-0051) parsed once here in the deferred bundle — off the
+critical path, and through the fast JSON grammar rather than a compiled multi-MB JS object
+literal. A pre-set `globalThis.__SSR__` wins first: the uiStartClient tests stamp it
+directly, and it preserves any pre-bundle inline stamp. The parsed payload is republished
+onto `globalThis.__SSR__` for devtools / inspector visibility.
+*/
+function readSsrPayload(): Partial<SsrPayload> {
+    const globalScope = globalThis as { __SSR__?: Partial<SsrPayload> }
+    const preset = globalScope.__SSR__
+    if (preset !== undefined) {
+        return preset
+    }
+    const element = typeof document !== 'undefined' ? document.getElementById(SSR_SCRIPT_ID) : null
+    const text = element?.textContent
+    if (!text) {
+        return {}
+    }
+    /* Degrade a mangled payload to a cold boot rather than throwing out of startClient (a
+       proxy/extension could corrupt the script text). The old inline `window.__SSR__ = {…}`
+       statement failed the same way — its throw left the global undefined and the `?? {}`
+       fallback booted cold — so keep that resilience instead of failing the whole mount. */
+    let parsed: Partial<SsrPayload>
+    try {
+        parsed = JSON.parse(text) as Partial<SsrPayload>
+    } catch {
+        return {}
+    }
+    globalScope.__SSR__ = parsed
+    return parsed
+}
+
 // @documentation plumbing
 export function startClient(
     routes: Record<string, RouteLoader>,
@@ -43,7 +77,7 @@ export function startClient(
     if (target === null) {
         throw new Error('[abide] startClient: missing #app target')
     }
-    const ssr = (globalThis as { __SSR__?: Partial<SsrPayload> }).__SSR__ ?? {}
+    const ssr = readSsrPayload()
     /* Seed the per-page __SSR__ stamps into their shared slots before mount: the mount
        base, app name (default log channel), health payload (so health()'s first probe is
        warm), and the env-configured RPC timeout (ABIDE_CLIENT_TIMEOUT, shipped per