一个全栈工程师的业余项目:我用 Taro 做了一个马拉松备赛小程序

作为一个全栈工程师,我最得意的业余项目不是某个技术 Demo,而是一个给我自己和身边跑者用的微信小程序——赛迹攻略。本文记录从痛点到产品的全过程。

为什么要做这个

我跑崩过一次全马和两次半马。

2023 年合肥全程马拉松,前半程按 330 配速跑,自我感觉良好,30km 后开始掉速,35km 彻底崩了,最后 3:51:42 完赛。

同年池州半程马拉松,前半程按 135 配速跑,后半程一路掉速,最后 1:40:30 完赛。

2024 年又跑了一场半马,比赛前两周训练量骤降、状态没调过来,前 10km 还能跟上配速组,20km 后心率直接飙到 185+,最后也是咬着牙走跑结合完赛。

三次比赛说明同一个问题:赛前训练不系统,跑量和训练结构都不合理。之前就是瞎跑,看心情出门,没有 VDOT 概念,没有配速区间,不知道自己该跑 E 轻松还是 T 阈值。

雪上加霜的是 2025 年因为工作原因停跑了整整一年。

2026 年 4 月重新开始恢复跑,加入了乐跑运动俱乐部跟着系统训练。这时候我发现市面上的跑步 APP 都有一个共同问题:它们擅长记录,不擅长指导。

Keep、悦跑圈、咕咚能帮我记录每次跑步的配速、心率、路线。但我真正需要的是:

  • 我的 VDOT 是多少? 这个能力指数应该决定我该用什么配速区间训练。
  • 按 Daniels 训练法,16 周全马备赛计划应该怎么排?
  • 目标赛事的赛道有多少上坡?35km 那个连续爬坡应该放慢多少秒?
  • 配速、步频、步幅之间是什么数学关系?我的步频是不是太低了?
  • 跟乐跑的跑友想约周末长距离,怎么组织报名?

这些问题没有一个 APP 能同时解决。所以我跟着乐跑系统训练的时候,先给自己写了这个工具——帮我算 VDOT、生成 16 周 Daniels 计划、算配速策略。跑团里其他朋友觉得好用,就陆续提了跑团管理、赛道攻略、步态换算等需求。

于是就有了赛迹攻略。

2026 年的目标很简单:半马小幅刷新 PB 到 1:38 左右,全马小幅刷新 PB 到 3:30 左右。不追求大跨步,科学训练,稳步提升。

为什么选 Taro

技术选型的核心考量是:不想被微信生态绑死。

1
技术栈:Taro 4 + React 18 + TypeScript + 微信云开发

Taro 的设计哲学是「一处代码,多端运行」。写 React,编译出来能跑:

  • 微信小程序 ✅(现在的主力)
  • H5 网页 ✅(已支持)
  • React Native(iOS / Android)✅(已支持)
  • 鸿蒙 HarmonyOS NEXT ✅(Taro 4.x 原生支持)
  • 支付宝 / 抖音小程序 ✅(已支持)

这个选择让我从第一天起就可以安心写业务逻辑,不用纠结以后要不要重写。微信云开发选的是纯 Node.js 环境——和我平时写后端的技术栈一致,没什么学习成本。

功能一:步态工具

这是我自己每天都在用的功能。

1
配速(秒/km)= 60000 ÷(步频 × 单步步长)

任意两个变量就能算出第三个。输入 5’00” 配速 + 180 步/分钟 → 步幅自动算出来是 1.11 米。输入配速 + 步幅 → 算出建议步频。

更进一步,我加了「保持配速,调整步频」的模拟:

1
2
配速 5'00",步频 160 → 步幅 1.25m
同配速,步频 +10%(176)→ 步幅自动缩短到 1.14m

这直接回答了「我想提高步频但不想变慢怎么办」—— 答案就是缩短步幅,这是数学决定的,不是玄学。

还有触地时间和腾空时间的估算模型。输入步频和触地时间 → 算出每次腾空多久、触地占步态周期的比例。公式参考 Garmin Running Dynamics Pod 说明书和一篇 2021 年的研究(PMID 20581720)。

功能二:Daniels VDOT 训练计划

Jack Daniels 博士的 VDOT 体系是跑步科学的基石。VDOT(V˙O₂ max derived running pace)把你的耐力能力量化成一个数字(30~80),每个 VDOT 对应五个配速区间:

区间 名称 用途
E 轻松跑 基础有氧、恢复
M 配速跑 模拟目标配速、提高经济性
T 阈值跑 提高乳酸阈值
I 间歇跑 提高 VO2 max
R 重复跑 提高速度

