fix(conversations): avoid rerendering all items on selection - #2036
fix(conversations): avoid rerendering all items on selection#2036advance-hub wants to merge 2 commits into
Conversation
将菜单解析与样式合并下沉到单个会话项，并稳定选中回调与语义样式属性，使 React.memo 只重渲染前后两个受影响项。 新增 500 项会话列表回归测试，保证切换选中项时计算量保持常数级。
|
Important Review skippedReview was skipped due to path filters ⛔ Files ignored due to path filters (1)
CodeRabbit blocks several paths by default. You can override this behavior by explicitly including those paths in the path filters. For example, including ⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Plus Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (3)
Included review availability: Your plan provides up to 8 included reviews per hour; 6 remain after this review. 📝 WalkthroughWalkthroughChanges会话条目现在支持独立的 会话条目菜单与样式渲染
会话列表集成与性能验证
Estimated code review effort: 3 (Moderate) | ~20 minutes Merge Risk: ⚪ Minimal · up to This change localizes conversation-item updates to improve selection performance while preserving existing behavior, with regression tests and standard checks completed; no actionable merge-blocking risk remains. Sequence Diagram(s)sequenceDiagram
participant Conversations
participant ConversationsItem
participant MenuFunction
Conversations->>ConversationsItem: 传入会话信息和 menu
ConversationsItem->>MenuFunction: 按会话信息解析 menu
MenuFunction-->>ConversationsItem: 返回菜单配置
ConversationsItem-->>Conversations: 渲染活动状态和菜单
Suggested reviewers: Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
Full details: Docstring CoverageExplanation No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 3 files. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Bundle ReportChanges will decrease total bundle size by 1.21MB (-20.74%) ⬇️. This is within the configured threshold ✅ Detailed changes
Affected Assets, Files, and Routes:view changes for bundle: x-markdown-array-pushAssets Changed:
view changes for bundle: antdx-array-pushAssets Changed:
|
当前 CI 已被 GitHub Actions 强制切换到 Node 24，Suggestion 触发器的 SSR 输出不再为可见占位元素生成冗余的 visibility 内联样式。本提交仅校正一行快照基线，不改变组件运行时代码。 **验证说明** 1. Suggestion demo 快照测试通过。 2. Conversations 回归测试通过。 3. 合计 29 个测试、6 个快照全部通过。
nrps9909
left a comment
nrps9909
left a comment
There was a problem hiding this comment.
Reviewed exact head f8a25ea against base 25aad7b.
The optimization preserves prop precedence while moving menu resolution and style merging into the memoized item. The parent now supplies stable item data and a useEvent-backed click handler, so an active-key change invalidates the old and new active rows instead of every row. Changed menu, style, className, item data, direction, or active props still invalidate the relevant memoized item through normal shallow comparison.
Validation performed:
- Removed React.memo locally while retaining the rest of the PR: the 500-item regression failed with 2,000 post-selection menu computations, confirming the test detects the eliminated O(n) work.
- Exact head regression stays within its constant bound and activates the selected row.
- A temporary rerender probe kept the item array stable, replaced onActiveChange, and confirmed a memo-skipped item invokes only the newest callback through useEvent rather than a stale closure.
- Complete Conversations scope: 24/24 tests and 2/2 snapshots passed.
- The separately synchronized Suggestion demo scope passes 5/5 tests and 4/4 snapshots with the current dependency/runtime output.
- packages/x TypeScript noEmit passed; Biome passed all three source/test files; git diff --check passed.
- Live PR head still matches the tested SHA; the currently reported remote checks are green.
AI assistance disclosure: Codex was used to inspect the exact prop and memo boundaries, run the counterfactual performance and latest-callback probes, execute focused/static checks, and draft this review. I verified the reported commands and outcomes.
2 participants
Fixes #1871
Background
Changing the active conversation caused every item in a large list to rerender. The parent recomputed merged styles, resolved the menu callback for every row, and passed a new click callback on each selection change. With 500 items, a single click performed work proportional to the full list.
Changes
useEvent.Performance evidence
Measured in the same React development build and browser session:
The timing is environment-dependent; the item-computation reduction is deterministic. React development mode invokes render work more than once, which is why two affected rows can report 3–4 computations.
Recordings
Before — 1,000 item computations
Open the original MP4
After — 3–4 item computations
Open the original MP4
Verification
NODE_OPTIONS=--max-old-space-size=768 ../../node_modules/.bin/jest --config .jest.js components/conversations/__tests__/index.test.tsx --runInBand --no-cache(24 tests, 2 snapshots)NODE_OPTIONS=--max-old-space-size=1024 ./node_modules/.bin/tsc --noEmit -p packages/x/tsconfig.json./node_modules/.bin/biome check packages/x/components/conversations/index.tsx packages/x/components/conversations/Item.tsx packages/x/components/conversations/__tests__/index.test.tsxSummary by CodeRabbit
新功能
性能优化