Skip to content

Reduce terminal drawer resize rerenders#2816

Draft
cursor[bot] wants to merge 3 commits into
mainfrom
cursor/react-component-health-4a54
Draft

Reduce terminal drawer resize rerenders#2816
cursor[bot] wants to merge 3 commits into
mainfrom
cursor/react-component-health-4a54

Conversation

@cursor
Copy link
Copy Markdown
Contributor

@cursor cursor Bot commented May 26, 2026

What Changed

  • Reworked ThreadTerminalDrawer height handling so prop-driven height changes render from the clamped source height directly instead of syncing through setState in an effect.
  • Kept transient drag/window-resize height updates local to a named useThreadDrawerHeight hook.
  • Replaced the visibility-only resize effect with a derived resize epoch signal.
  • Added React Scan recordings for the audited interaction:
    • Before: docs/perf/react-scan-terminal-drawer-before.webm
    • After: docs/perf/react-scan-terminal-drawer-after.webm

Why

React Doctor flagged ThreadTerminalDrawer for synchronous state updates in effects, which can create cascading renders and block React Compiler optimization. The new flow removes the prop-to-state effect from the component's hot resize path while preserving live drag behavior and terminal fit synchronization.

React Doctor summary improved from 606 diagnostics / 141 errors to 605 diagnostics / 139 errors, with the targeted ThreadTerminalDrawer set-state-in-effect findings removed.

UI Changes

No intentional UI appearance change. The before/after React Scan recordings above show the same terminal drawer height/visibility interaction with React Scan enabled.

Checklist

  • This PR is small and focused
  • I explained what changed and why
  • I included before/after screenshots for any UI changes
  • I included a video for animation/interaction changes

Validation:

  • bun fmt
  • bun lint (passes with existing warnings)
  • bun typecheck
  • bunx react-doctor@latest --json --yes --offline --fail-on none
Open in Web View Automation 

Note

Reduce rerenders in ThreadTerminalDrawer during resize

  • Introduces a useThreadDrawerHeight hook in ThreadTerminalDrawer.tsx that manages drawer height with a per-thread draft value, suppressing redundant onHeightChange calls when the clamped height hasn't changed.
  • Replaces a resizeEpoch effect (triggered on visibility changes) with a derived effectiveResizeEpoch = resizeEpoch + (visible ? 1 : 0), reducing unnecessary re-renders of TerminalViewport children.
  • Draft height is cleared after drag-end and non-drag window resize events, so only in-progress drag interactions use the draft value.
  • Behavioral Change: TerminalViewport instances now always receive a resizeEpoch incremented by 1 when the drawer is visible, rather than incrementing only on visibility transitions.

Macroscope summarized c5320d7.

cursoragent and others added 3 commits May 26, 2026 16:10
Co-authored-by: Julius Marminge <juliusmarminge@users.noreply.github.com>
Co-authored-by: Julius Marminge <juliusmarminge@users.noreply.github.com>
Co-authored-by: Julius Marminge <juliusmarminge@users.noreply.github.com>
@github-actions github-actions Bot added size:M 30-99 changed lines (additions + deletions). vouch:trusted PR author is trusted by repo permissions or the VOUCHED list. labels May 26, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

size:M 30-99 changed lines (additions + deletions). vouch:trusted PR author is trusted by repo permissions or the VOUCHED list.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant