Show HN: CodeViz – 代码可视化工具:一款理解你代码的图表编辑器 (YC S24)
1 分•作者: LiamPrevelige•7 个月前
大家好,我们是 Will 和 Liam,CodeViz(YC S24)的创始人。我们正在开发一款 VS Code 扩展,它可以读取你的代码并生成可编辑的架构图(C4、UML)。它主要用于团队构建共享上下文、就技术决策达成一致以及可视化 PR。<p>这里有一个录制的演示:<a href="https://youtu.be/Jh3wkrCj_WQ" rel="nofollow">https://youtu.be/Jh3wkrCj_WQ</a>
你可以在这里试用 VS Code 扩展:<a href="https://marketplace.visualstudio.com/items?itemName=CodeViz.codeviz" rel="nofollow">https://marketplace.visualstudio.com/items?itemName=CodeViz....</a><p>每月免费生成 10 张图(无需注册)。之后,我们提供每月 19 美元的套餐,用于无限制的图表生成,以及每月 50 美元的套餐,用于实时协作。<p>我们去年发布了 v1 版本,旨在帮助工程师更快地阅读代码(<a href="https://news.ycombinator.com/item?id=41393458">https://news.ycombinator.com/item?id=41393458</a>),但实际上没有人使用 CodeViz 来实现这个目的。用户们都在截取我们生成的图表的屏幕截图,用于演示和架构评审。我们重新构建了 CodeViz,将其从一个被动的查看器转变为一个协作编辑器,用于使用 C4 和 UML 标准对特定流程进行建模。<p>这需要我们对技术方法进行重大改变。在最初的版本中,我们依赖静态分析,使用 tree-sitter 为大约 15 种语言构建堆栈图(使用语言服务器作为“老师”)。虽然技术上很精确,但这些图表过于冗余,并且无法映射到人类的抽象概念。<p>我们现在使用 gemini-cli 的一种改编版来读取代码库,生成 C4 + Activity PlantUML 图表,并将节点直接链接到源代码。这些图表被解析到我们使用 ReactFlow 构建的图表编辑器中。你可以点击展开节点到更低的抽象级别,让 AI 助手可视化特定流程,或者从 GitHub 导入 PR。<p>CodeViz 正在积极开发中,非常欢迎所有诚实的反馈!我们的路线图主要侧重于团队协作工具,因此我们也希望听到你关于架构评审和入职过程中遇到的问题。
查看原文
Hey HN, we’re Will and Liam, founders of CodeViz (YC S24). We’re building a VS Code extension that reads your code and generates editable architecture diagrams (C4, UML). It’s mostly used by teams to build shared context, agree on technical decisions, and visualize PRs.<p>Here’s a recorded demo: <a href="https://youtu.be/Jh3wkrCj_WQ" rel="nofollow">https://youtu.be/Jh3wkrCj_WQ</a>
You can try the VS Code extension here: <a href="https://marketplace.visualstudio.com/items?itemName=CodeViz.codeviz" rel="nofollow">https://marketplace.visualstudio.com/items?itemName=CodeViz....</a><p>It’s free for 10 generations/month (no signup). Then, we have a $19/month plan for unlimited diagram generation and $50/month plan for live collaboration.<p>We launched a v1 last year to help engineers read code faster (<a href="https://news.ycombinator.com/item?id=41393458">https://news.ycombinator.com/item?id=41393458</a>), but no one actually used CodeViz for that. Users were taking screenshots of our diagrams for presentations and architecture reviews. We rebuilt CodeViz to shift from a passive viewer to a collaborative editor for modeling specific flows, using C4 and UML standards.<p>This required a major change in our technical approach. In our original version, we relied on static analysis, building stack graphs with tree-sitter for ~15 languages (using language servers as teachers). While technically precise, these graphs were way too noisy and didn’t map to human abstractions.<p>We now use an adaptation of gemini-cli to read the codebase, generate C4 + Activity PlantUML diagrams, and link nodes directly to source code. These are parsed into a diagram editor that we built with ReactFlow. You can click to expand nodes into lower levels of abstraction, ask an AI assistant to visualize a specific flow, or import PRs from GitHub.<p>CodeViz is in active development, all honest feedback is much appreciated! Our roadmap is largely focused on tools for working in teams, so we’d also love to hear about your problems with architecture reviews and onboarding.