fix: reduce GPU usage in Agent Manager with message virtualization

[marius-kilocode]

• Implement react-virtuoso for message list rendering
• Only render visible messages + buffer (400px top/bottom)
• Reduces DOM nodes by ~96% (1,500 → 54 nodes for 3 agents)
• Aligns with sidebar architecture (ChatView.tsx)
• Update CSS for proper Virtuoso container sizing
• Add Virtuoso mock to tests

Expected GPU usage reduction: ~96% (from ~25% to <8% per session)

Fixes high GPU usage when running multiple parallel AI agents

[changeset-bot]

🦋 Changeset detected

Latest commit: e43c37b

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
kilo-code	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[kiloconnect]

✅ No Issues Found

4 files reviewed | Confidence: 95% | Recommendation: Merge

Review Details

Files:

• GPU_USAGE_ANALYSIS.md - Documentation explaining the GPU usage investigation and solution design
• webview-ui/src/kilocode/agent-manager/components/AgentManagerApp.css - CSS updates for Virtuoso container sizing
• webview-ui/src/kilocode/agent-manager/components/MessageList.tsx - Main virtualization implementation
• webview-ui/src/kilocode/agent-manager/components/__tests__/MessageList.spec.tsx - Test updates with Virtuoso mock

Checked: Security, bugs, performance, error handling

Analysis:

• ✅ Virtuoso implementation follows established pattern from ChatView.tsx
• ✅ Proper memoization with useCallback for itemContent renderer
• ✅ Proper memoization with useMemo for allItems array
• ✅ CSS changes correctly configure container for Virtuoso scrolling
• ✅ Test mock correctly renders all items for testing purposes
• ✅ Auto-scroll logic properly uses Virtuoso API (scrollToIndex)
• ✅ followOutput="smooth" enables automatic scroll following
• ✅ increaseViewportBy buffer matches sidebar implementation (400px top/bottom)

[kiloconnect]

✅ Previous Issues Addressed

The following issues from my previous review have been resolved:

• isLast calculation - Thread resolved. The implementation correctly marks the last regular message as isLast even when queued messages exist, which is the intended behavior per the code comment.
• GPU_USAGE_ANALYSIS.md - File has been removed from the PR.

No new issues found in the latest changes.

Review Details (4 files)

Files reviewed:

• .changeset/agent-manager-virtualization.md - Changeset documentation
• webview-ui/src/kilocode/agent-manager/components/AgentManagerApp.css - CSS updates for Virtuoso container
• webview-ui/src/kilocode/agent-manager/components/MessageList.tsx - Virtuoso implementation
• webview-ui/src/kilocode/agent-manager/components/__tests__/MessageList.spec.tsx - Test coverage added

Checked: Security, bugs, performance, error handling

Implementation notes:

• Virtuoso configuration aligns with existing ChatView.tsx patterns
• followOutput="smooth" and increaseViewportBy={{ top: 400, bottom: 400 }} match established conventions
• Test coverage added for isLast calculation with queued messages

Recommendation: Merge