[Yuruzuu]

Problem

The timeline minimap mounts one extra <span> per turn just to draw its in-view highlight, including for turns outside the virtualized message list. In a long thread, those elements stay in the DOM even though the messages they mark don't.

Change

The highlight is now an ::after pseudo-element on the existing strip, toggled by the same data-in-view attribute. The strip, its refs, hit targets and state are unchanged.

Pseudo-elements still generate boxes, so I'm claiming fewer DOM elements here, not a measured layout-time gain. Web and desktop share this code, and both the main thread and side chats use it. Mobile doesn't have this component.

#23419, #23462 and #23942 also edit TimelineMinimap.tsx, so whichever lands second may need a small rebase.

Scope and approval

This fits the small, focused exception in CONTRIBUTING.md: 6 changed lines that remove elements with no visual, behavior or contract change.

Verification

Element counts from a temporary Chromium test running the full app against a fake environment: 120 turns with 240 messages, 120 command executions, markdown, highlighted code and tables.

Elements	Before	After
Minimap	253	133
Side chat pane, total	1,986	1,866
Main pane, total	2,166	2,046

The before and after screenshots below were pixel-identical in both panes. Computed pseudo-element styles matched the old child element in light and dark themes, including highlight toggling and scale transforms.

Before (main)	After (this branch)

vp run check:changed passes. No test was added for this markup-only change, as AGENTS.md asks.

Real-client pass: web dev build in Chromium with the free Replay provider, with this branch merged with the other side chat performance PRs from this batch. Seven strips appeared and the in-view markers changed on scroll. Clicking a strip to navigate was not confirmed there, though a temporary test covered keyboard navigation. The scenario didn't produce a minimap in a side chat, so that pane rests on the test above.

Not checked: the desktop app, or relay and tunnel connections.

Made with GPT-6.1 Sol via Codex in T3 Code, coordinated by Claude Opus 5.5 via Claude Code. A second GPT-6.1 Sol agent reviewed it adversarially.

🤖 Generated with Claude Code

[macroscopeapp]

Approvability

Verdict: Approved at a2a0b01

Macroscope's review found this PR approvable — Minimap highlights move from nested spans to CSS pseudo-elements, reducing DOM nodes while retaining the existing highlight state and transitions. The change is limited to presentation and leaves navigation, product defaults, and stored data unchanged.

^{You can add or adjust custom eligibility rules. Learn more.}

[coderabbitai]

No actionable comments were generated in the recent review.

Recent review info

Run configuration

• Source mode: Auto
• Repository: pingdotgg/t3code
• Branch: main
• File: .coderabbit.config.ts
• Commit: 15fe283
• Layers: Repository TS config
• Review profile: CHILL
• Plan: Advanced
• Run ID: 984ef5cb-3083-4f31-b6ac-802c222a212c

Commits

Reviewing files that changed from the base of the PR and between 15fe283 and a2a0b01.

Files selected for processing: 1

• apps/web/src/components/chat/TimelineMinimap.tsx

Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 4 remain after this review.

Walkthrough

The timeline minimap now renders the in-view highlight through a strip ::after pseudo-element. The nested highlight span and group/strip class are removed.

Changes: Timeline minimap highlight

Layer / File(s)	Summary
Move highlight styling to strip apps/web/src/components/chat/TimelineMinimap.tsx	The strip class applies the in-view highlight through ::after. The nested highlight span and group/strip class are removed.

Estimated code review effort: 1 (Trivial) | ~2 minutes

Change: Refactor

Possibly related PRs

• pingdotgg/t3code#23942: Changes the same timeline minimap strip-rendering path by replacing it with a Canvas rail.
• pingdotgg/t3code#24865: Changes minimap strip colors and the opacity of the in-view overlay.

Suggested labels: size:S

Suggested reviewers: juliusmarminge, t3dotgg

Merge Risk: Minimal · up to a2a0b

No actionable merge-blocking risk was identified in the minimap rendering change.

Pre-merge checks: 4

Check name	Status	Explanation
Title check		The title "perf(web): render minimap highlights without extra nodes" matches the main change. The minimap highlight moves from a nested span per turn to an ::after pseudo-element on the existing strip…
Description check		The description follows the template sections: Problem, Change, Scope and approval, and Verification. The Problem and Change sections clearly state the issue and the fix. Scope cites the small, focuse…
Linked Issues check		Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check		Check skipped because no linked issues were found for this pull request.

Full details: Title check

Explanation

The title "perf(web): render minimap highlights without extra nodes" matches the main change. The minimap highlight moves from a nested span per turn to an ::after pseudo-element on the existing strip, so fewer DOM nodes are created. It is a conventional commit title in plain language and names the component area (web) and the change.

Full details: Description check

Explanation

The description follows the template sections: Problem, Change, Scope and approval, and Verification. The Problem and Change sections clearly state the issue and the fix. Scope cites the small, focused exception in CONTRIBUTING.md and gives a 6-line change. Verification gives concrete element counts, before and after screenshots, the checks run, and what was not checked. The template asks for an agent attribution line at the end, and the description includes one. The description does not link a triaged issue or maintainer approval. It relies on the small-fix exception, which the template allows only when the author explains why the change qualifies. The author does explain this. The description is mostly complete.

Finishing Touches

Generate unit tests (beta)

• Create a new PR

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

[maria-rcks]

Note

Written by gpt-6.1-sol on behalf of Maria

Verified in a real dev environment

Verified unchanged head a2a0b01bbb20f025c6740299d36b8979d45edcb6 with repository Playwright and /usr/bin/google-chrome on Linux. Started github/main (54c5f25249) in a separate worktree first, then stopped it before starting this exact head. Both used vp i and the real background dev server.

Created a project pointing at a real git checkout through the web UI. Sent eight main-thread turns and three side-chat turns through Codex gpt-6.1-sol using this VM's local proxy. Copied that app-created state between the stopped servers for matching captures. No mocks, Replay provider, fixtures, or demo data.

The original extra highlight elements reproduce on main. On this head, each strip has zero child elements and the ::after highlight follows data-in-view: opacity 1 when visible, 0 otherwise. Highlight colors, positioning, and appearance remain consistent in light and dark themes.

                         main       PR head
main minimap, 8 turns    28 nodes   20 nodes
side minimap, 3 turns   18 nodes   15 nodes
highlight child spans   11         0

In both panes, exercised hover previews, click-to-jump, Home/End, ArrowDown/Enter, previous/next buttons, and wheel scrolling over the minimap. The visible turn and in-view markers changed. Fresh main-thread and side-chat provider turns also completed on the PR head, returning main-head-confirmed and side-head-confirmed; their minimaps grew to nine and four strips with zero highlight children.

vp run check:changed 15fe2832727893cbdd2214383f9f971474849695 passed through blacksmith-check: format, lint, both knip passes, affected typechecks, and React Compiler coverage. The explicit base was needed because the remote source snapshot initially had no merge-base history. Existing head CI reports 30 successful checks. No source changes were needed. This verifies DOM reduction, not a measured frame-time or layout-time improvement.

Before, light:

After, light:

Before, dark:

After, dark:

Inspected the screenshots and recording. Uploaded video playback and seeking work in Chrome.

Not verified

Electron shell behavior, native iOS/Android clients, macOS/Windows, relay/tunnel connections, other providers, and very large production threads were not exercised on this Linux VM. Mobile does not render this component. No performance timing claim was tested.