Touch Grass Bingo：浏览器端运行AI的离线趣味应用

一个让你放下手机走出门的AI应用

在AI应用越来越依赖云端算力和海量API调用的今天，开发者 Sanny1921 做了一件反其道而行的事：Touch Grass Bingo。这是一个完全运行在浏览器里的小型Web应用，核心理念简单到有些叛逆——它希望自己成为你一天中停留时间最短的那部分。

使用方式非常直接：输入所在城市或区域，选择可用时间（15分钟到2小时），再挑一个氛围（悠闲散步、拍照寻宝、街头美食与人群、自然与野生动物）。随后一个开放权重的AI模型会为你生成一张5x5的宾果卡，内容类似「找到一只流浪狗」「听到寺庙钟声」「发现一朵花」。中间格子是免费格，连成一条线即为BINGO。

生成完成后，你要做的就是把手机揣进口袋出门，去现实世界里逐格打勾。正如作者所说：「你打开它30秒，然后就离开。」这种设计哲学在当下沉迷式App泛滥的环境里显得尤为珍贵。

Touch Grass Bingo 启动界面

体验地址与开源代码分别托管于 GitHub Pages 和 GitHub 仓库，整个项目作为 Hacktoberfest 开源AI挑战赛的参赛作品发布。

技术栈：浏览器里跑大模型

这个项目最有看点的地方不在功能，而在技术选型。它展示了端侧AI在普通消费设备上的真实可行性。

模型：Llama 3.2 1B Instruct，一个开放权重的小参数模型。
运行时：WebLLM，让模型借助 WebGPU 直接在浏览器内运行。
应用本体：单个纯HTML文件，无框架、无后端、无API密钥，免费托管在 GitHub Pages 上。

首次点击「生成我的卡片」时，浏览器会下载约700MB的模型文件，之后缓存在设备本地。此后所有推理过程都发生在你的手机上，不经过任何服务器。

这种架构的意义值得展开。它意味着没有后端账单、没有运维负担，开发者可以把它永久挂着供所有人免费使用。整个应用就是一个静态文件，这在成本控制上几乎是极限状态。

WebGPU 是浏览器提供的新一代图形与计算接口，于2023年正式在主流浏览器中落地，允许网页直接调用 GPU 的通用计算能力（GPGPU）。相较于它的前身 WebGL，WebGPU 更贴近现代 GPU 驱动模型，计算着色器的支持使其能够高效执行矩阵乘法等神经网络推理所必需的并行运算。WebLLM 正是基于 WebGPU 构建，将模型权重加载进显存后，在 GPU 上完成 token 级别的自回归推理，绕过了传统浏览器沙箱对高性能计算的限制。目前 Chrome 和 Edge 对 WebGPU 的支持最为完善，Safari 和 Firefox 仍在跟进中，这也解释了为何作者特别标注截图来自安卓 Chrome 环境。

Llama 3.2 1B Instruct 是 Meta 于2024年发布的轻量级指令微调模型，专为边缘设备设计。「1B」指约10亿参数，是同系列 70B 模型参数量的1/70。指令微调（Instruction Tuning）使其能够理解自然语言指令并按格式要求输出文本，而非仅续写语料——这是它能读懂「生成一张宾果卡」指令的原因。700MB 的下载体积来自量化压缩，原始 FP32 权重经过 INT4 等低精度量化后大幅缩减，牺牲少量精度以换取可在消费设备上运行的体积。

从v1到v3：小模型工程的真实教训

作者坦诚地记录了通宵开发的踩坑过程，这部分对想做端侧AI的开发者极具参考价值。

v1：严格JSON的失败

最初版本要求模型返回包含24个字符串的JSON数组。模型在手机上加载正常，但不断返回格式损坏的JSON。重试3次后应用放弃，转而显示内置的起始卡片。结果就是——一个「AI应用」其实根本没用上AI。

