diff --git a/webview-ui/src/components/chat/ChatView.tsx b/webview-ui/src/components/chat/ChatView.tsx index 0c005d0db3..179a6948be 100644 --- a/webview-ui/src/components/chat/ChatView.tsx +++ b/webview-ui/src/components/chat/ChatView.tsx @@ -70,6 +70,11 @@ export interface ChatViewRef { export const MAX_IMAGES_PER_MESSAGE = 20 // Anthropic limits to 20 images +// Viewport buffer constants for memory-efficient scroll behavior +const VIEWPORT_BUFFER_AT_BOTTOM = 10_000 // Larger buffer when at bottom to maintain scroll lock +const VIEWPORT_BUFFER_SCROLLED_UP = 1_000 // Smaller buffer when scrolled up to preserve memory efficiency +const VIEWPORT_BUFFER_TOP = 3_000 // Top buffer for smooth scrolling + const isMac = navigator.platform.toUpperCase().indexOf("MAC") >= 0 const ChatViewComponent: React.ForwardRefRenderFunction = ( @@ -174,6 +179,8 @@ const ChatViewComponent: React.ForwardRefRenderFunction("") const [wasStreaming, setWasStreaming] = useState(false) const [showCheckpointWarning, setShowCheckpointWarning] = useState(false) @@ -1430,6 +1437,16 @@ const ChatViewComponent: React.ForwardRefRenderFunction { + const timer = setTimeout(() => { + setDebouncedIsAtBottom(isAtBottom) + }, 300) // 300ms delay provides good balance between responsiveness and stability + + return () => clearTimeout(timer) + }, [isAtBottom]) + // Effect to handle showing the checkpoint warning after a delay useEffect(() => { // Only show the warning when there's a task but no visible messages yet @@ -1888,10 +1905,13 @@ const ChatViewComponent: React.ForwardRefRenderFunction