fix(stage-web): improve performance visualizer (#2344)

2026-08-23 05:23:03 +08:00
parent 273cbd338a
commit 30eeb8bd40
11 changed files with 537 additions and 184 deletions
@@ -1542,7 +1542,7 @@ pages:
            section:
              performance-visualizer:
                title: Performance Visualizer
-                description: Toggle FPS/long task/memory overlay
+                description: Show FPS, frame time, long tasks, and supported browser memory metrics
              markdown-stress:
                title: Markdown Stress
                description: Stress markdown parsing and rendering with heavy chat payloads
@@ -57,7 +57,41 @@ devtools:
      title: Lag Visualizer
    performance-visualizer:
      title: Performance Visualizer
-      description: Toggle FPS/long task/memory overlay
+      description: Inspect live performance metrics and runtime diagnostics
+      controls:
+        enable-all:
+          label: Enable all available metrics
+          description: Enable each metric that this browser supports.
+        start-recording: Start recording
+        stop-recording: Stop recording ({seconds}s)
+        export-last-recording: Export last recording
+      metrics:
+        fps:
+          label: FPS
+          description: Frames per second during the last 10 seconds.
+        frame-duration:
+          label: Frame time (ms)
+          description: Time between animation frames during the last 10 seconds.
+        long-task:
+          label: Long tasks
+          description: Main-thread tasks that take at least 50 ms.
+          unsupported: This browser does not expose long-task timing.
+        memory:
+          label: JS heap (MB)
+          description: JavaScript heap usage from Chromium's performance.memory API.
+          unsupported: This browser does not expose JavaScript heap usage.
+      recording:
+        title: Last recording
+        duration: Duration {duration} ms
+        limit: Recording stops after 60 seconds.
+      overlay:
+        title: Performance
+        move: Move performance overlay
+        reset-position: Reset overlay position
+        record: Record
+        stop: Stop
+        export: Export last recording
+        average: avg
    markdown-stress:
      title: Markdown Stress
      description: Stress markdown parsing and rendering with heavy chat payloads
@@ -1476,7 +1476,7 @@ pages:
            section:
              performance-visualizer:
                title: 性能可视化工具
-                description: 切换 FPS/长任务/内存叠加
+                description: 显示 FPS、帧时间、长任务和浏览器支持的内存指标
              markdown-stress:
                title: Markdown Stress
                description: 用大量聊天负载来测试 Markdown 的解析和渲染能力
@@ -57,7 +57,41 @@ devtools:
      title: Lag 可视化
    performance-visualizer:
      title: 性能可视化
-      description: 切换 FPS/长任务/内存叠加
+      description: 检查实时性能指标和运行时诊断数据
+      controls:
+        enable-all:
+          label: 启用所有可用指标
+          description: 启用当前浏览器支持的所有指标。
+        start-recording: 开始录制
+        stop-recording: 停止录制（{seconds} 秒）
+        export-last-recording: 导出上次录制
+      metrics:
+        fps:
+          label: FPS
+          description: 最近 10 秒内的每秒帧数。
+        frame-duration:
+          label: 帧时间（毫秒）
+          description: 最近 10 秒内动画帧之间的时间。
+        long-task:
+          label: 长任务
+          description: 耗时至少 50 毫秒的主线程任务。
+          unsupported: 当前浏览器不提供长任务计时。
+        memory:
+          label: JS 堆（MB）
+          description: Chromium performance.memory API 提供的 JavaScript 堆用量。
+          unsupported: 当前浏览器不提供 JavaScript 堆用量。
+      recording:
+        title: 上次录制
+        duration: 时长 {duration} 毫秒
+        limit: 录制会在 60 秒后停止。
+      overlay:
+        title: 性能
+        move: 移动性能浮窗
+        reset-position: 重置浮窗位置
+        record: 录制
+        stop: 停止
+        export: 导出上次录制
+        average: 平均
    markdown-stress:
      title: Markdown 压力测试
      description: 用大量聊天负载来测试 Markdown 的解析和渲染能力