@gajae-code/tui 0.4.4 → 0.5.0

package/CHANGELOG.md

@@ -2,6 +2,25 @@
 
 ## [Unreleased]
 
+## [0.5.0] - 2026-06-13
+
+### Added
+
+- Added process-isolated deterministic render-golden capture fixtures and coverage for editor overlays, rich-text resize, multiplexer viewport repaint, sixel preservation, Termux height diffs, and transcript shrink/clear regressions.
+- Added layout/rendering benchmarks for editor layout, markdown rendering, and frame rendering.
+
+### Changed
+
+- Tightened markdown/editor rendering and terminal repaint behavior for the compact tool-block spacing and render-golden stability work.
+
+## [0.4.5] - 2026-06-12
+
+- Version aligned with the 0.4.5 monorepo release; no functional changes in this package.
+
+## [0.4.4] - 2026-06-10
+
+- Version aligned with the 0.4.4 monorepo release; no functional changes in this package.
+
 ## [0.4.3] - 2026-06-10
 
 ### Fixed

package/dist/types/components/editor.d.ts

@@ -78,6 +78,8 @@ export declare class Editor implements Component, Focusable {
     invalidate(): void;
     render(width: number): string[];
     handleInput(data: string): void;
+    /** Test-only seam: current wrap-cache entry count (memory-bound assertions). */
+    get wrappedLineCacheSize(): number;
     getText(): string;
     /**
      * Get text with paste markers expanded to their actual content.

package/dist/types/tui.d.ts

@@ -159,4 +159,10 @@ export declare class TUI extends Container {
     removeInputListener(listener: InputListener): void;
     stop(): void;
     requestRender(force?: boolean, source?: string): void;
+    getLineRenderCacheStats(): {
+        normalizationSize: number;
+        truncationSize: number;
+        normalizationLimit: number;
+        truncationLimit: number;
+    };
 }

package/dist/types/utils.d.ts

@@ -1,6 +1,7 @@
 import { Ellipsis, type ExtractSegmentsResult, type SliceResult } from "@gajae-code/natives";
 export { Ellipsis } from "@gajae-code/natives";
 export { getDefaultTabWidth, getIndentation } from "@gajae-code/utils";
+export declare function isPrintableAscii(text: string): boolean;
 export declare function sliceWithWidth(line: string, startCol: number, length: number, strict?: boolean | null): SliceResult;
 export declare function truncateToWidth(text: string, maxWidth: number, ellipsisKind?: Ellipsis | null, pad?: boolean | null): string;
 export declare function wrapTextWithAnsi(text: string, width: number): string[];

package/package.json

@@ -1,7 +1,7 @@
 {
 	"type": "module",
 	"name": "@gajae-code/tui",
-	"version": "0.4.4",
+	"version": "0.5.0",
 	"description": "Terminal User Interface library with differential rendering for efficient text-based applications",
 	"homepage": "https://gaebal-gajae.dev",
 	"author": "Yeachan-Heo",
@@ -38,8 +38,8 @@
 		"fmt": "biome format --write ."
 	},
 	"dependencies": {
-		"@gajae-code/natives": "0.4.4",
-		"@gajae-code/utils": "0.4.4",
+		"@gajae-code/natives": "0.5.0",
+		"@gajae-code/utils": "0.5.0",
 		"lru-cache": "11.3.6",
 		"marked": "^18.0.3"
 	},

package/src/components/editor.ts

@@ -9,6 +9,7 @@ import { type Component, CURSOR_MARKER, type Focusable } from "../tui";
 import {
 	getSegmenter,
 	getWordNavKind,
+	isPrintableAscii,
 	moveWordLeft,
 	moveWordRight,
 	padding,
@@ -53,6 +54,53 @@ interface TextChunk {
 	endIndex: number;
 }
 
+interface WrappedLine {
+	chunks: TextChunk[];
+	width: number;
+}
+
+interface CachedWrappedLine extends WrappedLine {
+	lineRef: string;
+	contentWidth: number;
+}
+
+function wordWrapAsciiLine(line: string, maxWidth: number): TextChunk[] {
+	if (line.length <= maxWidth) {
+		return [{ text: line, startIndex: 0, endIndex: line.length }];
+	}
+
+	const chunks: TextChunk[] = [];
+	let chunkStart = 0;
+	while (chunkStart < line.length) {
+		let chunkEnd = Math.min(line.length, chunkStart + maxWidth);
+		if (chunkEnd < line.length) {
+			let breakAt = -1;
+			for (let i = chunkEnd; i > chunkStart; i--) {
+				const code = line.charCodeAt(i - 1);
+				if (code === 0x20 || code === 0x09) {
+					breakAt = i - 1;
+					break;
+				}
+			}
+			if (breakAt > chunkStart) chunkEnd = breakAt;
+		}
+
+		const raw = line.slice(chunkStart, chunkEnd);
+		const text = raw.trimEnd();
+		if (text || chunks.length === 0) {
+			chunks.push({ text, startIndex: chunkStart, endIndex: chunkStart + raw.length });
+		}
+		chunkStart = chunkEnd;
+		while (chunkStart < line.length) {
+			const code = line.charCodeAt(chunkStart);
+			if (code !== 0x20 && code !== 0x09) break;
+			chunkStart++;
+		}
+	}
+
+	return chunks.length > 0 ? chunks : [{ text: "", startIndex: 0, endIndex: 0 }];
+}
+
 /**
  * Split a line into word-wrapped chunks.
  * Wraps at word boundaries when possible, falling back to character-level
@@ -66,6 +114,9 @@ function wordWrapLine(line: string, maxWidth: number): TextChunk[] {
 	if (!line || maxWidth <= 0) {
 		return [{ text: "", startIndex: 0, endIndex: 0 }];
 	}
+	if (isPrintableAscii(line)) {
+		return wordWrapAsciiLine(line, maxWidth);
+	}
 
 	const lineWidth = visibleWidth(line);
 	if (lineWidth <= maxWidth) {
@@ -349,6 +400,7 @@ export class Editor implements Component, Focusable {
 	#paddingXOverride: number | undefined;
 	#maxHeight?: number;
 	#scrollOffset: number = 0;
+	#wrappedLineCache: CachedWrappedLine[] = [];
 
 	// Emacs-style kill ring
 	#killRing = new KillRing();
@@ -566,10 +618,11 @@ export class Editor implements Component, Focusable {
 		if (this.onChange) {
 			this.onChange(this.getText());
 		}
+		this.#wrappedLineCache.length = 0;
 	}
 
 	invalidate(): void {
-		// No cached state to invalidate currently
+		this.#wrappedLineCache.length = 0;
 	}
 
 	#getEditorPaddingX(): number {
@@ -692,14 +745,18 @@ export class Editor implements Component, Focusable {
 		return Math.max(1, visibleHeight - 1);
 	}
 
-	#updateScrollOffset(layoutWidth: number, layoutLines: LayoutLine[], visibleHeight: number): void {
+	#findCurrentLayoutLine(layoutLines: LayoutLine[]): number {
+		const index = layoutLines.findIndex(line => line.hasCursor);
+		return index === -1 ? Math.max(0, layoutLines.length - 1) : index;
+	}
+
+	#updateScrollOffset(layoutLines: LayoutLine[], visibleHeight: number): void {
 		if (layoutLines.length <= visibleHeight) {
 			this.#scrollOffset = 0;
 			return;
 		}
 
-		const visualLines = this.#buildVisualLineMap(layoutWidth);
-		const cursorLine = this.#findCurrentVisualLine(visualLines);
+		const cursorLine = this.#findCurrentLayoutLine(layoutLines);
 		if (cursorLine < this.#scrollOffset) {
 			this.#scrollOffset = cursorLine;
 		} else if (cursorLine >= this.#scrollOffset + visibleHeight) {
@@ -730,7 +787,7 @@ export class Editor implements Component, Focusable {
 		// Layout the text
 		const layoutLines = this.#layoutText(layoutWidth);
 		const visibleContentHeight = this.#getVisibleContentHeight(layoutLines.length);
-		this.#updateScrollOffset(layoutWidth, layoutLines, visibleContentHeight);
+		this.#updateScrollOffset(layoutLines, visibleContentHeight);
 		const visibleLayoutLines = layoutLines.slice(this.#scrollOffset, this.#scrollOffset + visibleContentHeight);
 
 		const result: string[] = [];
@@ -1321,11 +1378,34 @@ export class Editor implements Component, Focusable {
 		}
 	}
 
+	#getWrappedLine(lineIndex: number, contentWidth: number): WrappedLine {
+		const line = this.#state.lines[lineIndex] || "";
+		const cached = this.#wrappedLineCache[lineIndex];
+		if (cached?.lineRef === line && cached.contentWidth === contentWidth) return cached;
+
+		const width = isPrintableAscii(line) ? line.length : visibleWidth(line);
+		const chunks =
+			width <= contentWidth
+				? [{ text: line, startIndex: 0, endIndex: line.length }]
+				: wordWrapLine(line, contentWidth);
+		const wrapped = { lineRef: line, contentWidth, width, chunks };
+		this.#wrappedLineCache[lineIndex] = wrapped;
+		return wrapped;
+	}
+
+	/** Test-only seam: current wrap-cache entry count (memory-bound assertions). */
+	get wrappedLineCacheSize(): number {
+		return this.#wrappedLineCache.length;
+	}
+
 	#layoutText(contentWidth: number): LayoutLine[] {
 		const layoutLines: LayoutLine[] = [];
 
 		if (this.#state.lines.length === 0 || (this.#state.lines.length === 1 && this.#state.lines[0] === "")) {
-			// Empty editor
+			// Empty editor — keep the wrap cache bounded by document size like
+			// the non-empty path below (stale entries from a previously large
+			// buffer must not be retained).
+			this.#wrappedLineCache.length = this.#state.lines.length;
 			layoutLines.push({
 				text: "",
 				hasCursor: true,
@@ -1338,9 +1418,9 @@ export class Editor implements Component, Focusable {
 		for (let i = 0; i < this.#state.lines.length; i++) {
 			const line = this.#state.lines[i] || "";
 			const isCurrentLine = i === this.#state.cursorLine;
-			const lineVisibleWidth = visibleWidth(line);
+			const wrappedLine = this.#getWrappedLine(i, contentWidth);
 
-			if (lineVisibleWidth <= contentWidth) {
+			if (wrappedLine.width <= contentWidth) {
 				// Line fits in one layout line
 				if (isCurrentLine) {
 					layoutLines.push({
@@ -1356,7 +1436,7 @@ export class Editor implements Component, Focusable {
 				}
 			} else {
 				// Line needs wrapping - use word-aware wrapping
-				const chunks = wordWrapLine(line, contentWidth);
+				const chunks = wrappedLine.chunks;
 
 				for (let chunkIndex = 0; chunkIndex < chunks.length; chunkIndex++) {
 					const chunk = chunks[chunkIndex];
@@ -1406,6 +1486,7 @@ export class Editor implements Component, Focusable {
 			}
 		}
 
+		this.#wrappedLineCache.length = this.#state.lines.length;
 		return layoutLines;
 	}
 
@@ -1749,6 +1830,7 @@ export class Editor implements Component, Focusable {
 		this.#historyIndex = -1;
 		this.#scrollOffset = 0;
 		this.#undoStack.length = 0;
+		this.#wrappedLineCache.length = 0;
 
 		if (this.onChange) this.onChange("");
 		if (this.onSubmit) this.onSubmit(result);
@@ -2294,15 +2376,15 @@ export class Editor implements Component, Focusable {
 
 		for (let i = 0; i < this.#state.lines.length; i++) {
 			const line = this.#state.lines[i] || "";
-			const lineVisWidth = visibleWidth(line);
+			const wrappedLine = this.#getWrappedLine(i, width);
 			if (line.length === 0) {
 				// Empty line still takes one visual line
 				visualLines.push({ logicalLine: i, startCol: 0, length: 0 });
-			} else if (lineVisWidth <= width) {
+			} else if (wrappedLine.width <= width) {
 				visualLines.push({ logicalLine: i, startCol: 0, length: line.length });
 			} else {
 				// Line needs wrapping - use word-aware wrapping
-				const chunks = wordWrapLine(line, width);
+				const chunks = wrappedLine.chunks;
 				for (const chunk of chunks) {
 					visualLines.push({
 						logicalLine: i,
@@ -2340,8 +2422,10 @@ export class Editor implements Component, Focusable {
 
 	#moveCursor(deltaLine: number, deltaCol: number): void {
 		this.#resetKillSequence();
-		const visualLines = this.#buildVisualLineMap(this.#lastLayoutWidth);
-		const currentVisualLine = this.#findCurrentVisualLine(visualLines);
+		const currentLine = this.#state.lines[this.#state.cursorLine] || "";
+		const needsVisualLines = deltaLine !== 0 || (deltaCol > 0 && this.#state.cursorCol >= currentLine.length);
+		const visualLines = needsVisualLines ? this.#buildVisualLineMap(this.#lastLayoutWidth) : [];
+		const currentVisualLine = needsVisualLines ? this.#findCurrentVisualLine(visualLines) : -1;
 
 		if (deltaLine !== 0) {
 			const targetVisualLine = currentVisualLine + deltaLine;
@@ -2352,15 +2436,18 @@ export class Editor implements Component, Focusable {
 		}
 
 		if (deltaCol !== 0) {
-			const currentLine = this.#state.lines[this.#state.cursorLine] || "";
-
 			if (deltaCol > 0) {
 				// Moving right - move by one grapheme (handles emojis, combining characters, etc.)
 				if (this.#state.cursorCol < currentLine.length) {
-					const afterCursor = currentLine.slice(this.#state.cursorCol);
-					const graphemes = [...segmenter.segment(afterCursor)];
-					const firstGrapheme = graphemes[0];
-					this.#setCursorCol(this.#state.cursorCol + (firstGrapheme ? firstGrapheme.segment.length : 1));
+					const charCode = currentLine.charCodeAt(this.#state.cursorCol);
+					if (charCode >= 0x20 && charCode <= 0x7e) {
+						this.#setCursorCol(this.#state.cursorCol + 1);
+					} else {
+						const afterCursor = currentLine.slice(this.#state.cursorCol);
+						const graphemes = [...segmenter.segment(afterCursor)];
+						const firstGrapheme = graphemes[0];
+						this.#setCursorCol(this.#state.cursorCol + (firstGrapheme ? firstGrapheme.segment.length : 1));
+					}
 				} else if (this.#state.cursorLine < this.#state.lines.length - 1) {
 					// Wrap to start of next logical line
 					this.#state.cursorLine++;
@@ -2375,10 +2462,15 @@ export class Editor implements Component, Focusable {
 			} else {
 				// Moving left - move by one grapheme (handles emojis, combining characters, etc.)
 				if (this.#state.cursorCol > 0) {
-					const beforeCursor = currentLine.slice(0, this.#state.cursorCol);
-					const graphemes = [...segmenter.segment(beforeCursor)];
-					const lastGrapheme = graphemes[graphemes.length - 1];
-					this.#setCursorCol(this.#state.cursorCol - (lastGrapheme ? lastGrapheme.segment.length : 1));
+					const charCode = currentLine.charCodeAt(this.#state.cursorCol - 1);
+					if (charCode >= 0x20 && charCode <= 0x7e) {
+						this.#setCursorCol(this.#state.cursorCol - 1);
+					} else {
+						const beforeCursor = currentLine.slice(0, this.#state.cursorCol);
+						const graphemes = [...segmenter.segment(beforeCursor)];
+						const lastGrapheme = graphemes[graphemes.length - 1];
+						this.#setCursorCol(this.#state.cursorCol - (lastGrapheme ? lastGrapheme.segment.length : 1));
+					}
 				} else if (this.#state.cursorLine > 0) {
 					// Wrap to end of previous logical line
 					this.#state.cursorLine--;

package/src/components/markdown.ts

@@ -39,11 +39,25 @@ markdownParser.setOptions({
 // (Rust FFI) work for content/layout combinations already seen this session.
 
 const RENDER_CACHE_MAX = 256; // sane cap: ~256 distinct message × width combos
-const renderCache = new LRUCache<string, string[]>({ max: RENDER_CACHE_MAX });
+const renderCache = new LRUCache<string, { source: string; lines: string[] }>({ max: RENDER_CACHE_MAX });
+const PARSE_CACHE_MAX = 128;
+const parseCache = new LRUCache<string, { source: string; tokens: Token[] }>({ max: PARSE_CACHE_MAX });
+
+// Full-content 64-bit wyhash over every byte (no lossy sampling). Cache hits
+// additionally verify entry.source against the normalized text, so even a
+// hash collision can never return another message's render.
+function markdownContentKey(text: string): string {
+	return `${text.length}:${Bun.hash(text).toString(36)}`;
+}
+
+function wrapTextIfNeeded(line: string, width: number): string[] {
+	return wrapTextWithAnsi(line, width);
+}
 
 /** Drop all L2 cache entries. Call on theme change to prevent stale styled output. */
 export function clearRenderCache(): void {
 	renderCache.clear();
+	parseCache.clear();
 }
 
 // Stable numeric IDs for structural theme/style objects (no ID field on type).
@@ -195,32 +209,36 @@ export class Markdown implements Component {
 		// Replace tabs with 3 spaces for consistent rendering
 		const normalizedText = replaceTabs(this.#text);
 
+		const contentKey = markdownContentKey(normalizedText);
+
 		// L2: module-level LRU — survives component disposal/recreation across
 		// session-tree navigations. Key encodes every dimension that affects the
-		// render output so different configurations never collide.
-		// Encode terminal capability state and theme/style function output samples
-		// so that capability shifts (image protocol changes, hyperlink toggle) or
-		// caller-supplied theme/bgColor functions that mutate their output without
-		// changing object identity invalidate the cache entry.
-		// bgColor probe uses \x01 (single non-printable byte): chalk/ANSI wrappers
-		// pass arbitrary bytes through verbatim, so this is safe and minimizes the
-		// risk of clashing with a function that returns text verbatim.
-		// theme.heading is used as the representative theme probe — it's required
-		// by MarkdownTheme and is one of the most styling-sensitive entries.
+		// render output so different configurations never collide. The markdown
+		// content dimension is a full-content hash; entries store the source text
+		// and verify it on hit so hash collisions can never serve wrong output.
 		const bgColorProbe = this.#defaultTextStyle?.bgColor ? this.#defaultTextStyle.bgColor("\x01") : "";
 		const headingProbe = this.#theme.heading("");
-		const cacheKey = `${normalizedText}\x00${width}\x00${this.#paddingX}\x00${this.#paddingY}\x00${this.#codeBlockIndent}\x00${objectId(this.#theme)}\x00${this.#defaultTextStyle ? objectId(this.#defaultTextStyle) : -1}\x00${TERMINAL.imageProtocol ?? ""}\x00${TERMINAL.hyperlinks ? 1 : 0}\x00${bgColorProbe}\x00${headingProbe}`;
+		const cacheKey = `${contentKey}\x00${width}\x00${this.#paddingX}\x00${this.#paddingY}\x00${this.#codeBlockIndent}\x00${objectId(this.#theme)}\x00${this.#defaultTextStyle ? objectId(this.#defaultTextStyle) : -1}\x00${TERMINAL.imageProtocol ?? ""}\x00${TERMINAL.hyperlinks ? 1 : 0}\x00${bgColorProbe}\x00${headingProbe}`;
 		const cached = renderCache.get(cacheKey);
-		if (cached !== undefined) {
+		if (cached !== undefined && cached.source === normalizedText) {
 			// Populate L1 so subsequent calls from this instance are O(1) map lookup.
 			this.#cachedText = this.#text;
 			this.#cachedWidth = width;
-			this.#cachedLines = cached;
-			return cached;
+			this.#cachedLines = cached.lines;
+			return cached.lines;
 		}
 
-		// Parse markdown to HTML-like tokens
-		const tokens = markdownParser.lexer(normalizedText);
+		// Parse markdown to marked tokens. Parse cache is width/theme independent,
+		// so the same content can be reused across resize/layout renders even when
+		// final wrapped output must differ by width.
+		const cachedParse = parseCache.get(contentKey);
+		let tokens: Token[];
+		if (cachedParse !== undefined && cachedParse.source === normalizedText) {
+			tokens = cachedParse.tokens;
+		} else {
+			tokens = markdownParser.lexer(normalizedText);
+			parseCache.set(contentKey, { source: normalizedText, tokens });
+		}
 
 		// Convert tokens to styled terminal output
 		const renderedLines: string[] = [];
@@ -235,11 +253,10 @@ export class Markdown implements Component {
 		// Wrap lines (NO padding, NO background yet)
 		const wrappedLines: string[] = [];
 		for (const line of renderedLines) {
-			// Skip wrapping for image protocol lines (would corrupt escape sequences)
 			if (TERMINAL.isImageLine(line)) {
 				wrappedLines.push(line);
 			} else {
-				wrappedLines.push(...wrapTextWithAnsi(line, contentWidth));
+				wrappedLines.push(...wrapTextIfNeeded(line, contentWidth));
 			}
 		}
 
@@ -287,7 +304,7 @@ export class Markdown implements Component {
 
 		// Update L2 module-level LRU so future instances with the same key skip
 		// the marked.lexer + highlightCode (Rust FFI) work entirely.
-		renderCache.set(cacheKey, result);
+		renderCache.set(cacheKey, { source: normalizedText, lines: result });
 
 		return result;
 	}
@@ -495,7 +512,7 @@ export class Markdown implements Component {
 
 				for (const quoteLine of renderedQuoteLines) {
 					const styledLine = applyQuoteStyle(quoteLine);
-					const wrappedLines = wrapTextWithAnsi(styledLine, quoteContentWidth);
+					const wrappedLines = wrapTextIfNeeded(styledLine, quoteContentWidth);
 					for (const wrappedLine of wrappedLines) {
 						lines.push(this.#theme.quoteBorder(`${this.#theme.symbols.quoteBorder} `) + wrappedLine);
 					}
@@ -755,7 +772,7 @@ export class Markdown implements Component {
 	 * consistently with the rest of the renderer.
 	 */
 	#wrapCellText(text: string, maxWidth: number): string[] {
-		return wrapTextWithAnsi(text, Math.max(1, maxWidth));
+		return wrapTextIfNeeded(text, Math.max(1, maxWidth));
 	}
 
 	/**

package/src/tui.ts

@@ -12,6 +12,7 @@ import { ImageProtocol, setCellDimensions, setTerminalImageProtocol, TERMINAL }
 import {
 	Ellipsis,
 	extractSegments,
+	isPrintableAscii,
 	normalizeTerminalOutput,
 	sliceByColumn,
 	sliceWithWidth,
@@ -227,12 +228,21 @@ export class Container implements Component {
 	}
 }
 
+type LineNormalizationCacheEntry = {
+	normalized: string;
+	terminated: string;
+};
+
 /**
  * TUI - Main class for managing terminal UI with differential rendering
  */
 export class TUI extends Container {
 	terminal: Terminal;
 	#previousLines: string[] = [];
+	#lineNormalizationCache = new Map<string, LineNormalizationCacheEntry>();
+	#lineTruncationCache = new Map<string, string>();
+	#lineNormalizationCacheLimit = 0;
+	#lineTruncationCacheLimit = 0;
 	#previousWidth = 0;
 	#previousHeight = 0;
 	#focusedComponent: Component | null = null;
@@ -648,6 +658,8 @@ export class TUI extends Container {
 		// focus/listener state is intentionally preserved so input routing survives
 		// a resume.
 		this.#previousLines = [];
+		this.#lineNormalizationCache.clear();
+		this.#lineTruncationCache.clear();
 		this.#previousWidth = 0;
 		this.#previousHeight = 0;
 	}
@@ -660,8 +672,12 @@ export class TUI extends Container {
 		if (renderMetrics.enabled) renderMetrics.recordRequest(source);
 		if (force) {
 			this.#previousLines = [];
+			this.#lineNormalizationCache.clear();
+			this.#lineTruncationCache.clear();
 			this.#previousWidth = -1; // -1 triggers widthChanged, forcing a full clear
 			this.#previousHeight = -1; // -1 triggers heightChanged, forcing a full clear
+			this.#lineNormalizationCacheLimit = 0;
+			this.#lineTruncationCacheLimit = 0;
 			this.#cursorRow = 0;
 			this.#hardwareCursorRow = 0;
 			this.#viewportTopRow = 0;
@@ -1092,25 +1108,71 @@ export class TUI extends Container {
 	 * written to the terminal — without this, the diff cache disagrees with
 	 * emitted output and OSC 8 hyperlink state can leak across lines.
 	 */
-	#applyLineResets(lines: string[]): string[] {
-		for (let i = 0; i < lines.length; i++) {
-			const line = lines[i];
-			if (TERMINAL.isImageLine(line)) continue;
-			const normalized = normalizeTerminalOutput(line);
-			// Only close OSC 8 hyperlinks when the line actually opened one;
-			// emitting `\x1b]8;;\x07` on every line just feeds the terminal's OSC
-			// parser for no reason (measurable cost in xterm.js parse loop).
-			lines[i] = normalized + (normalized.includes("\x1b]8;") ? LINE_TERMINATOR : SEGMENT_RESET);
+	#normalizeLineForRender(line: string): LineNormalizationCacheEntry {
+		const cached = this.#lineNormalizationCache.get(line);
+		if (cached !== undefined) return cached;
+		const normalized = normalizeTerminalOutput(line);
+		const terminated = normalized + (normalized.includes("\x1b]8;") ? LINE_TERMINATOR : SEGMENT_RESET);
+		this.#lineNormalizationCache.set(line, { normalized, terminated });
+		return { normalized, terminated };
+	}
+
+	#lineFitsWidth(normalizedLine: string, width: number): boolean {
+		return isPrintableAscii(normalizedLine) && normalizedLine.length <= width
+			? true
+			: visibleWidth(normalizedLine) <= width;
+	}
+
+	#truncateNormalizedLine(normalizedLine: string, width: number): string {
+		const key = `${width}\0${normalizedLine}`;
+		const cached = this.#lineTruncationCache.get(key);
+		if (cached !== undefined) return cached;
+		const truncated = truncateToWidth(normalizedLine, width, Ellipsis.Omit);
+		const terminated = truncated + (truncated.includes("\x1b]8;") ? LINE_TERMINATOR : SEGMENT_RESET);
+		this.#lineTruncationCache.set(key, terminated);
+		return terminated;
+	}
+
+	#trimLineCachesForRender(lineCount: number): void {
+		const limit = Math.max(1, lineCount * 2);
+		this.#lineNormalizationCacheLimit = limit;
+		this.#lineTruncationCacheLimit = limit;
+		while (this.#lineNormalizationCache.size > limit) {
+			const key = this.#lineNormalizationCache.keys().next().value;
+			if (key === undefined) break;
+			this.#lineNormalizationCache.delete(key);
+		}
+		while (this.#lineTruncationCache.size > limit) {
+			const key = this.#lineTruncationCache.keys().next().value;
+			if (key === undefined) break;
+			this.#lineTruncationCache.delete(key);
 		}
-		return lines;
 	}
-	#truncateLinesToWidth(lines: string[], width: number): string[] {
+
+	getLineRenderCacheStats(): {
+		normalizationSize: number;
+		truncationSize: number;
+		normalizationLimit: number;
+		truncationLimit: number;
+	} {
+		return {
+			normalizationSize: this.#lineNormalizationCache.size,
+			truncationSize: this.#lineTruncationCache.size,
+			normalizationLimit: this.#lineNormalizationCacheLimit,
+			truncationLimit: this.#lineTruncationCacheLimit,
+		};
+	}
+
+	#applyLineResetsAndTruncate(lines: string[], width: number): string[] {
 		for (let i = 0; i < lines.length; i++) {
 			const line = lines[i];
-			if (TERMINAL.isImageLine(line) || visibleWidth(line) <= width) continue;
-			const truncated = truncateToWidth(line, width, Ellipsis.Omit);
-			lines[i] = truncated + (truncated.includes("\x1b]8;") ? LINE_TERMINATOR : SEGMENT_RESET);
+			if (TERMINAL.isImageLine(line)) continue;
+			const { normalized, terminated } = this.#normalizeLineForRender(line);
+			lines[i] = this.#lineFitsWidth(normalized, width)
+				? terminated
+				: this.#truncateNormalizedLine(normalized, width);
 		}
+		this.#trimLineCachesForRender(lines.length);
 		return lines;
 	}
 
@@ -1144,8 +1206,7 @@ export class TUI extends Container {
 		// (closes SGR + OSC 8 hyperlink state). Must run after cursor extraction
 		// because the marker is embedded mid-line, and before any diff/full render
 		// path so cache comparisons stay byte-accurate.
-		newLines = this.#applyLineResets(newLines);
-		newLines = this.#truncateLinesToWidth(newLines, width);
+		newLines = this.#applyLineResetsAndTruncate(newLines, width);
 
 		// Width changed - need full re-render (line wrapping changes)
 		const widthChanged = this.#previousWidth !== 0 && this.#previousWidth !== width;

package/src/utils.ts

@@ -24,6 +24,14 @@ function recordTextHelper<T>(name: string, fn: () => T): T {
 	}
 }
 
+export function isPrintableAscii(text: string): boolean {
+	for (let i = 0; i < text.length; i++) {
+		const code = text.charCodeAt(i);
+		if (code < 0x20 || code > 0x7e) return false;
+	}
+	return true;
+}
+
 export function sliceWithWidth(line: string, startCol: number, length: number, strict?: boolean | null): SliceResult {
 	return nativeSliceWithWidth(line, startCol, length, strict ?? null, getDefaultTabWidth());
 }