进一步优化算法 引入Websocket

public/js/app.js

@@ -305,10 +305,40 @@
 
     loadSiteSettings();
 
-    setInterval(fetchMetrics, REFRESH_INTERVAL);
+    // setInterval(fetchMetrics, REFRESH_INTERVAL); - Now using WebSockets
+    initWebSocket();
     setInterval(fetchNetworkHistory, NETWORK_HISTORY_INTERVAL);
   }
 
+  // ---- Real-time WebSocket ----
+  function initWebSocket() {
+    const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
+    const wsUrl = `${protocol}//${window.location.host}`;
+    const ws = new WebSocket(wsUrl);
+
+    ws.onmessage = (event) => {
+      try {
+        const msg = JSON.parse(event.data);
+        if (msg.type === 'overview') {
+          allServersData = msg.data.servers || [];
+          updateDashboard(msg.data);
+        }
+      } catch (err) {
+        console.error('WS Message Error:', err);
+      }
+    };
+
+    ws.onclose = () => {
+      console.log('WS connection closed. Reconnecting in 5s...');
+      setTimeout(initWebSocket, 5000);
+    };
+
+    ws.onerror = (err) => {
+      // Small silent error here to not alert the user constantly if server is down during maintenance
+      ws.close();
+    };
+  }
+
   // ---- Theme Switching ----
   function toggleTheme() {
     const theme = dom.themeToggle.checked ? 'light' : 'dark';
@@ -507,11 +537,9 @@
                 }
             },
             series: [{
-                type: 'effectScatter',
+                type: 'scatter',
                 coordinateSystem: 'geo',
                 geoIndex: 0,
-                showEffectOn: 'render',
-                rippleEffect: { brushType: 'stroke', scale: 3, period: 6 },
                 symbolSize: 5,
                 itemStyle: {
                     color: '#06b6d4',