我的小程序做的事很简单:输入你的最近一场比赛成绩 → 用运动科学论文里的公式算出 VDOT → 自动生成 16 周训练计划。

训练计划每周自动排好:周一休息、周二 E 轻松、周三 I 间歇、周四休息、周五 T 阈值、周六 M 配速、周日休息。赛前两周 taper 自动减量到 40%。

功能三:配速策略

输入目标完赛时间和目标赛事 → 输出逐公里配速计划。

比普通配速计算器多两个关键修正:

坡度修正:如果赛道 35km 处有 1.2km 连续上坡 → 那一段配速自动加 10 秒。
天气修正:赛前 3 天自动拉取赛事当地天气。如果 30°C 高温 → 全程配速加 15 秒。
耐力衰减系数:根据你的历史完赛记录和近 30 天训练配速,算出后程掉速能力,自动调整 30km 以后的配速目标。

功能四:赛道可视化

用 Canvas 把海拔剖面和路线图画出来。

  • 海拔剖面:红色是上坡、绿色是下坡、灰色是平坦,拖动可以看每公里的海拔和均坡
  • 路线图:经纬度投影到 Canvas,标记起点、终点、补给站、方向箭头、公里标记
  • 赛道难度评分:基于总爬升 + 平均坡度 + 最陡段综合打分

功能五:跑团管理

小程序有完整的跑团套件:

  • 创建 / 加入跑团(邀请码)
  • 角色体系(团长 / 副团长 / 普通成员,副团长数量无上限)
  • 活动发布(配速分组:轻松 / 节奏 / 阈值)
  • 活动备注(”只跑前 10 公里”)
  • 可信度积分体系(每日登录 +1、完赛 +2、训练 +1、推荐 +2、点赞 +1,防刷)
  • 跑团排行榜、跑团地图、完赛自动汇总

架构上的几个决定

云函数模块化:一开始我把所有逻辑塞在一个 500 行的 user/index.js 里。后来拆成了 9 个子模块(group-service / group-logic / event-logic / finish-records 等)+ 7 个单元测试文件。

Services 统一调用层:services/cloud.ts 封装了云函数调用。微信环境走 Taro.cloud.callFunction,H5 环境自动 import '../data/${name}' 从本地 mock 数据导入 —— 前端开发不需要依赖真实云函数。

功能开关前置:config/features.ts 里把积分、会员、广告全部默认关闭。这样先上功能,按需开启。

分包:主包控制在 660KB(微信限制 1.5MB),其余 21 个页面分包按需下载。

踩过的坑

鸿蒙剪贴板权限:HarmonyOS NEXT 系统级管控了剪贴板权限,默认不允许微信小程序访问。用户需要手动去「设置 → 隐私 → 剪贴板」里允许微信。代码层面没什么好办法,只能提供长按选中文本手动复制的兜底路径。

getFuzzyLocation 未授权:这个坑我掉了两次。微信 2023 年起位置 API 需要三重配置:代码里写 permission、后台配隐私协议、申请接口权限并发布版本。缺了哪一层都报 -80424。

分包主包大小:比赛详情页逻辑多(海拔图 + 地图 + 推荐 + 跑团关联),单独就 600KB。必须分包,不然主包超 1.5MB 限制上传失败。

怎么用

微信小程序搜「赛迹攻略」。

开发者微信:LIFELIVELEARN

有任何功能建议、赛道数据错误、想合作推广,都欢迎加我微信聊。


本文首发于 Bit Garden — 一个全栈工程师的个人笔记。

实用小软件

  • Snipaste:截图

    • f1截图,f1+fn
    • f3定在屏幕上,f3+fn
    • 取色:shift切换
  • ZoomIt:画笔

    • ctrl+1放大
    • Ctrl+2画图
    • 画图时按住Ctrl是矩形
    • 画图时按住tab是椭圆
    • 画图时按字母切换画笔颜色。r红色、b蓝色、g绿色、p粉色、o橙色
  • XMind:思维导图

    • enter同级
    • tab下级
  • Typora:Markdown

    • 主题可下载

VS Code 实用小记

VSCode插件:

  • Error Lens:报错
  • One Dark Pro:颜色主题
  • Live Server :实时预览,左右分屏
  • Auto Rename Tag:修改名字
  • Open In Browser:浏览器中打开
  • VSCode Icons:设置文件图标
  • Easy Less:less编译
  • CSSREM

vscode快捷键:

shift+alt+下箭头(上箭头):复制一行

ctrl+d:选中多个相同的单词

ctrl+alt+下箭头(上箭头):添加多个光标

ctrl+h:全局替换某个单词

ctrl+g:跳转到指定的某一行

shift+alt+鼠标选中:选中某一区块