小参数模型在严格格式化输出上的脆弱性，源于其有限的上下文建模能力。JSON 格式要求模型在生成每一个 token 时都能「记住」自己在整体结构中的位置——括号是否匹配、逗号是否遗漏、字符串是否正确转义。对于70B以上的大模型，这种全局结构感相对稳定；而对于1B模型，长序列中的位置感知能力明显下降，尤其是需要同时生成24个结构相同条目时，累积误差极易导致格式崩溃。这也是为什么生产级系统常借助「结构化输出」或「引导采样」（Guided Decoding）来强制约束小模型的输出格式——通过在解码阶段实时过滤不合法 token，将模型的输出锁定在合法 JSON 的状态机路径上。作者在 v2 中改用编号列表，本质上是降低了格式约束的复杂度，换取了更高的生成成功率。

v2：换契约，换模型

作者意识到1B级别的小模型本就不擅长严格的JSON输出，于是把输出契约改成了普通编号列表（如「1. Spot a street dog」），并写了一个宽容的解析器：忽略编号样式、项目符号、Markdown标记和重复项，剔除无效行。

他还尝试了更大的 Qwen2.5 1.5B，但1GB的下载量在WiFi环境下频繁触发缓存错误。这里有一个关键洞察：在手机上，模型体积本身就是产品的一部分。 这句话道破了端侧AI的现实约束——云端追求的参数规模，在终端场景里可能直接导致不可用。

v3：回归可用性

最终版本回到手机已下载过的 Llama 3.2 1B，保留编号列表格式，并加入了一个「打捞」机制：应用保留3次尝试中的最佳结果，如果模型至少给出14个合格格子，就从起始列表补齐其余格子，而不是全盘丢弃。同时增加了下载重试和可视化进度百分比。

这套组合拳最终跑通了，截图中的卡片就是在作者自己的安卓手机 Chrome 上由模型真实生成的，并非模拟界面。

作者也诚实地指出局限：1B模型写出的格子简单且偏通用（比如「找到一朵花」），它不是旅行指南。更大的模型能生成更锐利、更本地化的内容，这是他有更多时间会首先改进的方向。

为什么开放创新重要

项目在阐述开源与开放权重模型价值时，给出了几个相当实在的理由：

位置信息留在本地：你输入的所在地文本只发给运行在自己手机上的模型，不会上传到他人服务器。隐私天然得到保护。
运行零成本：没有API账单，所以可以永久开放给任何人使用，托管只是一个静态文件。
模型可自由替换：开发过程中作者多次只改一行代码就切换了模型和提示词。若用的是封闭API，就只能被动接受它给出的一切。

这几点恰好构成了开放权重模型相较闭源API的核心竞争力：隐私、成本、可控性。对于独立开发者而言，这三者往往决定一个项目能否长期存活。

「开放权重」（Open Weights）与「开源」（Open Source）是两个层次不同的概念，常被混用但存在实质区别。开放权重指模型的参数文件可以被公开下载和本地运行，但训练代码、数据集或使用许可证可能仍有限制；而真正的开源通常要求训练流程、数据来源乃至商用权限的全面开放。Llama 系列属于开放权重模型——你可以下载并在自己的设备上运行，但 Meta 的许可证对商业规模使用有额外条款。对于本文这类个人开发者场景，这一区别几乎不影响实际使用，但在评估「可自由替换」这一优势时需注意：替换的自由度最终仍受各模型许可证约束，而非完全等同于 Apache 2.0 之类的无限制开源协议。

后续规划与思考

作者列出了下一步计划：允许设备和网络条件较好的用户选择更大的模型；支持保存并分享卡片，让朋友之间在同一张卡上「竞速」；利用时间和天气数据来动态调整卡片内容。

Touch Grass Bingo 本身是个轻巧甚至有点玩笑意味的项目，但它背后的技术验证相当扎实：一个1B参数模型通过WebLLM在普通手机浏览器里完成本地推理，无需后端、无需密钥、零运行成本。这为「端侧AI能做什么、不能做什么」提供了一个诚实的样本。它提醒我们，并非所有AI应用都需要堆砌参数和算力——有时候，让人放下手机走出门，才是最好的产品设计。