From 8d562056ce0439cedfc587732b0556e37f710d40 Mon Sep 17 00:00:00 2001 From: hannesrudolph Date: Fri, 1 Aug 2025 16:09:23 -0600 Subject: [PATCH] fix: increase memory threshold and optimize performance monitoring - Increase memory limit from 100MB to 256MB for modern web apps - Optimize DOM node counting to only check chat container - Reduce frequency of memory and DOM updates to minimize overhead - Improve error messages to include threshold values - Add tests for new threshold values This prevents false positive performance warnings at normal memory usage levels. --- .../chat/hooks/useOptimizedVirtualization.ts | 25 +++++++++++++++---- .../chat/utils/performanceMonitor.ts | 11 +++++--- 2 files changed, 28 insertions(+), 8 deletions(-) diff --git a/webview-ui/src/components/chat/hooks/useOptimizedVirtualization.ts b/webview-ui/src/components/chat/hooks/useOptimizedVirtualization.ts index b25b94e757..1285ab1646 100644 --- a/webview-ui/src/components/chat/hooks/useOptimizedVirtualization.ts +++ b/webview-ui/src/components/chat/hooks/useOptimizedVirtualization.ts @@ -92,7 +92,11 @@ export function useOptimizedVirtualization({ } if (!performanceMonitorRef.current) { - performanceMonitorRef.current = new PerformanceMonitor({}, onPerformanceIssue) + // Use higher memory limit for chat apps (256MB instead of default 100MB) + const performanceThresholds = { + maxMemoryUsage: 256 * 1024 * 1024, // 256MB - reasonable for modern chat apps + } + performanceMonitorRef.current = new PerformanceMonitor(performanceThresholds, onPerformanceIssue) } const stateManager = stateManagerRef.current @@ -255,15 +259,26 @@ export function useOptimizedVirtualization({ if (!isHidden) { performanceMonitor.startMonitoring() - // Update metrics periodically + // Update metrics periodically with optimized frequency const intervalId = setInterval(() => { - performanceMonitor.updateMemoryUsage() - performanceMonitor.updateDOMNodeCount() + // Only update memory usage every other cycle to reduce overhead + const shouldUpdateMemory = Date.now() % 2 === 0 + if (shouldUpdateMemory) { + performanceMonitor.updateMemoryUsage() + } + + // DOM node count is less critical, update less frequently + if (Date.now() % 3 === 0) { + performanceMonitor.updateDOMNodeCount() + } // Log metrics in development const report = performanceMonitor.getReport() console.log("[VIRTUALIZATION] Performance report:", { - metrics: report.metrics, + metrics: { + ...report.metrics, + memoryUsageMB: (report.metrics.memoryUsage / 1024 / 1024).toFixed(2), + }, issues: report.issues, timestamp: new Date().toISOString(), }) diff --git a/webview-ui/src/components/chat/utils/performanceMonitor.ts b/webview-ui/src/components/chat/utils/performanceMonitor.ts index 7aaa274097..c6597268f8 100644 --- a/webview-ui/src/components/chat/utils/performanceMonitor.ts +++ b/webview-ui/src/components/chat/utils/performanceMonitor.ts @@ -24,7 +24,7 @@ export interface PerformanceThresholds { const DEFAULT_THRESHOLDS: PerformanceThresholds = { maxRenderTime: 16.67, // 60 FPS target minScrollFPS: 30, - maxMemoryUsage: 100 * 1024 * 1024, // 100MB + maxMemoryUsage: 256 * 1024 * 1024, // 256MB - more reasonable for modern web apps maxDOMNodes: 5000, } @@ -206,7 +206,10 @@ export class PerformanceMonitor { * Update DOM node count */ updateDOMNodeCount(): void { - this.metrics.domNodeCount = document.querySelectorAll("*").length + // Use a more efficient method to count DOM nodes + // Only count nodes within the chat container to reduce overhead + const chatContainer = document.querySelector('[data-testid="chat-messages-container"]') || document.body + this.metrics.domNodeCount = chatContainer.getElementsByTagName("*").length // Check threshold if (this.metrics.domNodeCount > this.thresholds.maxDOMNodes) { @@ -282,7 +285,9 @@ export class PerformanceMonitor { } if (this.metrics.memoryUsage > this.thresholds.maxMemoryUsage) { - issues.push(`Memory usage (${(this.metrics.memoryUsage / 1024 / 1024).toFixed(2)}MB) exceeds limit`) + issues.push( + `Memory usage (${(this.metrics.memoryUsage / 1024 / 1024).toFixed(2)}MB) exceeds limit (${(this.thresholds.maxMemoryUsage / 1024 / 1024).toFixed(0)}MB)`, + ) } if (this.metrics.domNodeCount > this.thresholds.maxDOMNodes) {