@kentcdodds：有一些，但不是代码方面的

@samuelagm 有一些，但不是代码方面的

https://t.co/TDUuyQBnBd

长话短说：不要只依赖代码 diff 进行审查；使用 AI 代理基于原语生成可视化系统概述，展示整个系统如何变化。

代码审查的争论比看起来更微妙

你还应该看 git diff 吗？Kent 认为，你可能应该停止这样做——至少不要将其作为主要的审查机制。

关于“读你的代码”的讨论比很多人所呈现的更加微妙。有些人认为你绝对必须自己逐行阅读和编写每一行代码。另一些人则说你永远不应该看代码 diff，因为那是浪费时间。真相是一个频谱。它取决于：

• 你所处的情境
• 项目的重要性
• 如果搞砸了，有多少人会因此承担风险

尽管如此，Kent 相信我们正在朝着一个方向发展：越来越多的人可以减少对代码 diff 的审查，转而开始审查系统本身以及系统正在如何变化。

想法：可视化系统 Diff

这与 Kent 最近在 X 上看到的来自 Builder.io 的 Steve 发布的内容不谋而合。Steve 构建了一个技能（skill），可以生成一种“系统 diff”或可视化变更，不仅涉及 UI 组件，还涉及整个系统。

Kent 尝试了一下，发现它实际上使用了一个托管服务，你可以自行托管。它是开源的。但那个系统有很多地方不符合 Kent 想要的工作方式。例如，它是一个 GitHub Action，在每个 PR 上自动运行，然后启动一个环境，让你可以试用并查看系统的样子。这很酷，但 Kent 更希望由负责完成工作的那个代理来生成这些 diff。于是他构建了自己的迷你版本。

为什么 Cursor 启发了这种方法

Kent 想这样做，部分原因是他已经从 Cursor 以及 Cursor 如何利用其环境处理这个问题中获得了很大价值。

当你拥有一个 Cursor 云代理时，它有一个真正的环境，可以：

• 打开你的 Web 应用
• 打开移动模拟器（如果你在进行移动开发）
• 截取屏幕截图
• 为你提供整个过程的视频

由于代理已经在生成摘要，Kent 问道：“我为什么不也让它生成这个系统概述呢？”

系统概述的实际应用

Kent 展示了一个他在为 Cody 添加 MCP 支持时的真实示例。MCP 让你可以将 MCP 服务器添加到 Cody，并全部通过 Cody 访问这些服务器。除了它所做的其他一切之外，Cody 还充当这些 MCP 服务器的代理。

系统概述会对变更进行分类。例如：

• “这添加了一个新的原语。风险很高。”
• “这移除了一个原语。影响也很大。”

这与 Kent 另一个关于原语和系统设计的视频有关。原语是系统的核心构建块，理解原语对于整个方法的运作至关重要。

概述涵盖：

• 基于原语的风险分类
• 涉及了哪些原语
• 显示原语之间关联的系统地图
• 显示完整用户体验的变更流程

变更流程示例

对于 MCP 功能，变更流程描述了浏览器中的用户体验：用户发布一个添加操作，worker 中有应用路由用于添加服务器并连接回调 URL，然后整个 OAuth 流程开始。

这帮助 Kent 理解：

• 代理当时在想什么
• 代理如何解读提示词
• 代理最终如何构建它所构建的系统

这非常有帮助。AI 代码审查者仍然可以确保代码没有做奇怪的事情，但通过系统的视角，Kent 可以扎实地理解实际试图改变的内容。当机器人做出奇怪的事情时，他可以引导它做出正确的决策。

用可视化概述节省时间

Kent 承认，他自己查看变更的文件可能也能得出同样的理解。该技能确实会更新文档，因此他可以对此有所了解。然后他可以查看所有代码更改，迁移通常也很有帮助。但所有这些内容都在系统可视化器中得到了可视化。

对于 MCP 变更，添加的代码量并不少。拥有一位 AI 审查者，加上对 UI 部分的视觉感受，再加上对预期工作方式的可视化概述，这非常有帮助。

简单的变更也是如此

有时它实际上非常简单。对于一个“为新账户添加 MCP 引导页面和横幅”的变更，就系统而言并不复杂。该变更是在组合现有原语，因此风险较低。

概述显示了：

• 分类：组合
• 涉及的原语：都与任务相符
• 系统地图：不同部分如何协同工作
• 流程：对该用户来说应该如何工作

这比查看变更的 18 个文件要容易得多。尽管这是一个相当简单的变更，但其中大部分是 UI 内容，而 Kent 基本上可以从演示以及 Cursor 本来就会为他制作的东西中获取这些。

原语是基础

这只有在你有良好的原语集作为起点时才真正有效。Kent 说，尤其是在项目开始时，他会非常谨慎地设计事物的结构。他确保以下几点显而易见：

• 新原语应该放在哪里
• 有哪些可用的原语
• 哪些原语需要组合

他在积极思考要创建、组合、删除或扩展哪些原语。一旦你为代理提供了一个真正好的游乐场，你就可以把技能交给代理。代理可以完成任务，然后使用该技能为你生成这份报告。

这里真正能长期发挥作用的技能，是对你软件运行和代理工作所依托的系统有扎实的理解，这样你最终才能交付用户所需的产品，帮助他们完成雇佣你产品去做的工作。

已发布：Visual Recap 技能

Kent 已经在 GitHub 上发布了这个。它位于他个人组织下的 KCD skills 中，名为 “visual recap”。它深受 Steve 在 Builder.io 所做工作的影响。

你可以跟进，借鉴其中对你有用的部分，然后让你的代理生成这种已做更改的可视化 diff 或可视化概述。这会给你带来更好的审查体验。

你可能仍然会继续审查代码，这完全没问题。但进行系统审查会带来巨大帮助。

课后作业

Kent 为这期 Better with Kent 布置的课后作业：

• 尝试这个技能
• 或者先不用这个技能，直接把你的代理链接到这个技能，说：“嘿，你能为我生成这个吗？”
• 看看效果如何
• 迭代并制作你自己的技能版本

技能的妙处在于它们只是 markdown 文件。你可以复制粘贴它们。放心试试吧。

来源：@kentcdodds：有一些，但不是代码方面的 (https://youtu.be/Xs-U7SY2uNE)