fix(vscode): speed up bash tool card rendering

[marius-kilocode]

What Problem This Solves

Expanded bash tool cards in the VS Code chat webview did redundant work on every render. Each card constructed its output body (command and output, including Shiki highlight setup) three times instead of once.

Why This Change Was Made

packages/ui BasicTool reads its children getter in several places while laying out the tool: hasChildren(), the trigger details condition, and both alternates of the animated and non-animated content branches. The Kilo wrapper in packages/kilo-ui built its <div data-slot="basic-tool-details"> subtree inside an unmemoized accessor, so every bare read rebuilt the whole subtree. Component instrumentation on a bash card logged three BashHighlightedOutput instances created with no cleanup.

The fix memoizes the details subtree for eager tools, so repeated reads reuse one instance. createMemo runs eagerly, so deferred tools keep the plain lazy accessor: otherwise a collapsed deferred card (for example a board tool) would build its body before it opens. The shared packages/ui file is untouched.

User Impact

Expanded bash tool cards render faster in the VS Code chat webview. Visible behavior is unchanged: collapsed state, expansion, live streaming output, collapse and re-expand, Shiki highlighting, and deferred collapsed bodies.

Performance measurements

Reference benchmark harness on the bash card, 60 lines of shell output, BENCH_MODE=append BENCH_TOOLS=bash BENCH_REPEATS=7, viewport 420x720, Chromium, harness-suppressed animations.

Metric	Before	After	Change
Synchronous render, median of run medians	4.5 ms	3.4 ms	-24%
Interleaved A/B, sync median (20 rounds)	8.0 ms	6.7 ms	-16%
Interleaved A/B, sync p90	8.6 ms	7.0 ms	-19%
Settle, median	25.1 ms	25.2 ms	unchanged
Settle p95 (harness reports max)	60 ms	58 ms	unchanged (within noise)

Interleaved A/B runs toggled only the memo on and off with the same code and a fresh browser context per sample. The settle tail is the deferred Shiki path (shared highlighter load plus a queued task per block) and is not addressed by this change. A startup grammar preload was measured at only 6 to 13 percent on highlight latency and was not kept.

Validation

• packages/kilo-vscode: bun run typecheck and bun run lint pass.
• packages/kilo-vscode: board-tool-render.test.ts passes (deferred collapsed bodies stay unbuilt), plus the focused unit test.
• packages/kilo-ui: basic-tool.test.ts passes.
• VS Code self-test in an isolated instance: bash card rendered 60 of 60 lines with command and output highlighted; live streaming output grew 1 to 10 to 18 to 26 to 35 to 40 lines while expanded; collapse and re-expand retained the body; no webview console errors.

Changelog

Added .changeset/bash-tool-render-sync.md (patch): speed up rendering of expanded bash tool cards in the VS Code chat webview.

Limitations

• Only synchronous render improves. The harness reports settleP95Ms as the max of samples, not a true percentile, and before and after overlap there.
• The render and layout phase split came from temporary instrumentation that is not committed, so only sync and settle are reported here.
• The benchmark harness story was used for measurement only and is not part of this PR.

[kilo-code-bot]

Code Review Summary

Status: No Issues Found | Recommendation: Merge

Files Reviewed (1 file)

• packages/kilo-ui/src/components/basic-tool.tsx

Previous Review Summary (commit 546321e)

Current summary above is authoritative. Previous snapshots are kept for context only.

Previous review (commit 546321e)

Status: No Issues Found | Recommendation: Merge

Files Reviewed (2 files)

• .changeset/bash-tool-render-sync.md
• packages/kilo-ui/src/components/basic-tool.tsx

---

_{Reviewed by grok-4.6 · Input: 52.2K · Output: 8.6K · Cached: 369.3K}

_{Review guidance: REVIEW.md from base branch main}