为什么 codes.im 的所有工具都在浏览器本地运行

做 codes.im 时，我给自己定了一条规则：所有工具都只在浏览器里运行，输入的数据不发送到任何服务器。 这篇文章聊聊为什么，以及这个决定带来的好处和代价。

我们往在线工具里粘贴了什么

回想一下平时用在线工具的场景：

• 把线上接口返回的 JSON 粘贴进去格式化，里面可能有用户的手机号和地址；
• 解析一个 JWT，看看它什么时候过期，而这个 token 本身就是登录凭证；
• 对比两份配置文件，里面可能有数据库连接串；
• 计算一段 prompt 的 token 数，而这段 prompt 可能包含公司内部文档。

如果工具把这些内容发到服务器上处理，你很难知道它们会不会被记录、保存多久、会不会出现在日志或分析系统里。

本地运行意味着什么

在 codes.im 上，工具的计算全部由页面里的 JavaScript 完成：

• JSON 格式化用的是浏览器自带的 JSON.parse；
• 哈希计算用的是浏览器内置的 Web Crypto API；
• Token 计数使用开源的分词器库，第一次打开时下载到浏览器，之后完全离线计算；
• 网站本身是纯静态页面，没有处理用户输入的后端接口。

你可以自己验证：打开浏览器开发者工具的 Network 面板，再使用任意一个工具，会发现输入时不会产生任何请求。

额外的好处

快。 没有网络往返，输入的同时结果就出来了。

稳定、便宜。 静态页面可以部署在 CDN 上，几乎不需要服务器成本，也不怕访问量突然增长。这让网站可以长期免费运行。

可审计。 网站代码开源，任何人都可以检查工具到底做了什么。

代价和取舍

这个决定也有限制：

• 能处理的数据量取决于你的设备。 几 MB 的 JSON 没问题，但超大的文件会受到浏览器内存的限制；
• 页面体积会变大。 比如 Token 计数器需要的分词器数据有几 MB，所以它只在打开对应页面时才按需加载，不影响其他页面；
• 有些功能做不了。 需要访问第三方网站的工具（比如“抓取一个网页”）会受到浏览器跨域限制，没法在纯前端实现；
• 没有云端同步。 少数工具（比如 Markdown 编辑器）会把草稿保存在你自己浏览器的本地存储里，但不会在设备之间同步。

对开发者工具来说，我认为这些代价完全值得。

接下来

codes.im 会继续按这个原则增加工具，尤其是开发大模型应用时经常用到的那些：JSON 修复、结构化输出、流式响应调试等等。如果你有想要的工具，欢迎在 GitHub 上提 Issue。