ivarvong/lantern

解决什么问题

想用动画讲清楚一段代码改动——比如缓存怎么出现、箭头怎么重画——通常只能上 manim：Python 环境、LaTeX 相关工具链、Cairo/ffmpeg 渲染管线一整套。或者手写 SVG 关键帧，但没人能拖动到中间某一帧。两条路都给不了你"这个场景第 3 步"的 URL。Lantern 用零依赖 TypeScript 重写了 manim 的场景模型，把每一步变成可寻址、确定性的帧，于是一段讲解可以是一条链接、一段文本或一份 JSON trace。

有什么不同

常见做法是 manim 做程序化动画，或用 After Effects/Premiere 这类时间线软件手工合成。Lantern 更靠近 manim，但砍掉了视频渲染：输出是 SVG，取 t 时刻的帧靠跳帧重跑场景，测试断言它与完整播放逐字节一致。真正拉开差距的有三点：文本用内嵌字形轮廓，不依赖系统安装的字体，逐字母 Write 和字形间 Transform 都精确；场景有文本形式和结构化 trace（?scene=&step= 深链、trace.json），明显是冲着 agent 去的；还能解析 Mermaid 流程图并把它当形状来动画。代价是范围：没有 3D、没有 LaTeX、Transform 字形按序号配对而非按形状，超出 2D 示意图动画很快就到边界。

适合谁

写代码技术讲解、希望把动画放进仓库做版本管理而不是在视频软件里拼的开发者，尤其是想从 Worker 出帧、要每一步可链接可追踪的场景。追求精致品牌动效、3D 场景或排版复杂的演示文稿的人，还是用 manim 或正经视频工具。想多人协作编辑的团队也别来——README 明说 trace 和文档格式虽然可 diff，但还没有任何同步机制。

上手成本

没上 npm，得 clone 仓库；依赖 Node 24 的 .ts 类型剥离，测试和基于 Chromium 的播放校验走 playwright-core。"零运行时依赖"是真的，但开发环节要求完整本地工具链（多项目 tsc、esbuild、部署用 wrangler）。MIT 协议。README 信息密度很高，把点缓冲区、贝塞尔模型、确定性 seek 乃至"暂不做"清单都写清楚了，诚实，但也要求你认真读完再动手。

点评

项目目前只有一天大，已经日均涨约 184 星，在 HotRepo 的新 TypeScript 榜排到第 2——这是发布冲高，不是长期战绩；它没上过 GitHub Trending 日榜，也没有 Hacker News 讨论，关注真实但窄且未经验证。设计上很有主张，确定性与测试的严谨程度超过多数同体量动画库，对长期维护是好兆头；眼下最大的摩擦是没发包和场景 API 偏小。如果"可链接的代码动画讲解"就是你的工作，值得一看；只是想要示意图的话，等它上 npm、示例多一些再说。