手机上用Claude Code开发iNaturalist观察记录工具：Git Scraping无服务器架构实战

Simon Willison 在一次露营旅行中，仅用手机和 Claude Code 就完成了一个完整的自然观察记录展示工具。这个项目不仅展示了 AI 编程助手在移动端的实际可用性，更呈现了一套值得借鉴的轻量级数据管道设计思路。

项目背景：整合分散的iNaturalist观察数据

iNaturalist 是全球最大的公民科学平台之一，由加州科学院和国家地理学会联合运营，截至2024年已积累超过2亿条观察记录，覆盖超过40万个物种。用户可以上传野外观察到的动植物照片，由社区协助鉴定物种。平台采用众包鉴定机制——用户上传照片后，社区成员和AI模型（基于计算机视觉训练）共同协助物种识别，当多位专家达成一致时，记录被标记为"研究级别"（Research Grade），可被学术机构直接引用。该平台提供完善的 RESTful API，允许开发者按用户、地理范围、分类群等维度查询数据，返回包含物种信息、GPS坐标、时间戳和多分辨率图片URL的JSON结构。

Simon Willison 在该平台上有两个独立账户，他希望将两个账户的观察记录整合到一起，并按时间和地点分组展示。

需求看似简单，但涉及数据获取、聚合处理、持久化存储和前端展示等多个环节。而整个开发过程是在露营期间，完全在手机上通过 Claude Code for web 完成的。Claude Code 是 Anthropic 推出的AI编程代理工具，最初以终端命令行形式运行，后来扩展到Web端。与传统的AI代码补全工具（如GitHub Copilot）不同，Claude Code 更接近一个"对话式开发伙伴"——开发者描述需求，AI生成完整的代码文件、项目结构甚至配置文件。这种交互模式天然适合移动端，因为它将大量键盘输入替换为自然语言描述，极大降低了在小屏幕上编程的摩擦。

技术架构：三层无服务器数据管道

整个项目的架构分为三个层次，每一层都尽可能保持简单。

Python CLI：数据获取与聚团处理

Simon 构建了一个名为 inaturalist-clumper 的 Python 命令行工具，负责从 iNaturalist API 拉取观察记录，并按时空邻近度进行"聚团"（clumping）。默认规则是：2小时内、5公里范围内的观察记录归为同一组。

聚团本质上是一种基于密度的时空聚类算法，与数据科学中经典的 DBSCAN 算法思路相似。DBSCAN 通过定义邻域半径（eps）和最小点数来发现任意形状的簇，而 Simon 的实现更为简化——仅使用时间窗口和空间半径两个阈值，将满足条件的观察记录归入同一组。地理距离的计算通常采用 Haversine 公式，该公式基于球面三角学，能根据两点的经纬度精确计算地球表面的大圆距离。这种简化的聚类方式避免了复杂的机器学习依赖，用几十行 Python 代码即可实现，非常适合轻量级 CLI 工具的定位。

这个设计非常贴合实际使用场景——当你在某个地点进行一次自然观察时，拍摄的多张照片在时间和空间上天然聚集，聚团算法恰好能将一次"出行"的所有记录自动归组。

GitHub Actions：定时自动化数据更新

第二步是设置 inaturalist-clumps 仓库，利用 Git Scraping 技术——通过 GitHub Actions 定时运行上述 CLI 工具，将输出结果提交到仓库中的 clumps.json 文件。

Git Scraping 是 Simon Willison 在2020年首次系统性提出的数据工程模式。其技术实现依赖 GitHub Actions 的 cron 调度功能——在仓库的 .github/workflows 目录下定义 YAML 工作流文件，指定定时触发规则（如每小时一次），Actions 运行器会自动执行数据抓取脚本，然后通过 git add、git commit、git push 将结果提交回仓库。GitHub 对公开仓库提供无限制的 Actions 免费额度，私有仓库每月也有2000分钟的免费时长。更关键的是，GitHub 的 raw.githubusercontent.com 域名默认支持 CORS 头，这意味着任何前端页面都可以直接通过 fetch() 跨域请求仓库中的 JSON 文件，无需配置代理服务器。

纯前端页面：静态展示与交互

最后一步是构建前端展示页面。Simon 向 Claude Code 下达了一条清晰的 prompt，要求生成一个 HTML 页面，功能包括：

