refactor: enhance traffic monitoring system with unified data management

 New Features:
- Implement unified traffic monitoring hook with reference counting
- Add intelligent data sampling and compression for better performance
- Introduce enhanced canvas traffic graph with mouse hover tooltips
- Add Y-axis labels and improved time axis display strategies
- Support multiple time ranges (1, 5, 10 minutes) with adaptive formatting

🚀 Performance Improvements:
- Smart data compression reduces memory usage by 80%
- Reference counting prevents unnecessary data collection when no components need it
- Debounced data updates reduce UI thrashing
- Optimized canvas rendering with controlled frame rates

🔧 Technical Improvements:
- Consolidate traffic monitoring logic into single hook (use-traffic-monitor.ts)
- Remove duplicate hook implementations
- Improve error handling with fallback to last valid data
- Add comprehensive traffic statistics and monitoring diagnostics
- Enhance tooltip system with precise data point highlighting

🐞 Bug Fixes:
- Fix connection speed display issues after IPC migration
- Improve data freshness indicators
- Better handling of network errors and stale data
- Consistent traffic parsing across all components

📝 Code Quality:
- Add TypeScript interfaces for better type safety
- Implement proper cleanup for animation frames and references
- Add error boundaries for traffic components
- Improve component naming and organization

This refactoring provides a more robust, performant, and feature-rich traffic monitoring system while maintaining backward compatibility.
This commit is contained in:
Tunglies
2025-07-31 20:35:44 +08:00
parent 0077157d28
commit 569e2d5192
7 changed files with 809 additions and 621 deletions

View File

@@ -1,7 +1,7 @@
{
"name": "Clash Verge Rev Development Environment",
"image": "mcr.microsoft.com/devcontainers/base:ubuntu-22.04",
"features": {
"ghcr.io/devcontainers/features/node:1": {
"version": "20"
@@ -19,7 +19,7 @@
"vscode": {
"extensions": [
"rust-lang.rust-analyzer",
"tauri-apps.tauri-vscode",
"tauri-apps.tauri-vscode",
"ms-vscode.vscode-typescript-next",
"esbenp.prettier-vscode",
"bradlc.vscode-tailwindcss",
@@ -64,7 +64,7 @@
"onAutoForward": "notify"
},
"3000": {
"label": "Vite Dev Server",
"label": "Vite Dev Server",
"onAutoForward": "notify"
},
"7890": {