scriptoriumadmin/Roo-Code
1
0
Fork 0
mirror of https://github.com/RooVetGit/Roo-Code.git synced 2026-09-07 08:26:51 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: resolve scroll jumping issue on smaller screens

Browse source 
- Increased message limit threshold from 500 to 750 messages
- Only apply message limiting for very long conversations (>1000 messages)
- Balanced viewport rendering (1500px top/bottom instead of 3000px/1000px)
- Increased LRU cache capacity from 100 to 200 entries with longer TTL
- Expanded viewport tracking window from 100 to 200 messages

These changes prevent aggressive message filtering that was causing
scroll position jumps while maintaining memory optimizations from PR #6697.

Fixes #7026
This commit is contained in:
Roo Code 2025-08-12 23:21:20 +00:00
parent 7b0f489ea2
commit 01ed9cce49
1 changed files with 13 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
webview-ui/src/components/chat/ChatView.tsx
View file

@ -181,8 +181,8 @@ const ChatViewComponent: React.ForwardRefRenderFunction<ChatViewRef, ChatViewPro
const [showAnnouncementModal, setShowAnnouncementModal] = useState(false)
const everVisibleMessagesTsRef = useRef<LRUCache<number, boolean>>(
new LRUCache({
max: 100,
ttl: 1000 * 60 * 5,
max: 200,
ttl: 1000 * 60 * 10,
}),
)
const autoApproveTimeoutRef = useRef<NodeJS.Timeout | null>(null)
@ -897,11 +897,14 @@ const ChatViewComponent: React.ForwardRefRenderFunction<ChatViewRef, ChatViewPro
useMount(() => textAreaRef.current?.focus())
const visibleMessages = useMemo(() => {
// Use a more conservative approach for message filtering to prevent jumping
// Only apply the 500 message limit for very long conversations
const currentMessageCount = modifiedMessages.length
const startIndex = Math.max(0, currentMessageCount - 500)
const recentMessages = modifiedMessages.slice(startIndex)
const shouldLimitMessages = currentMessageCount > 1000
const startIndex = shouldLimitMessages ? Math.max(0, currentMessageCount - 750) : 0
const messagesToProcess = modifiedMessages.slice(startIndex)
const newVisibleMessages = recentMessages.filter((message: ClineMessage) => {
const newVisibleMessages = messagesToProcess.filter((message: ClineMessage) => {
if (everVisibleMessagesTsRef.current.has(message.ts)) {
const alwaysHiddenOnceProcessedAsk: ClineAsk[] = [
"api_req_failed",
@ -954,7 +957,10 @@ const ChatViewComponent: React.ForwardRefRenderFunction<ChatViewRef, ChatViewPro
return true
})
const viewportStart = Math.max(0, newVisibleMessages.length - 100)
// Track visible messages more conservatively to avoid cache thrashing
// Only track messages that are actually in the current viewport
const viewportWindow = Math.min(200, newVisibleMessages.length)
const viewportStart = Math.max(0, newVisibleMessages.length - viewportWindow)
newVisibleMessages
.slice(viewportStart)
.forEach((msg: ClineMessage) => everVisibleMessagesTsRef.current.set(msg.ts, true))
@ -1870,7 +1876,7 @@ const ChatViewComponent: React.ForwardRefRenderFunction<ChatViewRef, ChatViewPro
ref={virtuosoRef}
key={task.ts}
className="scrollable grow overflow-y-scroll mb-1"
increaseViewportBy={{ top: 3_000, bottom: 1000 }}
increaseViewportBy={{ top: 1500, bottom: 1500 }}
data={groupedMessages}
itemContent={itemContent}
atBottomStateChange={(isAtBottom: boolean) => {