前端进阶之旅前端进阶之旅
基础篇
进阶篇
高频篇
精选篇
手写篇
面经篇
AI 篇
原理篇
每日一题
小程序题库
知识卡片
  • 场景篇按分类整理的大前端场景考点
  • 历年面经按年份追踪真实考点
  • 算法题库NEW在线编码即时判题
  • 专项自测100 题快速查漏
  • 前端基础
    • HTTP从报文一路讲到 HTTPS
    • 浏览器渲染、事件循环、进程
    • 计算机基础Linux、网络、操作系统
  • 进阶专项
    • 设计模式23 种模式怎么用
    • 前端系统进阶学习大型项目工程化
    • 前端综合文章长期沉淀的实践文
  • 工程与工具
    • Node学习指南从环境搭建到服务端
    • NPM工作流script、依赖与发布
    • Docker容器化部署上手
    • Canvas图形与动画实战
  • 路线与导图
    • 思维导图知识点全景图
    • 学习路线按图索骥不跑偏
  • 动态
    • 公众号动态公众号历史文章
    • 博客动态站长的技术博客
    • 开发者导航常用工具与文档站
  • AI 助手随时提问,即时解析
  • AI 模拟面试模拟真实面试 + 报告
  • AI 知识地图串起全站知识点
  • AI 定制路线按你的简历现排
AI 热点
旧版
基础篇
进阶篇
高频篇
精选篇
手写篇
面经篇
AI 篇
原理篇
每日一题
小程序题库
知识卡片
  • 场景篇按分类整理的大前端场景考点
  • 历年面经按年份追踪真实考点
  • 算法题库NEW在线编码即时判题
  • 专项自测100 题快速查漏
  • 前端基础
    • HTTP从报文一路讲到 HTTPS
    • 浏览器渲染、事件循环、进程
    • 计算机基础Linux、网络、操作系统
  • 进阶专项
    • 设计模式23 种模式怎么用
    • 前端系统进阶学习大型项目工程化
    • 前端综合文章长期沉淀的实践文
  • 工程与工具
    • Node学习指南从环境搭建到服务端
    • NPM工作流script、依赖与发布
    • Docker容器化部署上手
    • Canvas图形与动画实战
  • 路线与导图
    • 思维导图知识点全景图
    • 学习路线按图索骥不跑偏
  • 动态
    • 公众号动态公众号历史文章
    • 博客动态站长的技术博客
    • 开发者导航常用工具与文档站
  • AI 助手随时提问,即时解析
  • AI 模拟面试模拟真实面试 + 报告
  • AI 知识地图串起全站知识点
  • AI 定制路线按你的简历现排
AI 热点
旧版
返回 AI 情报前线
All News · 全部资讯9316
  • 面向 Agent 的运维队列:失败自动转Ticket
  • 四个静默失败的 CI 检查:它们都是绿的,但什么都没做
  • AI 编码工具会读取 .env:本地 DLP 代理 Anonmyz 在prompt边界截流
  • Google 开源 SAM:零配置的 AI Agent P2P 发现与调用网络
  • Cursor Skills完全指南:格式规范与跨Agent迁移实测
  • OpenAI Codex Skills规范详解:目录结构与官方文档未记载的细节
  • 用Gitea自建Claude Code内部插件市场,团队Skill统一分发
  • Claude Skills规范深度解读:从格式到团队协作
  • 2026年LLM应用架构实战:摆脱if/else链式判断
  • Anthropic CEO:AI天然趋向集中,开源只是转移权力
  • 微软 Copilot 隐藏参数漏洞可被利用窃取密码
  • LangChain 揭示:Agent 效果不佳时换模型是误区,换 Harness 才是关键
  • 三阶段工作流让 AI Agent 保持精准:Research-Plan-Implement
  • 小米MiMo桌面应用即将上线,AI编程助手6月已开源
  • Agent成熟度记分卡:追踪AI Agent可靠性的五个核心维度
  • 模型趋同时代:系统架构比选模型更重要
  • 代码审核功能默认关闭的教训
  • 程序员用 Claude 为 Windows 专用 HP 打印机编写 macOS 驱动
  • NIST AI风险管理框架生产级RAG实战
  • Codex自动探索优化技能:研究-测试-评判闭环
  • AI协作UML编辑器:代码臭味一目了然
  • AI API成本降低95%的实战经验
  • 不同模型Tokenizer成本差异的技术解析
  • 我用低价模型替代OpenAI:生产迁移实录
  • Anthropic单token成本是Vercel均值4.4倍,使用量却占65%
  • career-ops: 在AI编程CLI里做求职管理
  • CI守护失效实录:4个静默失败的检查
  • 不同分词器对中文token计数差异高达20%
  • Claude Code 2.1.234安全升级清单发布
  • LLM 调用成本减半:模型路由与缓存实战
  • AI厂商公开的使用数据可信吗?斯坦福研究者质疑透明度
  • Claude Code引入/design命令:终端内生成UI稿
  • Azure DevOps MCP 服务器 prompt 注入漏洞:AI Agent 如何绕过安全防线窃取数据
  • Ray AI严重漏洞CVE-2025-62593已被主动利用
  • 缺失数据无法被检测:遗漏类错误的技术盲区
  • 我们删掉了向量数据库和图数据库,二者皆删
  • 四大国产模型实战PK: DeepSeek/Qwen/Kimi/GLM真实客户工作对比
  • System Prompt不是安全边界: 重新审视AI应用的信任模型
  • DynamoDB原生向量搜索上线
  • 阿里Qwen:被严重低估的开源模型家族
  • AI代码助手横评:Cursor、Copilot等实用对比
  • MIT深度分析:AI递归自我改进或许不会来得那么快
  • Haystack 3.0管道接入TealTiger治理引擎
  • AI编程代理的脚手架到底有没有用
  • 延迟加载工具schema省21%成本,但有一类任务反而亏了
  • AI基准测试崩溃:Dan Luu揭示评估体系系统性失效
  • 用 Qdrant 给树莓派 AI 集群注入持久记忆
  • AI上下文压缩时平均丢失83%的用户规则
  • L2 Vault: 为 AI Agent 记忆引入 GitOps 版本控制
  • C++ 构建日志三合一工具配合四重门实现 AI 代码合并
  • Next.js App 从 70 分到 PageSpeed 100 的性能修复复盘
  • 已加载 51 / 9316
