@oh-my-pi/pi-tui 18.4.2 → 18.4.4

package/src/components/loader.ts

@@ -1,13 +1,99 @@
+import type { TspProps } from "@oh-my-pi/pi-wire";
+import { elapsed, kbd, keyed, node, row, span, text } from "../native/describe";
+import { plainText } from "../native/spans";
+import type { DescribeContext, NativeChild, NativeNode, NativeUiEvent } from "../native/node";
+import { isNativeRendering } from "../native/state";
+import { describeShimmer, type ShimmerPalette, shimmerEnabled } from "../theme/shimmer";
 import type { TUI } from "../tui";
 import { getPaddingX, padding, sliceByColumn, visibleWidth } from "../utils";
 import { Text } from "./text";
 
+const DEFAULT_SPINNER_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
 const RENDER_INTERVAL_MS = 1000 / 30;
 /** Milliseconds between spinner-frame advances; exported so time-derived spinners elsewhere tick at the Loader cadence. */
 export const SPINNER_ADVANCE_MS = 80;
 const RENDER_BACKPRESSURE_MULTIPLIER = 9;
 const MAX_BACKPRESSURE_FRAME_COST_MS = 200;
 
+/** Native repaint cadence of a retry countdown ring (the terminal eases the ring between frames). */
+const RETRY_METER_REPAINT_MS = 500;
+
+/** A working-row variant (§6.5): a retry countdown, or context compaction. */
+export type WorkingRowVariant =
+	| {
+			readonly kind: "retry";
+			readonly attempt: number;
+			readonly max: number;
+			/** The wait before the attempt, in ms, counted from the row's `startedAt`. */
+			readonly delayMs: number;
+	  }
+	| { readonly kind: "compaction" };
+
+/** What the dock's working row (§8.1, role `omp.working`) shows. */
+export interface WorkingRowSpec {
+	/** The intent, or the variant's label ("Retrying · attempt 1 of 3", "Compacting context…"). */
+	readonly label: string;
+	/** Epoch ms the work started: the `elapsed` origin and the retry countdown start. */
+	readonly startedAt: number;
+	readonly variant?: WorkingRowVariant;
+	/** Shimmer palette of the label (a session-accented intent). */
+	readonly palette?: ShimmerPalette;
+	/** Live tok/s, docked before the stop control. */
+	readonly rate?: number;
+	/** Key id that interrupts (`escape`); undefined hides the stop control (Esc would not cancel). */
+	readonly interruptKey?: string;
+}
+
+/** A key id as tooltip keys: `escape` reads `esc`, the rest as bound. */
+function titleKey(key: string): string {
+	return key === "escape" ? "esc" : key;
+}
+
+/**
+ * The dock's working row: `starburst` spinner (or a retry countdown ring),
+ * the intent shimmering, `·`, the elapsed time, a grow spacer, then the stop
+ * control whose click sends `interrupt`. Compaction adds an indeterminate
+ * `progress` before the stop control; a retry says "Cancel".
+ */
+export function describeWorkingRow(spec: WorkingRowSpec, cx: DescribeContext, now = Date.now()): NativeNode {
+	const variant = spec.variant;
+	const children: NativeChild[] = [];
+	if (variant?.kind === "retry" && cx.supports("meter")) {
+		const remaining = Math.max(0, variant.delayMs - (now - spec.startedAt));
+		const value = variant.delayMs > 0 ? Math.round((remaining / variant.delayMs) * 100) / 100 : 0;
+		children.push(node("meter", { value, style: "ring", size: "sm" }, undefined, "countdown"));
+	} else {
+		children.push(node("spinner", { style: "starburst", tone: "accent" }, undefined, "spinner"));
+	}
+	const label = describeShimmer([{ text: spec.label, palette: spec.palette }], "label");
+	children.push(
+		node(label.k, { ...label.p, role: "omp.working.label" } as TspProps, label.c, label.key),
+		node("text", { text: "·", role: "omp.working.sep" }, undefined, "sep"),
+		keyed(elapsed(now - spec.startedAt), "elapsed"),
+		node("row", { grow: 1 }, undefined, "fill"),
+	);
+	if (variant?.kind === "compaction") children.push(node("progress", { value: null }, undefined, "progress"));
+	if (spec.rate !== undefined) children.push(node("rate", { value: spec.rate, unit: "tok/s" }, undefined, "rate"));
+	if (spec.interruptKey !== undefined) {
+		const verb = variant?.kind === "retry" ? "Cancel" : "Stop";
+		children.push(
+			node(
+				"row",
+				{
+					role: "omp.working.stop",
+					gap: "xs",
+					align: "center",
+					title: `${verb}  ${titleKey(spec.interruptKey)}`,
+					actions: { click: "interrupt" },
+				},
+				[kbd(titleKey(spec.interruptKey)), text(verb)],
+				"stop",
+			),
+		);
+	}
+	return row(children, { role: "omp.working", align: "center", gap: "sm" });
+}
+
 type ColorFn = (str: string) => string;
 
 /**
@@ -20,7 +106,7 @@ export type LoaderMessageColorFn = ColorFn & {
 
 /** Animates a spinner and colorized message while asynchronous work is pending. */
 export class Loader extends Text {
-	#frames = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+	#frames = DEFAULT_SPINNER_FRAMES;
 	#currentFrame = 0;
 	#intervalId?: NodeJS.Timeout;
 	#ui: TUI | null = null;
@@ -37,6 +123,10 @@ export class Loader extends Text {
 	#layoutFrames: readonly string[];
 	#layoutFrame: string;
 	#trailer?: () => string | undefined;
+	#native?: { message: string; trailer: string; shimmer: boolean; node: NativeNode };
+	#working?: { spec: () => WorkingRowSpec; interrupt: () => void };
+	#workingNative?: { key: string; node: NativeNode };
+	#nativeTimer?: NodeJS.Timeout;
 
 	constructor(
 		ui: TUI,
@@ -136,10 +226,93 @@ export class Loader extends Text {
 		return lines;
 	}
 
+	/**
+	 * A `spinner` (or the static glyph of a one-frame loader, e.g. an interrupt
+	 * key hint) followed by the message, shimmering when the message colorizer
+	 * animates, and the right-docked trailer. The terminal clocks the motion.
+	 * Function messages are re-read whenever the engine revisits the loader.
+	 */
+	override describe(cx: DescribeContext): NativeNode {
+		if (this.#working) return this.#describeWorking(cx);
+		const message = plainText(this.#resolveMessage());
+		const trailer = plainText(this.#trailer?.() ?? "");
+		const shimmer = this.messageColorFn.animated === true && shimmerEnabled();
+		const cached = this.#native;
+		if (cached && cached.message === message && cached.trailer === trailer && cached.shimmer === shimmer) {
+			return cached.node;
+		}
+		const indicator =
+			this.#frames.length > 1
+				? node("spinner", this.#frames === DEFAULT_SPINNER_FRAMES ? { style: "braille" } : {})
+				: text([span(plainText(this.#frames[0] ?? "").trim(), "muted")], { wrap: "none" });
+		const label = shimmer
+			? describeShimmer([{ text: message }], "message")
+			: node("text", { spans: [span(message, "muted")] }, undefined, "message");
+		const children: NativeChild[] = [row([indicator, label], { gap: "sm", align: "baseline" })];
+		if (trailer) children.push(text(trailer, { wrap: "none", truncate: "end" }));
+		const described = row(children, { justify: "between", role: "omp.loader" });
+		this.#native = { message, trailer, shimmer, node: described };
+		return described;
+	}
+
+	/**
+	 * Describe as the dock's working row ({@link describeWorkingRow}) instead
+	 * of a spinner line; `spec` is re-read whenever the engine revisits the
+	 * loader and `interrupt` answers a click on its stop control.
+	 */
+	setWorkingRow(spec: () => WorkingRowSpec, interrupt: () => void): void {
+		this.#working = { spec, interrupt };
+		this.#workingNative = undefined;
+		this.#startNativeCountdown();
+	}
+
+	/** A click on the working row's stop control. */
+	handleNativeEvent(event: NativeUiEvent): void {
+		if (event.type === "action" && event.act === "interrupt") this.#working?.interrupt();
+	}
+
+	#describeWorking(cx: DescribeContext): NativeNode {
+		const spec = this.#working!.spec();
+		const now = Date.now();
+		const variant = spec.variant;
+		const countdown =
+			variant?.kind === "retry" && cx.supports("meter")
+				? Math.round((Math.max(0, variant.delayMs - (now - spec.startedAt)) / Math.max(1, variant.delayMs)) * 100)
+				: -1;
+		const key = [
+			spec.label,
+			spec.startedAt,
+			variant?.kind,
+			variant?.kind === "retry" ? `${variant.attempt}/${variant.max}` : "",
+			countdown,
+			spec.rate,
+			spec.interruptKey,
+			spec.palette?.mid,
+			shimmerEnabled(),
+		].join("\u0000");
+		const cached = this.#workingNative;
+		if (cached?.key === key) return cached.node;
+		const described = describeWorkingRow(spec, cx, now);
+		this.#workingNative = { key, node: described };
+		return described;
+	}
+
+	/** A TSP terminal clocks the spinner and timer, but a retry ring's fill is omp's: repaint it while counting down. */
+	#startNativeCountdown(): void {
+		if (this.#nativeTimer || !isNativeRendering() || this.#working?.spec().variant?.kind !== "retry") return;
+		this.#nativeTimer = setInterval(() => this.#requestPaint(), RETRY_METER_REPAINT_MS);
+		this.#nativeTimer.unref?.();
+	}
+
 	start() {
 		this.#lastSpinnerTick = performance.now();
 		this.#syncText();
 		this.#requestPaint();
+		// The TSP terminal animates the described spinner; nothing to repaint.
+		if (isNativeRendering()) {
+			this.#startNativeCountdown();
+			return;
+		}
 		const intervalMs = this.messageColorFn.animated === true ? RENDER_INTERVAL_MS : SPINNER_ADVANCE_MS;
 		this.#scheduleTick(intervalMs, intervalMs);
 	}
@@ -149,6 +322,10 @@ export class Loader extends Text {
 			clearTimeout(this.#intervalId);
 			this.#intervalId = undefined;
 		}
+		if (this.#nativeTimer) {
+			clearInterval(this.#nativeTimer);
+			this.#nativeTimer = undefined;
+		}
 	}
 
 	/** Lifecycle teardown: stop the animation timer. Idempotent. */
@@ -174,6 +351,11 @@ export class Loader extends Text {
 	#scheduleTick(intervalMs: number, delayMs: number): void {
 		const timer = setTimeout(() => {
 			if (this.#intervalId !== timer) return;
+			if (isNativeRendering()) {
+				// A TSP surface opened mid-animation: the terminal clocks it from here.
+				this.#intervalId = undefined;
+				return;
+			}
 			const startedAt = performance.now();
 			const elapsed = startedAt - this.#lastSpinnerTick;
 			const shouldAdvanceSpinner = elapsed >= SPINNER_ADVANCE_MS;

package/src/components/markdown.ts

@@ -10,6 +10,9 @@ import {
 import { mathBlockAt, mathSpanAt, mathStartIndex } from "@oh-my-pi/pi-utils/math-delimiters";
 import { latexToBlock } from "../latex-block";
 import { isBareMathEnvironment, latexToUnicode } from "../latex-to-unicode";
+import { plainText } from "../native/spans";
+import { md } from "../native/describe";
+import type { DescribeContext, NativeNode } from "../native/node";
 import type { SymbolTheme } from "../symbols";
 import { TERMINAL } from "../terminal-capabilities";
 import type { Component } from "../tui";
@@ -880,7 +883,10 @@ for (const table of [Lexer.rules.block.normal, Lexer.rules.block.gfm]) {
 
 const RENDER_CACHE_MAX = 256; // sane cap: ~256 distinct message × width combos
 const RENDER_CACHE_MAX_SIZE = 4 * 1024 * 1024;
-const RENDER_CACHE_MAX_ENTRY_SIZE = 256 * 1024;
+// Entry size counts the key (it embeds the whole normalized source) plus the
+// rendered rows, so this admits roughly the same documents a rows-only 256 KiB
+// cap did while the aggregate bound covers everything the entry retains.
+const RENDER_CACHE_MAX_ENTRY_SIZE = 512 * 1024;
 const EMPTY_RENDER_LINES: readonly string[] = [];
 
 interface RenderedLine {
@@ -900,7 +906,7 @@ const renderCache = new LRUCache<string, readonly string[]>({
 	max: RENDER_CACHE_MAX,
 	maxSize: RENDER_CACHE_MAX_SIZE,
 	maxEntrySize: RENDER_CACHE_MAX_ENTRY_SIZE,
-	sizeCalculation: renderedLinesCacheSize,
+	sizeCalculation: (lines, key) => renderedLinesCacheSize(lines) + key.length,
 });
 
 function renderedLinesCacheSize(lines: readonly string[]): number {
@@ -909,6 +915,15 @@ function renderedLinesCacheSize(lines: readonly string[]): number {
 	return Math.max(1, size);
 }
 
+/**
+ * Append `src` onto `dst` element-wise. `dst.push(...src)` passes every row as
+ * a call argument, which throws past the engine's argument limit on very long
+ * documents.
+ */
+function appendLines(dst: string[], src: readonly string[]): void {
+	for (let i = 0; i < src.length; i++) dst.push(src[i]!);
+}
+
 // ---------------------------------------------------------------------------
 // Fast-tail (B+) hazard gates
 // ---------------------------------------------------------------------------
@@ -1661,7 +1676,9 @@ interface RenderSignature {
 interface StreamPrefixLineCache extends RenderSignature {
 	text: string;
 	tokenCount: number;
-	lines: readonly string[];
+	// Private to the cache and never handed to callers (each frame copies it
+	// into a fresh output array), so an advancing prefix appends in place.
+	lines: string[];
 }
 /**
  * Per-token row cache for the *unfrozen tail* (PoC H). The tail re-lexes every
@@ -1717,7 +1734,9 @@ interface TailRenderRecorder {
 interface StreamingHighlightCache extends RenderSignature {
 	lang: string | undefined;
 	text: string;
-	lines: readonly string[];
+	// Appended in place as the fence grows. Only ever returned to
+	// #renderCodeBodyLines, which reads it synchronously and keeps no reference.
+	lines: string[];
 	stream: HighlightStreamSession;
 }
 
@@ -1801,6 +1820,7 @@ export class Markdown implements Component {
 	// B+ capture plumbing: #renderContentLines records the last rendered paragraph row.
 	#lastTailCapture?: { kind: "paragraph"; open: boolean; rowInput: string; rowRaw: string };
 	#ignoreTight = false;
+	#native?: { text: string; stream: boolean; node: NativeNode };
 	setIgnoreTight(ignore: boolean): this {
 		this.#ignoreTight = ignore;
 		this.invalidate();
@@ -1882,10 +1902,7 @@ export class Markdown implements Component {
 			// Blank replacement: render() early-returns before #lexTokens can see
 			// the non-append edit, so drop the frozen stream state here or it
 			// outlives the content it indexed.
-			this.#streamPrefixText = undefined;
-			this.#streamPrefixTokens = undefined;
-			this.#streamPrefixLineCache = undefined;
-			this.#tailRowCache = undefined;
+			this.#dropStreamPrefix();
 			// B+: the captured fast-path rows index the replaced content — drop
 			// the recipe so a fresh stream cannot splice onto stale rows.
 			this.#fastTail = undefined;
@@ -1900,6 +1917,23 @@ export class Markdown implements Component {
 		this.#cachedLines = undefined;
 	}
 
+	/**
+	 * The unrendered source as an `md` node, `stream` while the streaming
+	 * (transient) cache is on. Append-only growth yields a fresh node of the
+	 * same kind and key whose text extends the previous one, which the
+	 * reconciler sends as `text append`.
+	 */
+	describe(_cx: DescribeContext): NativeNode {
+		const stream = this.#transientRenderCache;
+		const cached = this.#native;
+		if (cached?.text === this.#text && cached.stream === stream) return cached.node;
+		// Sources are model text; OSC 8 / SGR bytes a caller spliced in are the terminal's to style, not ours.
+		const source = this.#text.includes("\x1b") ? plainText(this.#text) : this.#text;
+		const described = md(source, stream ? { stream: true } : undefined);
+		this.#native = { text: this.#text, stream, node: described };
+		return described;
+	}
+
 	/**
 	 * Width-independent source prefix of the last render ending at a frozen
 	 * Markdown block boundary. Only meaningful while streaming (transient
@@ -1927,6 +1961,17 @@ export class Markdown implements Component {
 		// source — drop the fast-path recipe so stale rows cannot be served
 		// across the transition.
 		this.#fastTail = undefined;
+		if (!next) {
+			// Finalize: the prefix row cache, tail row cache and open-fence
+			// highlight stream are read only by transient renders, and each
+			// rebuilds from scratch if the block ever streams again — release
+			// them so settled blocks stop pinning rows and a native parser.
+			// The frozen lex prefix survives only until the next final-mode
+			// render consumes it (see #lexTokens / the L2 hit path).
+			this.#streamPrefixLineCache = undefined;
+			this.#tailRowCache = undefined;
+			this.#streamingHighlightCache = undefined;
+		}
 		this.invalidate();
 	}
 
@@ -1964,8 +2009,14 @@ export class Markdown implements Component {
 		// happens exactly when the CR/ref-def trigger behind a false verdict
 		// may have been deleted — never left stale, and never re-scanned on
 		// frames where the memo is sound.
+		const appendGrowth = this.#lastScanValid && this.#appendOnlySinceLastScan && text.length > this.#lastScanLength;
+		// Final mode keeps the frozen prefix only while the text keeps growing
+		// by appends (a stream rendered without the transient flag). A one-shot
+		// or just-finalized render still lexes against any existing prefix but
+		// then drops it, so settled blocks do not pin a token tree.
+		const retainPrefix = this.#transientRenderCache || appendGrowth;
 		let canStream: boolean;
-		if (this.#lastScanValid && this.#appendOnlySinceLastScan && text.length > this.#lastScanLength) {
+		if (appendGrowth) {
 			const delta = text.slice(this.#lastScanLength);
 			if (
 				!delta.includes("[") &&
@@ -1990,21 +2041,27 @@ export class Markdown implements Component {
 		if (canStream && hasPrefix) {
 			const tailTokens = lexDocument(refDefText);
 			const tokens = [...prefixTokens, ...tailTokens];
-			this.#freezeStablePrefix(text, tokens, { preserveExisting: true });
+			if (retainPrefix) this.#freezeStablePrefix(text, tokens, { preserveExisting: true });
+			else this.#dropStreamPrefix();
 			return tokens;
 		}
 		const tokens = lexDocument(text);
-		if (canStream) {
+		if (canStream && retainPrefix) {
 			this.#freezeStablePrefix(text, tokens, { preserveExisting: false });
 		} else {
-			this.#streamPrefixText = undefined;
-			this.#streamPrefixTokens = undefined;
-			this.#streamPrefixLineCache = undefined;
-			this.#tailRowCache = undefined;
+			this.#dropStreamPrefix();
 		}
 		return tokens;
 	}
 
+	/** Drop the frozen lex prefix and the transient row caches keyed on it. */
+	#dropStreamPrefix(): void {
+		this.#streamPrefixText = undefined;
+		this.#streamPrefixTokens = undefined;
+		this.#streamPrefixLineCache = undefined;
+		this.#tailRowCache = undefined;
+	}
+
 	// Freeze the largest run of leading blocks that end on a hard "\n\n" boundary
 	// (complete and immutable under append-only growth) so the next streaming
 	// render re-lexes only the unfrozen tail. Caller guarantees no CR / no
@@ -2032,12 +2089,7 @@ export class Markdown implements Component {
 			return;
 		}
 
-		if (!opts.preserveExisting) {
-			this.#streamPrefixText = undefined;
-			this.#streamPrefixTokens = undefined;
-			this.#streamPrefixLineCache = undefined;
-			this.#tailRowCache = undefined;
-		}
+		if (!opts.preserveExisting) this.#dropStreamPrefix();
 	}
 
 	render(width: number): readonly string[] {
@@ -2166,9 +2218,12 @@ export class Markdown implements Component {
 						);
 					}
 					// Splice onto the previous frame's rows (new array — parent may
-					// hold the old one).
+					// hold the old one). One copy of the head, then the few new and
+					// trailing rows, instead of spreading two intermediate slices.
 					const prev = recipe.lines;
-					const fastResult = [...prev.slice(0, recipe.rowStart), ...fastRows, ...prev.slice(recipe.rowEnd)];
+					const fastResult = prev.slice(0, recipe.rowStart);
+					appendLines(fastResult, fastRows);
+					for (let i = recipe.rowEnd; i < prev.length; i++) fastResult.push(prev[i]!);
 					this.#cachedText = this.#text;
 					this.#cachedWidth = width;
 					this.#cachedLines = fastResult;
@@ -2220,6 +2275,10 @@ export class Markdown implements Component {
 			cacheKey = this.#renderCacheKey(normalizedText, signature);
 			const cached = renderCache.get(cacheKey);
 			if (cached !== undefined) {
+				// A final-mode hit right after finalize (or a non-append edit)
+				// never reaches #lexTokens, which would otherwise consume and drop
+				// the frozen lex prefix — release it here instead.
+				if (!this.#appendOnlySinceLastScan) this.#dropStreamPrefix();
 				// Populate L1 so subsequent calls from this instance are O(1) map lookup.
 				this.#cachedText = this.#text;
 				this.#cachedWidth = width;
@@ -2241,8 +2300,10 @@ export class Markdown implements Component {
 		}
 		const emptyLines = this.#renderEmptyPaddingLines(signature);
 
-		// Combine top padding, content, and bottom padding
-		const rawResult = [...emptyLines, ...contentLines, ...emptyLines];
+		// Combine top padding, content, and bottom padding. contentLines is a
+		// fresh per-render array (never cache-owned), so without vertical
+		// padding it is handed out as-is rather than copied again.
+		const rawResult = emptyLines.length === 0 ? contentLines : [...emptyLines, ...contentLines, ...emptyLines];
 		const result = rawResult.length > 0 ? rawResult : [""];
 
 		// Update caches and hand the array out by reference. Callers must not
@@ -2329,11 +2390,15 @@ export class Markdown implements Component {
 			return this.#renderStreamingTail(tokens, 0, contentWidth, signature);
 		}
 
-		const contentLines: string[] = [];
+		// Prefix rows live in #streamPrefixLineCache.lines, which is private to
+		// the cache: an advancing prefix appends its newly frozen rows in place
+		// instead of re-snapshotting, and each frame's output is one fresh copy
+		// of prefix + tail, so no array handed to a caller is ever mutated.
 		const reusablePrefix = this.#matchingStreamPrefixLineCache(normalizedText, stableText, signature);
+		let prefixLines: string[] = [];
 		let renderedUntil = 0;
 		if (reusablePrefix && reusablePrefix.tokenCount <= stableTokenCount) {
-			contentLines.push(...reusablePrefix.lines);
+			prefixLines = reusablePrefix.lines;
 			renderedUntil = reusablePrefix.tokenCount;
 		}
 
@@ -2341,13 +2406,14 @@ export class Markdown implements Component {
 			// Stable tokens render with full fidelity (syntax highlighting on)
 			// so these cached rows byte-match the finalized render.
 			this.#renderingStablePrefix = true;
+			let frozenRows: string[];
 			try {
-				contentLines.push(
-					...this.#renderContentLines(tokens, renderedUntil, stableTokenCount, contentWidth, signature),
-				);
+				frozenRows = this.#renderContentLines(tokens, renderedUntil, stableTokenCount, contentWidth, signature);
 			} finally {
 				this.#renderingStablePrefix = false;
 			}
+			if (prefixLines.length === 0) prefixLines = frozenRows;
+			else appendLines(prefixLines, frozenRows);
 			renderedUntil = stableTokenCount;
 		}
 
@@ -2355,14 +2421,11 @@ export class Markdown implements Component {
 			...signature,
 			text: stableText,
 			tokenCount: stableTokenCount,
-			lines: contentLines.slice(),
+			lines: prefixLines,
 		};
 
-		if (renderedUntil < tokens.length) {
-			contentLines.push(...this.#renderStreamingTail(tokens, renderedUntil, contentWidth, signature));
-		}
-
-		return contentLines;
+		if (renderedUntil >= tokens.length) return prefixLines.slice();
+		return prefixLines.concat(this.#renderStreamingTail(tokens, renderedUntil, contentWidth, signature));
 	}
 
 	#matchingStreamPrefixLineCache(
@@ -2403,7 +2466,7 @@ export class Markdown implements Component {
 		if (cache !== undefined) {
 			spliceEnd = this.#tailSpliceEnd(cache, start, signature, tokens);
 			for (let i = start; i < spliceEnd; i++) {
-				out.push(...cache.rows[i - start]!);
+				appendLines(out, cache.rows[i - start]!);
 			}
 		}
 
@@ -2416,7 +2479,7 @@ export class Markdown implements Component {
 			nextTypes: new Array(tokens.length - spliceEnd).fill(undefined),
 		};
 		const fresh = this.#renderContentLines(tokens, spliceEnd, tokens.length, contentWidth, signature, recorder);
-		out.push(...fresh);
+		const result = out.length === 0 ? fresh : out.concat(fresh);
 
 		// Refresh the cache: keep entries for spliced tokens (their raws stay
 		// valid), overlay the fresh entries, and re-derive the contiguous
@@ -2453,7 +2516,7 @@ export class Markdown implements Component {
 			raws,
 			nextTypes,
 		};
-		return out;
+		return result;
 	}
 
 	// Longest cache-spliceable prefix: every cached row from `start` up to
@@ -2658,7 +2721,7 @@ export class Markdown implements Component {
 			// colors reach completed rows immediately; only the trailing partial
 			// line stays unhighlighted.
 			const lineEnd = tokenText.lastIndexOf("\n");
-			const completedLines = lineEnd >= 0 ? this.#highlightStreamingLines(tokenText.slice(0, lineEnd), lang) : null;
+			const completedLines = lineEnd >= 0 ? this.#highlightStreamingLines(tokenText, lineEnd, lang) : null;
 			if (completedLines) {
 				for (const hlLine of completedLines) {
 					addBodyLine(hlLine);
@@ -2708,21 +2771,28 @@ export class Markdown implements Component {
 	}
 
 	/**
-	 * Highlight the completed (newline-terminated) prefix of a streaming code
-	 * fence. Uses a stateful per-fence highlight stream so each render pushes
-	 * only the newly completed lines, with output byte-identical to the
-	 * whole-block `highlightCode` the finalized render performs. Returns null
-	 * when no stream is available for `lang` (caller falls back to plain
-	 * code-block styling).
+	 * Highlight the completed (newline-terminated) prefix `tokenText[0,
+	 * completedEnd)` of a streaming code fence. Uses a stateful per-fence
+	 * highlight stream so each render pushes only the newly completed lines,
+	 * with output byte-identical to the whole-block `highlightCode` the
+	 * finalized render performs. Returns null when no stream is available for
+	 * `lang` (caller falls back to plain code-block styling).
 	 */
-	#highlightStreamingLines(completedText: string, lang: string | undefined): readonly string[] | null {
+	#highlightStreamingLines(
+		tokenText: string,
+		completedEnd: number,
+		lang: string | undefined,
+	): readonly string[] | null {
 		const signature = this.#activeRenderSignature;
 		const cache = this.#streamingHighlightCache;
+		// Cheap cursor/length and signature gates first; the prefix compare
+		// (the only O(fence) check, needed because a different fence can reach
+		// this cache) runs last.
 		if (
 			signature &&
 			cache &&
-			completedText.startsWith(cache.text) &&
-			(cache.text.length === completedText.length || completedText.charCodeAt(cache.text.length) === 0x0a) &&
+			cache.text.length <= completedEnd &&
+			(cache.text.length === completedEnd || tokenText.charCodeAt(cache.text.length) === 0x0a) &&
 			cache.lang === lang &&
 			cache.width === signature.width &&
 			cache.paddingX === signature.paddingX &&
@@ -2734,18 +2804,23 @@ export class Markdown implements Component {
 			cache.hyperlinks === signature.hyperlinks &&
 			cache.textSizing === signature.textSizing &&
 			cache.bgColorProbe === signature.bgColorProbe &&
-			cache.headingProbe === signature.headingProbe
+			cache.headingProbe === signature.headingProbe &&
+			tokenText.startsWith(cache.text)
 		) {
-			if (completedText.length === cache.text.length) return cache.lines;
+			const cachedEnd = cache.text.length;
+			if (cachedEnd === completedEnd) return cache.lines;
 			// Invariant: the stream has consumed `cache.text + "\n"`, so pushing
 			// the added lines with a trailing newline advances it to
-			// `completedText + "\n"` — every fed line stays newline-terminated.
-			const addedText = completedText.slice(cache.text.length + 1);
-			const lines = cache.lines.concat(splitPushedHighlightLines(cache.stream.push(`${addedText}\n`)));
-			this.#streamingHighlightCache = { ...signature, lang, text: completedText, lines, stream: cache.stream };
-			return lines;
+			// `completed + "\n"` — every fed line stays newline-terminated. The
+			// signature gates above matched, so advancing the cache in place is
+			// equivalent to rebuilding it, minus the whole-array copy per frame.
+			const pushed = cache.stream.push(`${tokenText.slice(cachedEnd + 1, completedEnd)}\n`);
+			appendLines(cache.lines, splitPushedHighlightLines(pushed));
+			cache.text = tokenText.slice(0, completedEnd);
+			return cache.lines;
 		}
 
+		const completedText = tokenText.slice(0, completedEnd);
 		const stream = this.#createHighlightStream(lang);
 		if (!stream) return null;
 		const lines = splitPushedHighlightLines(stream.push(`${completedText}\n`));