实时仪表盘与 WebSocket
Real-time Dashboard & WebSocket
通过 WebSocket 实时推送 Agent 运行状态到前端仪表盘实现可视化监控
子问题
1.WebSocket 连接管理与广播
2.文件变更监听与增量推送
3.排行榜与经济指标聚合
4.产物预览与终端日志回放
5.双模式部署(实时 WebSocket + 静态 JSON)的 API 抽象
6.余额变化方向检测与行级闪烁动画
各项目的解法1 solutions
Signals
横向对比
| 维度 | ClawWork |
|---|---|
| 推送协议 | FastAPI WebSocket + ConnectionManager 单例广播 |
| 数据源 | JSONL 文件 + mtime 轮询(1 秒间隔) |
| 连接管理 | List 存储 + broadcast 静默忽略失败 + 无心跳 |
| 前端更新策略 | WebSocket 通知触发 REST 全量刷新 + 定时轮询兜底 |
| 部署模式 | 双模式:live WebSocket + GitHub Pages 静态 JSON |
| 可视化维度 | 排行榜 + 经济仪表盘 + 任务列表 + 产物预览 + 终端日志回放 |
最佳实践
1.用 JSONL 文件作为数据源配合文件监听实现轻量级实时推送
2.WebSocket 仅推通知信号,前端收到后自行 REST 全量刷新,避免 WebSocket 传输大量数据
3.前端定时轮询作为 WebSocket 断线兜底,确保数据最终一致