f1-dash：把 F1 实时数据搬上副屏的开源仪表盘

f1-dash把 F1 实时数据搬上副屏的开源仪表盘【免费下载链接】f1-dashA real-time F1 dashboard项目地址: https://gitcode.com/GitHub_Trending/f1/f1-dashf1-dash是一个开源的F1 实时数据仪表盘后端直接订阅 F1 官方直播计时接口前端把排名、圈速差距、轮胎、迷你赛段、天气、赛事消息、车队无线电全部摊在一张看板上。整套系统由 Next.js 前端和一个 Rust 工作区组成还附带数据录制与回放工具非比赛日也能完整复现一场赛事的数据流。项目定位 看直播时你可能已经注意到几个问题官方画面比真实比赛慢上几秒解说只会报前三你想盯自己的车队换胎时机、某个赛段被对手拿走多少却没有任何渠道。f1-dash 的思路很直接——既然 F1 官方本来就对浏览器开放直播计时流那就把它接回来重组成一块自己说了算的副屏。它读取的是livetiming.formula1.com的 SignalR WebSocket 数据前端负责呈现中间不经过任何第三方转发。仪表盘能力全景按页面模块划分看板覆盖四类信息对应 dash/src/components/ 下的组件目录计时与排名LeaderBoard 实时排名、LapCount 圈数、Qualifying 排位成绩与分段详情单台赛车细节DriverCarMetrics.tsx 的油门/刹车踏板、DriverDRS.tsx 的 DRS 开关、DriverTire.tsx 的当前轮胎与 DriverHistoryTires.tsx 的换胎历史、DriverGap 的圈速差距赛道与事件Map.tsx 上的车手位置点、RaceControl.tsx 赛事消息、TeamRadios.tsx 车队无线电、WeatherInfo.tsx 天气与 TrackStatus 赛道旗语赛事安排dash/src/app/(nav)/schedule//schedule/) 的赛季日程、下一轮倒计时、赛周末时间表。数据更新由 ConnectionStatus.tsx 显示连接状态SessionInfo.tsx 标注当前场次。架构拆解一条 SSE 管道串起前后端前端dash/package.json 里能看清栈Next.js 15、React 18、Zustand 管状态、Tailwind 写样式。浏览器不直连 F1 官方而是订阅后端live服务推的 SSE 流先推一份 deflate 压缩的初始全量状态前端用 pako 解压见 inflate.ts之后只推增量消息另有 10 秒心跳保活。后端Rust 工作区定义在 Cargo.toml六个 crate 各司其职crates/live/核心服务。连上 F1 官方 WebSocket或指向 simulator持续合并消息、维护全量状态再以 SSE 吐给浏览器实现见 live.rscrates/api/解析 ical 赛程文件输出当前赛季日程的 JSONcrates/data/消息模型、压缩与合并逻辑compression.rs 与 merge.rscrates/client/共享的 SignalR 客户端consts.rs 里列出了订阅的 18 个数据主题包括 CarData、Position、TimingData、WeatherData、TrackStatus、RaceControlMessages、TeamRadio、SessionInfo 等。一句话概括数据链路F1 官方 WebSocket →live合并维护状态 → SSE 推给浏览器赛程走独立的api服务。前端只消费 HTTP/SSE两条通道互不干扰。三种落地场景观赛副屏电视播比赛另一块屏跑 f1-dash投屏给一起看车的朋友——差距是 0.2 秒还是 1.5 秒一眼可见赛后复盘用saver录下的比赛文件配合simulator回放下文有讲逐段回看某次进站前后的节奏变化学习素材一条WebSocket 接入 → 状态合并 → SSE 下发的完整管道代码量不大适合照着读懂真实遥测数据是怎么落地的。三步跑通本地环境环境要求Node推荐 nvm、yarncorepack、Rust推荐 rustup。本地开发要开 4 个终端前端、live、api、可选的 simulatoryarn dev、cargo r -p live、cargo r -p api分别启动。嫌麻烦可以直接上容器docker compose updocker-compose.yaml 会把三个服务一次拉起前端 3000、live 4000、api 4001。完整步骤含 .env 配置与构建命令见 CONTRIBUTING.md。非比赛时段如何模拟数据源比赛一周只有一两天剩下的日子怎么调页面项目内置了一对录制 回放工具见 crates/saver/ 与 crates/simulator/saver连接 F1 官方 WebSocket把消息逐条写进本地文件cargo r -p saver 文件名一场赛事录下来就是一个.data.txtsimulator读取录制文件逐行还原成 WebSocket 流对外提供。live服务可以直接连它前端无感知地重新比赛。这套组合的意义在于任何依赖实时数据的改动作都可以拿到确定、可重复的输入。参与社区项目是社区作品与 F1 官方无关联见 README.md 的声明。想动手的话GitHub issues 里标记为 Good First Issue 的问题是推荐入口分支走 git flow 风格命名提交信息遵循 conventional commits具体流程在 CONTRIBUTING.md 里有完整说明。【免费下载链接】f1-dashA real-time F1 dashboard项目地址: https://gitcode.com/GitHub_Trending/f1/f1-dash创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考