@quandev104/pi-style 0.2.0 → 0.2.2

package/extension-src/pi-style/features/tools/boxed/batch.ts

@@ -8,10 +8,10 @@
 // consume no vertical space.
 //
 // Design notes:
-// - No caching in the batch panel: it reads the module-level registry on every
-//   render, so member completions (which trigger ui.requestRender via Pi's
-//   tool_execution_end handler) are picked up without cross-component
-//   invalidation plumbing.
+// - Live batches render directly from the registry so member completions (which
+//   trigger ui.requestRender via Pi's tool_execution_end handler) are picked up
+//   without cross-component invalidation plumbing. Once a batch is finalized,
+//   width/config-stable renders reuse the cached line array.
 // - Batch boundaries: a new batch starts when the active batch is closed. The
 //   active batch closes when a non-batchable tool call is dispatched
 //   (boxed/index.ts), when a new message starts (pi/index.ts), and on session
@@ -31,7 +31,7 @@
 
 import type { Component } from "@earendil-works/pi-tui";
 import { stripAnsi } from "../../../shared/ansi.js";
-import { type BoxTheme, dimLine, formatToolTitlePrefix } from "../../../shared/box.js";
+import { type BoxTheme, dimLine, formatToolTitlePrefix, themeCacheKey } from "../../../shared/box.js";
 import { safeTruncateToWidth } from "../../../shared/render-budget.js";
 import {
 	fileIcon,
@@ -42,7 +42,7 @@ import {
 	TREE_CHILD_INDENT,
 	TREE_INDENT,
 } from "./output-tree.js";
-import { getToolsRenderConfig } from "./session-config.js";
+import { getToolsRenderCacheSignature, getToolsRenderConfig } from "./session-config.js";
 import type { BoxedToolContext } from "./shared.js";
 
 /** Quiet tools whose calls group into a single batch panel. */
@@ -78,6 +78,11 @@ export interface BatchMember {
 	outputEntries?: string[];
 }
 
+type BatchRenderCache = {
+	key: string;
+	lines: string[];
+};
+
 export interface BatchState {
 	readonly meta: BatchToolMeta;
 	readonly leaderId: string;
@@ -85,6 +90,8 @@ export interface BatchState {
 	completedAt?: number;
 	closed: boolean;
 	readonly members: BatchMember[];
+	revision: number;
+	renderCache?: BatchRenderCache;
 }
 
 /** Tree head limit: only the first few members are listed, the rest collapse. */
@@ -130,6 +137,7 @@ function createBatch(
 		leaderId,
 		startedAt: performance.now(),
 		closed: false,
+		revision: 0,
 		members: [
 			{
 				toolCallId: leaderId,
@@ -146,6 +154,11 @@ function createBatch(
 	return batch;
 }
 
+function bumpBatchRevision(batch: BatchState): void {
+	batch.revision++;
+	delete batch.renderCache;
+}
+
 /**
  * Register a call renderer invocation. Idempotent per toolCallId: re-fires
  * (updateDisplay on the same component) reuse the call's existing batch, even
@@ -161,9 +174,12 @@ export function registerBatchCall(
 	if (existing) {
 		const member = existing.members.find((entry) => entry.toolCallId === context.toolCallId);
 		if (member) {
+			const changed =
+				member.detail !== detail || member.pattern !== opts.pattern || member.pathLabel !== opts.pathLabel;
 			member.detail = detail;
 			if (opts.pattern !== undefined) member.pattern = opts.pattern;
 			if (opts.pathLabel !== undefined) member.pathLabel = opts.pathLabel;
+			if (changed) bumpBatchRevision(existing);
 		}
 		return { batch: existing, isLeader: existing.leaderId === context.toolCallId };
 	}
@@ -182,6 +198,7 @@ export function registerBatchCall(
 	};
 	current.members.push(member);
 	batchByCallId.set(context.toolCallId, current);
+	bumpBatchRevision(current);
 	return { batch: current, isLeader: false };
 }
 
@@ -198,6 +215,12 @@ export interface BatchResultData {
  * and records batch completion once every member has settled. The member's
  * display detail stays as registered by the call renderer (the result context's
  * args may be normalized differently).
+ *
+ * `data.entries === undefined` means "keep the registered entries": callers
+ * that already registered final output (see hasFinalBatchOutput) omit the
+ * field on warm re-render passes, and that must never count as a change —
+ * comparing against the stored array would otherwise bump the revision on
+ * every pass.
  */
 export function registerBatchResult(
 	meta: BatchToolMeta,
@@ -208,18 +231,37 @@ export function registerBatchResult(
 	if (!batch || batch.meta.toolName !== meta.toolName) return { batch: undefined, isLeader: false };
 	const member = batch.members.find((entry) => entry.toolCallId === context.toolCallId);
 	if (member) {
-		member.status = data.isPartial ? "running" : "done";
-		member.isError = !data.isPartial && data.isError;
+		const nextStatus = data.isPartial ? "running" : "done";
+		const nextIsError = !data.isPartial && data.isError;
+		const changed =
+			member.status !== nextStatus ||
+			member.isError !== nextIsError ||
+			member.errorText !== (nextIsError ? data.errorText : undefined) ||
+			(data.entries !== undefined && member.outputEntries !== data.entries);
+		member.status = nextStatus;
+		member.isError = nextIsError;
 		if (member.isError && data.errorText !== undefined) member.errorText = data.errorText;
 		else delete member.errorText;
 		if (data.entries !== undefined) member.outputEntries = data.entries;
+		if (changed) bumpBatchRevision(batch);
 	}
 	if (batch.completedAt === undefined && batch.members.every((entry) => entry.status === "done")) {
 		batch.completedAt = performance.now();
+		bumpBatchRevision(batch);
 	}
 	return { batch, isLeader: batch.leaderId === context.toolCallId };
 }
 
+/** True when the member for `toolCallId` has settled with final parsed output
+ *  (done, non-error, entries registered). Result renderers use this to skip
+ *  re-parsing an unchanged final output on warm re-render passes. */
+export function hasFinalBatchOutput(toolCallId: string): boolean {
+	const batch = batchByCallId.get(toolCallId);
+	if (!batch) return false;
+	const member = batch.members.find((entry) => entry.toolCallId === toolCallId);
+	return member !== undefined && member.outputEntries !== undefined && member.status === "done" && !member.isError;
+}
+
 interface BatchStatus {
 	readonly total: number;
 	readonly done: number;
@@ -459,9 +501,17 @@ function renderBatchPanelLines(theme: BoxTheme, batch: BatchState, status: Batch
  */
 export function renderBatchAwareCall(theme: BoxTheme, batch: BatchState): Component {
 	return {
-		invalidate() {},
+		invalidate() {
+			delete batch.renderCache;
+		},
 		render(width: number): string[] {
-			return renderBatchPanelLines(theme, batch, batchStatus(batch), width);
+			const status = batchStatus(batch);
+			if (!status.allDone) return renderBatchPanelLines(theme, batch, status, width);
+			const cacheKey = [themeCacheKey(theme), getToolsRenderCacheSignature(), width, batch.revision].join("|");
+			if (batch.renderCache?.key === cacheKey) return batch.renderCache.lines;
+			const lines = renderBatchPanelLines(theme, batch, status, width);
+			batch.renderCache = { key: cacheKey, lines };
+			return lines;
 		},
 	};
 }

package/extension-src/pi-style/features/tools/boxed/edit.ts

@@ -24,6 +24,8 @@ import {
 	type BoxedToolContext,
 	type BoxedToolDefinition,
 	displayPath,
+	getRenderCacheKey,
+	memoizedStateComponent,
 	noteBoxedCallState,
 	noteBoxedResultPhase,
 	noteExecutionStart,
@@ -115,38 +117,56 @@ export const editTool: BoxedToolDefinition = {
 			});
 		}
 
-		// Resolve language for syntax highlighting
+		// Resolve the edited path (cache-key input + language hint source).
 		const message = firstText(result.content as Array<{ type: string; text?: string }>);
 		const argPath = String(context?.args?.path ?? context?.args?.file_path ?? "");
 		const sourcePath = details?.path ?? (argPath || extractEditedPath(message));
-		const language = sourcePath ? getLanguageFromPath(sourcePath) : undefined;
-
-		// Build diff rows + adaptive layout
-		const rows = buildSplitRows(diff);
 		const expanded = options.expanded;
-		const shouldHighlight =
-			Boolean(language) && diff.length <= MAX_HIGHLIGHT_DIFF_CHARS && rows.length <= MAX_HIGHLIGHT_DIFF_ROWS;
+		// Stats feed the footer, which is part of the cache key (cheap line scan —
+		// unlike the row/component construction below, which must not run on hits).
 		const stats = countDiffStats(diff);
 
-		// Render adaptive diff (unified/split per width) with syntax colors for small outputs.
-		const maxRows = expanded ? 160 : 36;
-		const diffView = new AdaptiveDiffComponent(theme, rows, maxRows, shouldHighlight ? language : undefined);
-		const expandHint = !expanded && diffView.hasCollapsed() ? "Ctrl+O more" : undefined;
+		return memoizedStateComponent(
+			context.state,
+			"__piStyleEditDiffResult",
+			getRenderCacheKey(
+				"edit-diff-result",
+				theme,
+				Boolean(expanded),
+				diff,
+				sourcePath ?? "",
+				editDiffFooter(theme, result, context, stats),
+			),
+			() => {
+				// Expensive construction (buildSplitRows + AdaptiveDiffComponent,
+				// ~0.4ms for a 160-row diff) runs only on cache misses, never per
+				// render pass. Everything below is a pure function of the key inputs.
+				const language = sourcePath ? getLanguageFromPath(sourcePath) : undefined;
+				const rows = buildSplitRows(diff);
+				const shouldHighlight =
+					Boolean(language) && diff.length <= MAX_HIGHLIGHT_DIFF_CHARS && rows.length <= MAX_HIGHLIGHT_DIFF_ROWS;
 
-		return renderBoxedToolResult(
-			theme,
-			{
-				render(width: number): string[] {
-					return diffView.render(width);
-				},
-				invalidate(): void {
-					diffView.invalidate();
-				},
-			},
-			{
-				dividerLabel: diffDividerLabel(theme, stats),
-				...(expandHint ? { dividerRightLabel: expandHint } : {}),
-				footerLines: [editDiffFooter(theme, result, context, stats)],
+				// Render adaptive diff (unified/split per width) with syntax colors for small outputs.
+				const maxRows = expanded ? 160 : 36;
+				const diffView = new AdaptiveDiffComponent(theme, rows, maxRows, shouldHighlight ? language : undefined);
+				const expandHint = !expanded && diffView.hasCollapsed() ? "Ctrl+O more" : undefined;
+
+				return renderBoxedToolResult(
+					theme,
+					{
+						render(width: number): string[] {
+							return diffView.render(width);
+						},
+						invalidate(): void {
+							diffView.invalidate();
+						},
+					},
+					{
+						dividerLabel: diffDividerLabel(theme, stats),
+						...(expandHint ? { dividerRightLabel: expandHint } : {}),
+						footerLines: [editDiffFooter(theme, result, context, stats)],
+					},
+				);
 			},
 		);
 	},

package/extension-src/pi-style/features/tools/boxed/find.ts

@@ -11,6 +11,7 @@ import {
 	type BatchToolMeta,
 	EMPTY_BATCH_COMPONENT,
 	emptyBatchResult,
+	hasFinalBatchOutput,
 	registerBatchCall,
 	registerBatchResult,
 	renderBatchAwareCall,
@@ -48,14 +49,18 @@ export const findTool: BoxedToolDefinition = {
 		return renderBatchAwareCall(theme, batch);
 	},
 	result(result, options, _theme, context) {
-		const output = stripAnsi(getTextOutput(result)).trimEnd();
-		const entries = context.isError ? undefined : parseFindOutput(output);
+		const isError = Boolean(context.isError);
+		// Result renderers re-fire on every repaint/scroll; once the final output
+		// is parsed and registered, skip stripping/parsing the same text again.
+		const settled = !options.isPartial && !isError && hasFinalBatchOutput(context.toolCallId);
+		const output = settled ? "" : stripAnsi(getTextOutput(result)).trimEnd();
+		const entries = settled || isError ? undefined : parseFindOutput(output);
 		registerBatchResult(
 			FIND_META,
 			{
 				isPartial: Boolean(options.isPartial),
-				isError: Boolean(context.isError),
-				errorText: context.isError ? output || undefined : undefined,
+				isError,
+				errorText: isError ? output || undefined : undefined,
 				...(entries !== undefined ? { entries } : {}),
 			},
 			context,

package/extension-src/pi-style/features/tools/boxed/git.ts

@@ -26,7 +26,7 @@ import { AdaptiveDiffComponent, buildSplitRows, countDiffStats } from "../../../
 import { parseSimpleBashCommand } from "./command-shape.js";
 import { pluralForm, TREE_INDENT } from "./output-tree.js";
 import { getStateElapsedMs, getToolsRenderConfig } from "./session-config.js";
-import type { BoxedToolContext } from "./shared.js";
+import { type BoxedToolContext, getRenderCacheKey, memoizedStateComponent } from "./shared.js";
 
 // ── Classification ──────────────────────────────────────────────────────────
 
@@ -1871,7 +1871,10 @@ interface DiffFileBox {
 
 /** Build a complete boxed-diff result component for a parsed `git diff`/`show`.
  *  The call panel renders the boxless Git header; this component renders one
- *  `╭…╰` frame per file (or a single `No changes` frame for an empty diff). */
+ *  `╭…╰` frame per file (or a single `No changes` frame for an empty diff).
+ *  Construction is memoized on the call state: repeated result passes reuse
+ *  the cached component (identity-stable, invalidate propagates inward) so
+ *  the per-file `AdaptiveDiffComponent` build never re-runs per render pass. */
 export function renderGitDiffResult(
 	theme: BoxTheme,
 	parsed: GitDiffParsed,
@@ -1879,6 +1882,47 @@ export function renderGitDiffResult(
 	context: BoxedToolContext,
 ): Component {
 	const expanded = Boolean(options.expanded);
+
+	// Cheap cache key capturing everything that affects output — theme, show vs
+	// diff, expansion, file count/totals, and per-file identity (path, body
+	// length, counts, binary/status) — computed WITHOUT building rows or
+	// components; the expensive build runs only on cache misses.
+	let totalAdditions = 0;
+	let totalRemovals = 0;
+	const sigParts: string[] = [];
+	for (const file of parsed.files) {
+		totalAdditions += file.additions;
+		totalRemovals += file.removals;
+		sigParts.push(
+			`${file.path}:${file.body.length}:${file.additions}:${file.removals}:${file.binary ? 1 : 0}:${file.status ?? ""}`,
+		);
+	}
+	const sig = sigParts.join(";").slice(0, 2048);
+
+	return memoizedStateComponent(
+		context.state,
+		"__piStyleGitDiffResult",
+		getRenderCacheKey(
+			"git-diff-result",
+			theme,
+			String(parsed.show),
+			String(expanded),
+			parsed.files.length,
+			totalAdditions,
+			totalRemovals,
+			sig,
+		),
+		() => buildGitDiffResultComponent(theme, parsed, expanded, context),
+	);
+}
+
+/** Uncached boxed git-diff construction: one `╭…╰` frame per file. */
+function buildGitDiffResultComponent(
+	theme: BoxTheme,
+	parsed: GitDiffParsed,
+	expanded: boolean,
+	context: BoxedToolContext,
+): Component {
 	const elapsedMs = getStateElapsedMs(context.state);
 	const fileCount = parsed.files.length;
 

package/extension-src/pi-style/features/tools/boxed/grep.ts

@@ -166,14 +166,21 @@ export const grepTool: BoxedToolDefinition = {
 		return renderGrepPanel(theme, context.toolCallId);
 	},
 	result(result, options, _theme, context) {
-		const output = stripAnsi(getTextOutput(result)).trimEnd();
 		const isError = Boolean(context.isError);
+		const isPartial = Boolean(options.isPartial);
+		// Result renderers re-fire on every repaint/scroll; once final matches
+		// are registered the registry is already final — skip stripping/parsing.
+		const state = grepPanels.get(context.toolCallId);
+		if (!isPartial && !isError && state !== undefined && state.matches !== undefined && !state.isPartial) {
+			return EMPTY_GREP_RESULT;
+		}
+		const output = stripAnsi(getTextOutput(result)).trimEnd();
 		const matches = isError ? [] : parseGrepOutput(output);
 		registerGrepResult(context.toolCallId, {
 			matches,
 			isError,
 			errorText: isError ? output || undefined : undefined,
-			isPartial: Boolean(options.isPartial),
+			isPartial,
 		});
 		return EMPTY_GREP_RESULT;
 	},

package/extension-src/pi-style/features/tools/boxed/ls.ts

@@ -11,6 +11,7 @@ import {
 	type BatchToolMeta,
 	EMPTY_BATCH_COMPONENT,
 	emptyBatchResult,
+	hasFinalBatchOutput,
 	registerBatchCall,
 	registerBatchResult,
 	renderBatchAwareCall,
@@ -40,14 +41,18 @@ export const lsTool: BoxedToolDefinition = {
 		return renderBatchAwareCall(theme, batch);
 	},
 	result(result, options, _theme, context) {
-		const output = stripAnsi(getTextOutput(result)).trimEnd();
-		const entries = context.isError ? undefined : parseLsOutput(output);
+		const isError = Boolean(context.isError);
+		// Result renderers re-fire on every repaint/scroll; once the final output
+		// is parsed and registered, skip stripping/parsing the same text again.
+		const settled = !options.isPartial && !isError && hasFinalBatchOutput(context.toolCallId);
+		const output = settled ? "" : stripAnsi(getTextOutput(result)).trimEnd();
+		const entries = settled || isError ? undefined : parseLsOutput(output);
 		registerBatchResult(
 			LIST_META,
 			{
 				isPartial: Boolean(options.isPartial),
-				isError: Boolean(context.isError),
-				errorText: context.isError ? output || undefined : undefined,
+				isError,
+				errorText: isError ? output || undefined : undefined,
 				...(entries !== undefined ? { entries } : {}),
 			},
 			context,

package/extension-src/pi-style/features/tools/boxed/quick-edit.ts

@@ -16,6 +16,8 @@ import {
 	type BoxedToolContext,
 	type BoxedToolDefinition,
 	displayPath,
+	getRenderCacheKey,
+	memoizedStateComponent,
 	noteBoxedCallState,
 	noteBoxedResultPhase,
 	noteExecutionStart,
@@ -172,32 +174,53 @@ function renderQuickEditResult(
 		});
 	}
 
-	const rows = buildSplitRows(diff);
 	const expanded = options.expanded;
 	const argPath = String(context?.args?.path ?? "");
-	const language = argPath ? getLanguageFromPath(argPath) : undefined;
-	const shouldHighlight =
-		Boolean(language) && diff.length <= MAX_HIGHLIGHT_DIFF_CHARS && rows.length <= MAX_HIGHLIGHT_DIFF_ROWS;
+	// Stats feed the footer, which is part of the cache key (cheap line scan —
+	// unlike the row/component construction below, which must not run on hits).
 	const stats = countDiffStats(diff);
 
-	const maxRows = expanded ? 160 : 36;
-	const diffView = new AdaptiveDiffComponent(theme, rows, maxRows, shouldHighlight ? language : undefined);
-	const expandHint = !expanded && diffView.hasCollapsed() ? "Ctrl+O more" : undefined;
-
-	return renderBoxedToolResult(
-		theme,
-		{
-			render(width: number): string[] {
-				return diffView.render(width);
-			},
-			invalidate(): void {
-				diffView.invalidate();
-			},
-		},
-		{
-			dividerLabel: quickEditDividerLabel(theme, stats),
-			...(expandHint ? { dividerRightLabel: expandHint } : {}),
-			footerLines: [quickEditDiffFooter(theme, result, context, stats)],
+	return memoizedStateComponent(
+		context.state,
+		"__piStyleQuickEditDiffResult",
+		getRenderCacheKey(
+			"quick-edit-diff-result",
+			theme,
+			config.toolLabel,
+			Boolean(expanded),
+			diff,
+			argPath,
+			quickEditDiffFooter(theme, result, context, stats),
+		),
+		() => {
+			// Expensive construction (buildSplitRows + AdaptiveDiffComponent) runs
+			// only on cache misses, never per render pass. Everything below is a
+			// pure function of the key inputs.
+			const rows = buildSplitRows(diff);
+			const language = argPath ? getLanguageFromPath(argPath) : undefined;
+			const shouldHighlight =
+				Boolean(language) && diff.length <= MAX_HIGHLIGHT_DIFF_CHARS && rows.length <= MAX_HIGHLIGHT_DIFF_ROWS;
+
+			const maxRows = expanded ? 160 : 36;
+			const diffView = new AdaptiveDiffComponent(theme, rows, maxRows, shouldHighlight ? language : undefined);
+			const expandHint = !expanded && diffView.hasCollapsed() ? "Ctrl+O more" : undefined;
+
+			return renderBoxedToolResult(
+				theme,
+				{
+					render(width: number): string[] {
+						return diffView.render(width);
+					},
+					invalidate(): void {
+						diffView.invalidate();
+					},
+				},
+				{
+					dividerLabel: quickEditDividerLabel(theme, stats),
+					...(expandHint ? { dividerRightLabel: expandHint } : {}),
+					footerLines: [quickEditDiffFooter(theme, result, context, stats)],
+				},
+			);
 		},
 	);
 }

package/extension-src/pi-style/features/tools/boxed/read.ts

@@ -32,13 +32,15 @@ export const readTool: BoxedToolDefinition = {
 		return renderBatchAwareCall(theme, batch);
 	},
 	result(result, options, _theme, context) {
-		const output = stripAnsi(getTextOutput(result)).trimEnd();
+		// The strip is only needed for error text — keep it off the success path
+		// (result renderers re-fire on every repaint/scroll).
+		const errorText = context.isError ? stripAnsi(getTextOutput(result)).trimEnd() || undefined : undefined;
 		registerBatchResult(
 			READ_META,
 			{
 				isPartial: Boolean(options.isPartial),
 				isError: Boolean(context.isError),
-				errorText: context.isError ? output || undefined : undefined,
+				errorText,
 			},
 			context,
 		);

package/extension-src/pi-style/features/tools/boxed/session-config.ts

@@ -37,6 +37,19 @@ export function getToolsRenderConfig(): ToolsRenderConfig {
 	return sessionToolsConfig;
 }
 
+export function getToolsRenderCacheSignature(): string {
+	return [
+		sessionToolsConfig.maxCollapsedLines,
+		sessionToolsConfig.maxExpandedLines,
+		sessionToolsConfig.dimOutput ? 1 : 0,
+		sessionToolsConfig.showElapsed ? 1 : 0,
+		sessionToolsConfig.batchOpenGlyph,
+		sessionToolsConfig.nerdFonts ? 1 : 0,
+		sessionToolsConfig.collapseAfterTurn ? 1 : 0,
+		sessionToolsConfig.collapseMutatingTools ? 1 : 0,
+	].join("|");
+}
+
 // Wall-clock elapsed tracking through the renderer context state (no tool
 // re-registration, so result.details has no execution timing).
 //
@@ -83,8 +96,26 @@ export function markResultSeen(state: Record<string, unknown> | undefined): void
 
 type TickerHandle = ReturnType<typeof setInterval>;
 
-/** States that currently own a 1s elapsed-render interval, for session cleanup. */
-const tickerStates = new Set<Record<string, unknown>>();
+type ElapsedTickerEntry = {
+	invalidate: () => void;
+};
+
+/** States currently subscribed to the shared elapsed-render ticker. */
+const tickerEntries = new Map<Record<string, unknown>, ElapsedTickerEntry>();
+let sharedTickerHandle: TickerHandle | undefined;
+
+function ensureSharedTicker(): void {
+	if (sharedTickerHandle !== undefined || tickerEntries.size === 0) return;
+	sharedTickerHandle = setInterval(() => {
+		for (const { invalidate } of tickerEntries.values()) invalidate();
+	}, 1000) as unknown as TickerHandle;
+}
+
+function stopSharedTickerIfIdle(): void {
+	if (sharedTickerHandle === undefined || tickerEntries.size > 0) return;
+	clearInterval(sharedTickerHandle);
+	sharedTickerHandle = undefined;
+}
 
 /**
  * While a tool is running, re-render once per second so live elapsed labels
@@ -92,26 +123,26 @@ const tickerStates = new Set<Record<string, unknown>>();
  */
 export function startElapsedTicker(state: Record<string, unknown> | undefined, invalidate: () => void): void {
 	if (!state || typeof state !== "object") return;
-	if (state[TICKER_KEY] !== undefined) return;
-	state[TICKER_KEY] = setInterval(() => invalidate(), 1000) as unknown as TickerHandle;
-	tickerStates.add(state);
+	state[TICKER_KEY] = true;
+	tickerEntries.set(state, { invalidate });
+	ensureSharedTicker();
 }
 
 /** Stop a running tool's elapsed ticker (terminal result, error, session end). */
 export function stopElapsedTicker(state: Record<string, unknown> | undefined): void {
 	if (!state || typeof state !== "object") return;
-	const handle = state[TICKER_KEY] as TickerHandle | undefined;
-	if (handle !== undefined) clearInterval(handle);
 	delete state[TICKER_KEY];
-	tickerStates.delete(state);
+	tickerEntries.delete(state);
+	stopSharedTickerIfIdle();
 }
 
 /** Stop every elapsed ticker (session start/shutdown). */
 export function stopAllElapsedTickers(): void {
-	for (const state of tickerStates) {
-		const handle = state[TICKER_KEY] as TickerHandle | undefined;
-		if (handle !== undefined) clearInterval(handle);
-		delete state[TICKER_KEY];
-	}
-	tickerStates.clear();
+	for (const state of tickerEntries.keys()) delete state[TICKER_KEY];
+	tickerEntries.clear();
+	stopSharedTickerIfIdle();
+}
+
+export function __getElapsedTickerDebugState(): { trackedStates: number; hasSharedTicker: boolean } {
+	return { trackedStates: tickerEntries.size, hasSharedTicker: sharedTickerHandle !== undefined };
 }

package/extension-src/pi-style/features/tools/boxed/shared.ts

@@ -12,9 +12,11 @@ import {
 	renderCompactBoxedToolCall,
 	resolveRelativePath,
 	shortenPath,
+	themeCacheKey,
 } from "../../../shared/box.js";
 import {
 	getStateElapsedMs,
+	getToolsRenderCacheSignature,
 	isResultSeen,
 	markResultSeen,
 	recordExecutionEnded,
@@ -174,6 +176,55 @@ export function resultFooterLines(
 	return [formatBoxedFooter(theme, result, extraParts, stateElapsedMs(context))];
 }
 
+type StateComponentCacheEntry = {
+	key: string;
+	component: Component;
+};
+
+/** Cache-key string parts at or below this length join verbatim; longer ones
+ *  collapse to `length:hash` so the joined key length stays bounded regardless
+ *  of raw output size. */
+const CACHE_KEY_LONG_PART_THRESHOLD = 64;
+
+/** 32-bit FNV-1a hash of a string as 8 lowercase hex digits. Local mirror of the
+ *  compatibility probe's fingerprint hashing (the pi/ layer stays unreachable
+ *  from features): deterministic, collision-safe for cache identity. */
+function fnv1aHex(text: string): string {
+	let hash = 2166136261;
+	for (let i = 0; i < text.length; i++) {
+		hash ^= text.charCodeAt(i);
+		hash = Math.imul(hash, 16777619) >>> 0;
+	}
+	return hash.toString(16).padStart(8, "0");
+}
+
+/** Fold one join part: strings longer than CACHE_KEY_LONG_PART_THRESHOLD
+ *  collapse to `length:hash`; numbers/booleans pass through unchanged. */
+function boundedCacheKeyPart(part: string | number | boolean): string | number | boolean {
+	if (typeof part !== "string" || part.length <= CACHE_KEY_LONG_PART_THRESHOLD) return part;
+	return `${part.length}:${fnv1aHex(part)}`;
+}
+
+export function getRenderCacheKey(prefix: string, theme: BoxTheme, ...parts: Array<string | number | boolean>): string {
+	const pieces: Array<string | number | boolean> = [prefix, themeCacheKey(theme), getToolsRenderCacheSignature()];
+	for (const part of parts) pieces.push(boundedCacheKeyPart(part));
+	return pieces.join("|");
+}
+
+export function memoizedStateComponent(
+	state: Record<string, unknown> | undefined,
+	slot: string,
+	key: string,
+	build: () => Component,
+): Component {
+	if (!state || typeof state !== "object") return build();
+	const cached = state[slot] as StateComponentCacheEntry | undefined;
+	if (cached && cached.key === key) return cached.component;
+	const component = build();
+	state[slot] = { key, component } satisfies StateComponentCacheEntry;
+	return component;
+}
+
 export function clearFooterState(context: BoxedToolContext): void {
 	clearCompactBoxedFooter(context.state);
 }