• 通过 fetch() 从 GitHub 获取 JSON 数据
• 使用 iNaturalist 小尺寸缩略图（small.jpg）展示观察记录
• 采用 loading=lazy 实现图片懒加载
• 点击缩略图时在模态框中显示大图（large.jpg）
• 展示物种的常见名称

HTML 原生的 loading=\"lazy\" 属性是浏览器级别的延迟加载实现，于2019年在 Chrome 中首次支持，现已被所有主流浏览器采纳。当图片元素设置该属性后，浏览器会利用 Intersection Observer API 自动检测图片是否进入视口附近（通常提前几百像素开始加载），只有即将可见时才发起 HTTP 请求。对于像 iNaturalist 观察记录这样可能包含数百张缩略图的页面，懒加载能将初始页面加载时间从数十秒降低到几秒，同时显著减少带宽消耗。配合 iNaturalist 提供的多分辨率图片URL（small.jpg 约75×75像素，large.jpg 约1024像素宽），缩略图列表的总数据量可以控制在合理范围内。

一条 prompt 就完成了整个前端页面，最终成品发布在 tools.simonwillison.net/inat-sightings。

Git Scraping模式详解：零成本数据持久化

Git Scraping 是 Simon Willison 长期推广的一种数据工程模式，这个项目是该模式的典型应用。Simon 本人维护了数十个 Git Scraping 项目，追踪从加州火灾数据到疫苗接种统计等各类公开数据源。其核心优势包括：

• 免费托管与CDN分发：GitHub 提供免费的静态文件托管，支持 CORS 跨域访问，JSON 文件可直接被前端 fetch
• 天然版本控制：每次数据更新都有 Git 提交记录，数据变更完全可追溯。这意味着你不仅拥有最新数据，还拥有完整的历史快照——通过 git log 和 git diff 可以精确查看每次更新中哪些记录发生了变化
• 零运维成本：不需要维护服务器或数据库，GitHub Actions 负责定时执行脚本

这种模式特别适合"定期抓取、静态展示"的场景，比如监控价格变动、追踪公开数据集更新、聚合多源信息等。对于个人开发者来说，它几乎消除了后端基础设施的负担。

AI辅助开发的真实场景启示

这个项目体现了几个值得关注的趋势：

无服务器架构的极致运用：整个系统没有传统意义上的后端服务器。数据处理交给 GitHub Actions，存储依赖 Git 仓库，前端是纯静态页面。运维成本趋近于零。无服务器（Serverless）架构的概念最早由 AWS Lambda 在2014年推广，核心理念是开发者无需管理服务器基础设施。Simon 的项目将这一理念推向了更极端的方向——连 Lambda 函数都不需要，完全依赖 GitHub 的免费基础设施。这种"超轻量无服务器"模式有明确的适用边界：数据更新频率不能太高（GitHub Actions 的 cron 最小间隔为5分钟，且实际执行可能有延迟），单个 JSON 文件不宜超过几十MB（否则前端解析会卡顿），且不支持用户写入操作。但对于个人项目、数据仪表盘、监控看板等只读展示场景，这种架构的性价比几乎无可匹敌。

手机编程不再是噱头：在手机上露营时完成开发，这并非刻意炫技。当开发者有明确的需求和清晰的架构思路时，Claude Code 这类 AI 编程工具可以高效处理具体的编码实现，设备形态不再是瓶颈。关键在于交互范式的转变——传统编程依赖精确的键盘输入和多文件切换，而AI辅助编程将核心交互简化为自然语言描述，这恰好抹平了手机与电脑之间的输入效率差距。

架构思维比编码能力更重要：这个项目的技术难度不高，真正有价值的是将问题拆解为三个简洁组件的架构决策。AI 擅长执行明确的编码任务，而架构设计和需求拆解仍然依赖开发者的经验判断。Simon 的选择——用 CLI 工具处理数据、用 Git Scraping 实现持久化、用纯前端完成展示——每一步都在最小化复杂度的同时保持了系统的可维护性和可扩展性。

总结：个人开发者的轻量级架构范本

从 Python CLI 到 Git Scraping 再到纯前端展示，Simon Willison 用三个简单组件搭建了一条完整的数据管道。这个项目证明：合理的架构设计配合 AI 编程助手，个人开发者可以在极短时间内——甚至在非传统开发环境下——快速构建出实用工具。

对于想要尝试类似项目的开发者，Git Scraping + 静态前端的组合是一个值得优先考虑的方案。它足够简单、几乎零成本，而且在数据量不大的场景下完全够用。