8.0
热点
AI SCORE
工具产品2026-08-18 19:09

AI协作UML编辑器:代码臭味一目了然

dev.to · AI#UML#代码质量#重构
Editor brief · 编辑速览

Kata是一款双向C#/C++类图编辑器,检测22种代码臭味并标记,支持从图上直接发起Fowler重构方案,并可对接Claude Code/Codex CLI生成修复diff。

文章思维导图
Knowledge map
拖拽缩放
Full translation

完整中文译文

TL;DR —— 我其实只是想给 UML 类图上的代码加上 💩 图标。过程中它变成了 Kata,一个 C# / C++/CLI 解决方案的双向类图编辑器,功能包括:(1)检测 Fowler 24 种代码异味中的 22 种,并将 💩 徽章钉在具体的类型或成员上;(2)让你直接从类图上触发 Fowler 目录中的重构手法,并将其写回源码;(3)将"我不知道怎么修"转发给 Claude Code / Codex CLI,在应用前预览返回的统一 diff。

站点:https://kata.dhq-boiler.dev/ · 仓库:https://github.com/dhq-boiler/Kata

我知道那本《重构》书。我和大多数人一样读过《重构》——我能说出 Extract Method,能识别大型 switch 语句,当有人说"特性依恋"时也会点头。但知道目录和真正在一个真实代码库上运行,是两项完全不同的运动。

对我来说,差距在第零步:找到代码异味。一旦你知道一个方法发臭了,一半的战斗就结束了。目录告诉你接下来该做什么。但真实项目中没有"发臭位"指示器——你只能盯着 20 万行代码,希望一股坏味道自己走过来自我介绍。

所以这个想法真的就这么直白:

如果我能看到一个 💩 图标出现在需要关注的类上面,剩下的工作流就会顺理成章。

就这样。编辑器就是围绕这一个需求逐渐长大的。

人类 —— 打开类图,扫视 💩 徽章(这部分由工具完成)。

AI —— 应用重构配方(Claude Code 或 Codex,看你已经在用哪个)。

人类 —— 审查 diff,然后点击 Apply。

重要的一点是,人类始终坐在审查席上。AI 从来不会在不让你先看到确切 diff 的情况下写入磁盘。

工具实际做什么

  1. .sln / .slnx → 实时类图

