问题域/PD-130

实时 Web 仪表盘

Real-time Web Dashboard

基于 Next.js + SSE 的实时 Agent 监控面板,展示 session 状态和 PR 进度

子问题

1.SSE 事件流推送

2.TTL 缓存减少 API 调用

3.attention level 分级

4.session 序列化

5.SSR 首屏与 SSE 增量更新的数据一致性协调

6.PR enrichment 超时保护与部分降级

7.动态 favicon 健康度可视化

各项目的解法1 solutions

Signals

横向对比

维度AgentOrchestrator
推送机制ReadableStream SSE + 5s setInterval 轮询,非事件驱动
缓存策略TTLCache 双 TTL:正常 5min,rate limited 60min
注意力分级六级分区(merge/respond/review/pending/working/done)按人类 ROI 排序
降级策略Promise.allSettled 过半判定 + 部分结果应用 + rate limit blocker 标记
首屏策略Next.js SSR + enrichment 超时保护(metadata 3s, PR 4s)
健康度可视化DynamicFavicon 三色(green/yellow/red)+ StatusLine 统计

最佳实践

1.TTL 缓存 PR enrichment 数据减少 GitHub API 限流

2.globalThis 缓存服务单例适配 Next.js HMR

3.SSE 心跳用注释格式(冒号开头)不触发客户端 onmessage

4.Promise.allSettled 过半判定实现部分降级而非全部失败

5.rate limit 时自动延长缓存 TTL 到 API 限流重置周期