Kotori

读到一篇思路很牛逼的文章！AI总结下。 一个老外叫Simon，用大模型两年做了150个工具。 这不奇怪，强的是他只用单页HTML做！ 把复杂的事情变简单，把简单的事情做到极致。 比如： - 想把 SVG 转成 PNG，但不想装软件 - 想看两个 Python 包版本之间改了什么 - 想更清楚地浏览 Bluesky 上的讨论 这些都用 HTML 工具搞定了。 一个 HTML 文件，打开就能用，不需要安装，不需要注册。 Simon 坚持一个原则：所有代码写在一个 HTML 文件里。 听起来老派，但优势也很明显： - 可以直接从 ChatGPT 或 Claude 里复制粘贴出来 - 扔到 GitHub Pages 上几秒钟就能用 - 不需要 npm，不需要构建步骤 - 两年后还能打开，不会因为依赖过期崩溃 他特别强调 "不要用 React"。 因为 JSX 需要构建，这会让整个流程变得麻烦。 保持简单，就是保持可维护。 从哪里开始？ 最简单的方式是直接在Claude 或 Gemini 里试： "做一个能把 JSON 转成 YAML 的工具，不要用 React" 一会儿你就能看到一个可以用的工具。 Claude 叫这个功能 Artifacts，ChatGPT 和 Gemini 叫 Canvas。 这只是开始，真正有意思的是他能把各种简单基础用到极致，比如“复制粘贴”功能 操作系统的剪贴板其实能携带多种格式的数据。 你从 Word 里复制内容，粘贴到另一个 Word 文档里会保留格式，但粘贴到记事本里就只剩纯文本。 JavaScript 可以读取这些不同格式的数据。 这意味着什么？ ① 你可以做一个工具，粘贴 Hacker News 的讨论 URL，它给你整理好的文本版本 ② 你可以做一个工具，粘贴图片，它把所有图片的 alt 文本提取出来 ③ 你可以做一个调试工具，显示剪贴板里到底有哪些格式的数据 状态存在哪里？ 没有后端数据库怎么办？Simon 有两个办法： 把状态存在 URL 里。 比如，他做了一个 24x24 的图标编辑器，你画的图标直接编码在 URL 里。这样你可以收藏，可以分享，打开链接就能继续编辑。 把关键的信息存在 localStorage 里。 比如 API key 这种敏感信息，不能出现在 URL 里，也不能发到服务器。 localStorage 让数据只存在用户的浏览器里。 他还用 localStorage 做自动保存。 写字数统计工具时，每次输入都会保存，这样不小心关掉标签页也不会丢内容。 CORS 是个宝藏 CORS（跨域资源共享）听起来很技术，但理解它很重要。 有些 API 允许你从浏览器直接调用，不需要经过自己的服务器。这些 API 就是金矿： - iNaturalist 可以查动物的观察记录 - PyPI 可以获取 Python 包的信息 - GitHub 的公开仓库内容都可以直接获取 - Bluesky 和 Mastodon 的 API 也很开放 Simon 甚至用 GitHub Gists 来持久化数据。 因为 Gist 的 API 支持 CORS，你可以做一个纯前端工具，把用户的数据保存到他们自己的 Gist 里。 文件不需要上传 <input type="file"> 不只是用来上传文件。 JavaScript 可以直接读取文件内容，在浏览器里处理。 Simon 的第一个工具就是 OCR 工具。 你选择一个 PDF，它在浏览器里转成图片，然后跑 OCR。整个过程不需要上传到任何服务器。 他还做了视频裁剪工具。 你打开一个视频文件，拖动裁剪框，它会生成一个 ffmpeg 命令，你可以复制到终端里执行。 反过来也行。 你可以让用户下载文件，不需要服务器参与。 JavaScript 可以生成 PNG、JPEG、ICS 日历文件等等。 Python 和 WebAssembly 这是最让人兴奋的部分。 Pyodide 让 Python 可以在浏览器里运行。 不是玩具级别的运行，是真正的 Python，包括 Pandas 和 matplotlib。 Simon 做了一个工具，你输入数据，它用 Pandas 处理，用 matplotlib 画图，全在浏览器里完成。 WebAssembly 打开了更多可能。 Tesseract OCR、SQLite、图片压缩库，这些原本用 C 或 C++ 写的软件，现在都能在浏览器里跑。 当你有了 100 多个工具，新工具就容易多了。 每个工具都是下一个工具的参考文档。 你可以告诉大模型："看看我之前做的 PyPI 包浏览器"，然后说："做一个类似的，但是显示两个版本之间的差异"。 LLM 会读你之前的代码，理解你的模式，然后生成新的工具。 这比从零开始快得多，而且更可靠。 Simon 的这些工具真可以解决问题。 更重要的是，这种方式让你能快速实验。 想法到原型可能只需要几分钟。 不用担心部署，不用担心维护，不用担心成本。 怎么起步尝试？ 一个 GitHub 仓库，开启 GitHub Pages。 然后就可以开始了。 用 ChatGPT 或 Claude 生成一个工具，复制粘贴到仓库里，几秒钟后就能在网上访问。 不需要完美，不需要复杂。 从一个解决你自己问题的小工具开始。 然后慢慢积累，慢慢改进。 两年后你可能也会有几十个甚至上百个这样的工具。 每一个都在某个时刻帮到你，每一个都让下一个更容易做出来。 这就是 HTML 工具的魅力：简单、实用、可持续。 原文见评论区。