打开一个解决方案,得到一个真正的类图。符号解析通过 Roslyn 完成(C#)和手写的语义层(Kata.Cpp)完成(C++/CLI),所以混合语言的 WPF + 原生库项目能正确渲染。

  1. Ctrl+Click 导航(跨语言)

点击任意类型或成员跳转到其定义。C# ↔ C++/CLI 双向导航——可以从任意一端追踪 P/Invoke 或 ref class。

  1. 从类图驱动的 Fowler 重构

右键一个类 → 选择一个重构 → Kata 重写源码。当前实现覆盖了 Extract Method / Extract Interface / Extract Class,整个 Rename 系列(类型 / 成员 / 字段 / 参数),Move Method / Move Field,Extract Hierarchy 等等。

同样的操作通过 MCP 工具暴露,因此外部 agent(Claude Code、Codex 或任何支持 MCP 的工具)可以像人类从 UI 操作一样,以编程方式驱动 Kata。

  1. 代码异味分析器 + 💩 徽章

Fowler 的 24 种异味中有 22 种实现为确定性检测器,运行在语义模型上。结果显示在两个地方:

类型节点右上角 —— 类型级异味(God Class、Data Class、Feature Envy……)

成员行末尾 —— 成员级异味(Long Method、Long Parameter List、Divergent Change……)

分级徽章 —— 更严重的会获得彩虹光晕——所以满屏节点一目了然。

  1. AI 生成的 diff,带预览

两条 AI 路径,都依附于你已有的订阅:

claude -p "<prompt>" — Claude Code CLI(headless 模式)
codex exec "<prompt>" — Codex CLI

Kata 从(异味信息、所属类型/成员的源码、该异味的目录配方,以及严格的"返回统一 diff"指令)构建 prompt,运行它,解析返回的 diff,然后弹出预览对话框。在你批准前不会有任何内容写入磁盘。

这里有两个重要的设计选择:

无 API key 管理。你不需要为 Kata 付费——它使用你已经有的 Claude / ChatGPT 套餐。

确定性优先,AI 其次。对于一组不断增长的类别(目前跨三个层级共 20 个重写器)Kata 有一个内置的 Roslyn 重写器,可以在不访问网络的情况下产生完全相同的 diff。对于更困难的情况(数据流、跨文件设计变更)才会回退到 AI 路径。

在 diff 预览中,当一个修复在技术上正确但语义上发生了转移时,还有一个行为变更警告面板——例如 OrderBy(...).FirstOrDefault() → MinBy(...) 会在空序列上抛出异常,而原始代码会返回 default(T)。这就是那种"diff 是对的,请注意一下"的时刻,普通 patch 视图会直接吞掉。

架构简述

源码是 SSOT(单一真相来源)。Kata 是代码库的镜像。只有纯 UI 状态(节点位置、缩放、过滤选择)存在于侧文件中。

意图驱动。每个用户动作都变成一个强类型的 Intent(RenameIntent、ExtractMethodIntent、PerfFixIntent……)。语言特定的适配器将意图翻译为源码编辑。UI 和 MCP 接口都通过相同的处理器触发相同的意图。

MCP 外部化。Kata.Mcp 运行在 Streamable HTTP + 无状态模式,因此 Kata.App 用户和一个或多个 AI agent 可以同时连接到同一个 live 模型,而不会互相争夺 session。

语言无关核心。Kata.Core 不依赖任何语言适配器。添加新语言意味着实现 ILanguageAdapter 加上一套异味检测器,而不是编辑核心。C# 是目前成熟的适配器;Java 是下一个(JDT-Core 加载,基准测试大型真实项目 4.6 秒)。

性能注记:渲染大型解决方案的实时类图过去会因为 Nodify 希望提前实例化每个视觉元素而严重卡顿。VirtualizingNodifyCanvas(一个"实现全部、仅测量视口"的技巧)将那次卡顿从约 845ms 降到无感知,同时没有破坏 Nodify 的 null-unsafe 容器假设。

依赖:.NET 10 SDK on Windows(WPF)。

git clone https://github.com/dhq-boiler/Kata
cd Kata
dotnet build Kata.slnx
dotnet run --project src\Kata.App\Kata.App.csproj

应用启动后,使用 File → Open Solution 指向任意 .sln / .slnx。渲染的图就是你的 live 模型——你点击的任何东西都会回调到源码。

如果你偏好安装包,站点链接到签名过的 Setup.exe / 便携 zip 构建,通过 Velopack 自动更新。

社区构建 —— PolyForm Noncommercial 1.0.0。对个人使用、学习、研究、爱好项目免费。

商业使用 —— 需要 Pro 许可证(Lemon Squeezy,一次买断或按座位)。

AI 成本 —— 你自己拥有 Claude / Codex 订阅。Kata 永远不会对你的 token 收费。社区构建中看到的月度配额不是收费门槛,它是"请尝试 Pro 以应对重工作负载"的门槛。

团队协作 —— 团队负责人工作流:编写重构指令包,连同影响范围可视化和 diff 预览一起交给团队,让贡献者之间获得一致执行。

更多语言适配器 —— Java 正在进行中,然后是 Kotlin 和 TypeScript。

超越类图 —— 时序图和状态图,主要是为了在更广泛的代码库视图中复用相同的意图驱动重构管道。

欢迎报告 bug,尤其是 C++/CLI 混合解决方案的复现样例——那是语义解析最有棱角的角落。

站点:https://kata.dhq-boiler.dev/

社区仓库:https://github.com/dhq-boiler/Kata

Pro:https://kata.dhq-boiler.dev/pro

如果你试用后发现它正好标在了你一直在回避的那个类上,我也想知道。

Original source

本文由 AI 翻译整理自 dev.to · AI,原文版权归原作者所有。

阅读英文原文
上一篇
Codex自动探索优化技能:研究-测试-评判闭环
下一篇
AI API成本降低95%的实战经验