diff --git a/src-tauri/src/config/verge.rs b/src-tauri/src/config/verge.rs index 7f9bcd9e5..1f0952859 100644 --- a/src-tauri/src/config/verge.rs +++ b/src-tauri/src/config/verge.rs @@ -49,6 +49,9 @@ pub struct IVerge { #[serde(skip_serializing_if = "Option::is_none")] pub enable_group_icon: Option, + /// pause render traffic stats on blur + pub pause_render_traffic_stats_on_blur: Option, + /// common tray icon #[serde(skip_serializing_if = "Option::is_none")] pub common_tray_icon: Option, @@ -391,6 +394,7 @@ impl IVerge { traffic_graph: Some(true), enable_memory_usage: Some(true), enable_group_icon: Some(true), + pause_render_traffic_stats_on_blur: Some(true), #[cfg(target_os = "macos")] tray_icon: Some("monochrome".into()), menu_icon: Some("monochrome".into()), @@ -478,6 +482,7 @@ impl IVerge { patch!(traffic_graph); patch!(enable_memory_usage); patch!(enable_group_icon); + patch!(pause_render_traffic_stats_on_blur); #[cfg(target_os = "macos")] patch!(tray_icon); patch!(menu_icon); diff --git a/src/components/home/enhanced-canvas-traffic-graph.tsx b/src/components/home/enhanced-canvas-traffic-graph.tsx index a3d7dd992..3b0a1ded1 100644 --- a/src/components/home/enhanced-canvas-traffic-graph.tsx +++ b/src/components/home/enhanced-canvas-traffic-graph.tsx @@ -13,6 +13,7 @@ import { import { useTranslation } from 'react-i18next' import { useTrafficGraphDataEnhanced } from '@/hooks/use-traffic-monitor' +import { useVerge } from '@/hooks/use-verge' import { debugLog } from '@/utils/debug' import parseTraffic from '@/utils/parse-traffic' @@ -105,6 +106,9 @@ export const EnhancedCanvasTrafficGraph = memo( }: EnhancedCanvasTrafficGraphProps) { const theme = useTheme() const { t } = useTranslation() + const verge = useVerge() + const pause_render_traffic_stats_on_blur = + verge.verge?.pause_render_traffic_stats_on_blur ?? true // 使用增强版全局流量数据管理 const { dataPoints, requestRange, samplerStats } = @@ -227,7 +231,7 @@ export const EnhancedCanvasTrafficGraph = memo( const highResNow = getNow() lastRenderTimeRef.current = highResNow - if (focused) { + if (focused || !pause_render_traffic_stats_on_blur) { resumeCooldownRef.current = Date.now() const controller = fpsControllerRef.current const resumeTarget = Math.max( @@ -242,7 +246,7 @@ export const EnhancedCanvasTrafficGraph = memo( resumeCooldownRef.current = 0 } }, - [setIsWindowFocused, setCurrentFPS], + [setIsWindowFocused, setCurrentFPS, pause_render_traffic_stats_on_blur], ) useEffect(() => { @@ -985,7 +989,7 @@ export const EnhancedCanvasTrafficGraph = memo( // 受控的动画循环 useEffect(() => { if ( - !isWindowFocused || + (!isWindowFocused && pause_render_traffic_stats_on_blur) || displayData.length === 0 || dataStaleRef.current ) { @@ -998,7 +1002,7 @@ export const EnhancedCanvasTrafficGraph = memo( } const animate = (currentTime: number) => { - if (!isWindowFocusedRef.current) { + if (!isWindowFocusedRef.current && pause_render_traffic_stats_on_blur) { lastRenderTimeRef.current = getNow() animationFrameRef.current = undefined return @@ -1046,7 +1050,13 @@ export const EnhancedCanvasTrafficGraph = memo( animationFrameRef.current = undefined } } - }, [drawGraph, displayData.length, isWindowFocused, collectFrameSample]) + }, [ + drawGraph, + displayData.length, + isWindowFocused, + pause_render_traffic_stats_on_blur, + collectFrameSample, + ]) // 切换时间范围 const handleTimeRangeClick = useCallback((event: React.MouseEvent) => { diff --git a/src/components/setting/mods/layout-viewer.tsx b/src/components/setting/mods/layout-viewer.tsx index cc8f91a1b..e96ffa631 100644 --- a/src/components/setting/mods/layout-viewer.tsx +++ b/src/components/setting/mods/layout-viewer.tsx @@ -189,6 +189,28 @@ export const LayoutViewer = forwardRef((_, ref) => { + + + + onChangeData({ pause_render_traffic_stats_on_blur: e }) + } + onGuard={(e) => + patchVerge({ pause_render_traffic_stats_on_blur: e }) + } + > + + + +