|
444 | 444 | }); |
445 | 445 | }); |
446 | 446 | }, |
| 447 | + // 合并同一帧内的 WebSocket 状态消息,避免高频重复渲染 |
| 448 | + queueServerLiveStatusUpdate(wsData) { |
| 449 | + this._pendingWsData = wsData; |
| 450 | + if (this._wsUpdateQueued) return; |
| 451 | + this._wsUpdateQueued = true; |
| 452 | + requestAnimationFrame(() => { |
| 453 | + this._wsUpdateQueued = false; |
| 454 | + const pending = this._pendingWsData; |
| 455 | + this._pendingWsData = null; |
| 456 | + if (pending) { |
| 457 | + this.updateServerLiveStatus(pending); |
| 458 | + } |
| 459 | + }); |
| 460 | + }, |
447 | 461 | areSimpleArraysEqual(a, b) { |
448 | 462 | if (a === b) return true; |
449 | 463 | if (!Array.isArray(a) || !Array.isArray(b)) return false; |
|
759 | 773 |
|
760 | 774 | const wsServer = serverMap.get(serverItem.ID); |
761 | 775 | if (wsServer) { |
762 | | - // 更新服务器状态 |
| 776 | + // 更新服务器状态(只在关键字段有实际变化时才触发响应式更新) |
763 | 777 | if (wsServer.State) { |
764 | | - const oldState = serverItem.State; |
765 | | - serverItem.State = { |
766 | | - ...oldState, |
767 | | - ...wsServer.State |
768 | | - }; |
769 | | - hasUpdates = true; |
| 778 | + const oldState = serverItem.State || {}; |
| 779 | + const s = wsServer.State; |
| 780 | + const stateChanged = |
| 781 | + oldState.CPU !== s.CPU || |
| 782 | + oldState.MemUsed !== s.MemUsed || |
| 783 | + oldState.DiskUsed !== s.DiskUsed || |
| 784 | + oldState.NetInSpeed !== s.NetInSpeed || |
| 785 | + oldState.NetOutSpeed !== s.NetOutSpeed || |
| 786 | + oldState.NetInTransfer !== s.NetInTransfer || |
| 787 | + oldState.NetOutTransfer !== s.NetOutTransfer || |
| 788 | + oldState.Uptime !== s.Uptime || |
| 789 | + oldState.ProcessCount !== s.ProcessCount || |
| 790 | + oldState.TcpConnCount !== s.TcpConnCount || |
| 791 | + oldState.UdpConnCount !== s.UdpConnCount || |
| 792 | + oldState.Load1 !== s.Load1; |
| 793 | + if (stateChanged) { |
| 794 | + serverItem.State = { ...oldState, ...s }; |
| 795 | + hasUpdates = true; |
| 796 | + } |
770 | 797 | } |
771 | 798 |
|
772 | 799 | // 更新Host信息(服务器重启后CPU、内存等配置可能变化) |
|
1202 | 1229 | return; |
1203 | 1230 | } |
1204 | 1231 |
|
1205 | | - // 处理服务器状态更新 |
| 1232 | + // 处理服务器状态更新(按帧合并,减少高频重复渲染) |
1206 | 1233 | if (data.servers && Array.isArray(data.servers)) { |
1207 | | - if (window.statusCards) { |
| 1234 | + if (window.statusCards && typeof window.statusCards.queueServerLiveStatusUpdate === 'function') { |
| 1235 | + window.statusCards.queueServerLiveStatusUpdate(data); |
| 1236 | + } else if (window.statusCards) { |
1208 | 1237 | window.statusCards.updateServerLiveStatus(data); |
1209 | 1238 | } |
1210 | 1239 | } |
|
0 commit comments