A:增加Gzip压缩

src/NetVizor.Frontend/package.json

@@ -17,6 +17,7 @@
     "@vicons/ionicons5": "^0.13.0",
     "axios": "^1.10.0",
     "gsap": "^3.13.0",
+    "pako": "^2.1.0",
     "pinia": "^3.0.1",
     "unplugin-auto-import": "^19.3.0",
     "unplugin-vue-components": "^28.7.0",

src/NetVizor.Frontend/pnpm-lock.yaml

@@ -17,6 +17,9 @@ importers:
       gsap:
         specifier: ^3.13.0
         version: 3.13.0
+      pako:
+        specifier: ^2.1.0
+        version: 2.1.0
       pinia:
         specifier: ^3.0.1
         version: 3.0.2(typescript@5.8.3)(vue@3.5.14(typescript@5.8.3))
@@ -1800,6 +1803,9 @@ packages:
   package-json-from-dist@1.0.1:
     resolution: {integrity: sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==, tarball: https://registry.npmmirror.com/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz}
 
+  pako@2.1.0:
+    resolution: {integrity: sha512-w+eufiZ1WuJYgPXbV/PO3NCMEc3xqylkKHzp8bxp1uW4qaSNQUkwmLLEc3kKsfz8lpV1F8Ht3U1Cm+9Srog2ug==}
+
   parent-module@1.0.1:
     resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==, tarball: https://registry.npmmirror.com/parent-module/-/parent-module-1.0.1.tgz}
     engines: {node: '>=6'}
@@ -4133,6 +4139,8 @@ snapshots:
 
   package-json-from-dist@1.0.1: {}
 
+  pako@2.1.0: {}
+
   parent-module@1.0.1:
     dependencies:
       callsites: 3.1.0

src/NetVizor.Frontend/src/App.vue

@@ -146,42 +146,44 @@ const getLayout = (route) => {
     :theme-overrides="themeStore.themeOverrides"
     :theme="themeStore.theme"
   >
-    <n-global-style />
+    <n-message-provider>
+      <n-global-style />
 
-    <!-- 可拖动的导航栏 -->
-    <div
-      v-if="isShowGenerateRouter"
-      ref="navRef"
-      class="nav-container"
-      :style="{ left: `${navPosition.x}px`, top: `${navPosition.y}px` }"
-      @mousedown="startDrag"
-    >
-      <div class="drag-handle">
-        <span class="drag-icon">≡</span>
+      <!-- 可拖动的导航栏 -->
+      <div
+        v-if="isShowGenerateRouter"
+        ref="navRef"
+        class="nav-container"
+        :style="{ left: `${navPosition.x}px`, top: `${navPosition.y}px` }"
+        @mousedown="startDrag"
+      >
+        <div class="drag-handle">
+          <span class="drag-icon">≡</span>
+        </div>
+        <ul class="route-list">
+          <li v-for="(subRoute, index) in subRouteLists" :key="index" class="route-item">
+            <n-button
+              :type="isActive(subRoute.path) ? 'primary' : 'default'"
+              @click="listClickJump(subRoute)"
+            >
+              {{ subRoute.displayName }}
+            </n-button>
+          </li>
+        </ul>
       </div>
-      <ul class="route-list">
-        <li v-for="(subRoute, index) in subRouteLists" :key="index" class="route-item">
-          <n-button
-            :type="isActive(subRoute.path) ? 'primary' : 'default'"
-            @click="listClickJump(subRoute)"
-          >
-            {{ subRoute.displayName }}
-          </n-button>
-        </li>
-      </ul>
-    </div>
 
-    <!-- 展示主要内容 -->
-    <div class="main-content">
-      <router-view v-slot="{ Component, route }">
-        <transition name="fade-slide" mode="out-in">
-          <component :is="getLayout(route)">
-            <component :is="Component" />
-          </component>
-        </transition>
-      </router-view>
-<!--      <network-connection-panel2/>-->
-    </div>
+      <!-- 展示主要内容 -->
+      <div class="main-content">
+        <router-view v-slot="{ Component, route }">
+          <transition name="fade-slide" mode="out-in">
+            <component :is="getLayout(route)">
+              <component :is="Component" />
+            </component>
+          </transition>
+        </router-view>
+        <!--      <network-connection-panel2/>-->
+      </div>
+    </n-message-provider>
   </n-config-provider>
 </template>
 

src/NetVizor.Frontend/src/utils/websocket.ts

@@ -9,6 +9,7 @@ import CSharpBridgeV2 from '@/correspond/CSharpBridgeV2'
 import { ref, Ref } from 'vue'
 import { logB } from '@/utils/logHelper/logUtils'
 import { useUuidStore } from '@/stores/uuidStore'
+import pako from "pako";
 
 export class WebSocketManager {
   private socket: WebSocket | null = null
@@ -102,10 +103,17 @@ export class WebSocketManager {
       this.startHeartbeat()
     }
 
-    this.socket.onmessage = (event) => {
+    this.socket.onmessage = async (event) => {
       try {
-        const message: WebSocketResponse = JSON.parse(event.data)
-        this.handleMessage(message)
+        const arrayBuffer: ArrayBuffer = event.data instanceof Blob
+          ? await event.data.arrayBuffer()
+          : event.data;
+
+        const uint8Array = new Uint8Array(arrayBuffer);
+        const decompressed = pako.inflate(uint8Array, { to: "string" });
+
+        const json = JSON.parse(decompressed);
+        this.handleMessage(json)
       } catch (error) {
         console.error('Error parsing WebSocket message:', error)
       }

src/NetVizor.Frontend/src/views/MonitorView/MonitorMainPanel.vue

@@ -97,7 +97,7 @@ onMounted(() => {
         // 发送请求【请求订阅软件列表】
         const subAppInfo: SubscriptionProcessInfo = {
           subscriptionType: 'ProcessInfo',
-          interval: 1000,
+          interval: 400,
           processIds: newValue1.processIds,
         }