我用AI写了一个Mastodon客户端：复杂UI怎么提示才有效

一个Mastodon网页客户端从零到可用，需要多久？开发者@fh332393900的答案快得惊人——而且大部分代码是和AI结对写出来的。这不是简单的CRUD页面，而是包含富文本编辑器、联邦搜索、多语言UI的完整产品。更关键的是，他摸索出了一套让AI真正处理复杂工程问题的提示模式。

项目已开源，预览版跑在Vercel上。核心技术栈是React，AI主力用的是GPT-5.2-Codex。但比工具选择更值得看的，是怎么用提示把AI从"代码生成器"变成"架构协作者"。

富文本编辑器：最复杂的UI表面

Mastodon的编辑器必须同时满足两件事：用户体验要像原生应用，输出格式必须兼容后端——@user、#tag、:emoji: 这些标记不能乱。AI在这里的价值不是一次性生成完美代码，而是帮开发者在重构时守住行为边界。

一个典型提示："替换编辑器实现，但保留mention/hashtag/emoji的输出格式。"结果：AI匹配了现有的序列化规则，后端兼容性没被破坏。另一个针对交互细节的提示："添加工具栏，包含代码块、粗体、斜体三个按钮，每个按钮根据光标位置高亮。"AI输出了一套一致的UI状态模型，通过editor.isActive(...)完成状态绑定。

性能问题同样用提示拆解。"解释输入延迟的原因，然后提出改动最小的修复方案。"AI的响应聚焦在渲染优先级上，没有盲目重写组件——这是区分"有效AI编程"和"AI瞎写"的关键分水岭。

React Query：异步数据流的脚手架

搜索、时间线、发现页，这些功能背后是复杂的异步状态管理。AI在这里的优势是快速生成hooks和query keys，且命名规范保持一致。开发者不需要从零设计缓存策略的数据结构，可以把精力放在业务逻辑上。

项目里AI的真正价值点被总结为三类：结构化重构、复杂交互逻辑、架构变更时维持行为一致性。这三项的共同点是——它们都是具体的工程问题，而非"帮我写个登录页面"式的模糊需求。

提示模式：从生成代码到解决问题

这个案例揭示了一个反直觉的事实：AI编程的效率不取决于模型多强，取决于你问得多具体。模糊的指令得到模糊的代码，精确的工程问题得到可维护的解决方案。当AI被当作"结对程序员"而非"代码自动补全"时，它才能处理真正有价值的开发工作。

联邦搜索、emoji处理、代码块渲染、多语言切换——这些功能在一个Mastodon客户端里全部跑通。开发者留下的GitHub仓库和在线预览，成了验证这套方法论的最佳证据。