背景:所以,这就是故事的一部分——我为什么要构建这个。 我注意到,AI 和代理使开发人员的工作变得相当容易。 大多数情况下,他们编写自己的代码,但这也意味着您不再拥有您项目的深入了解。 而我作为开发人员来说,我讨厌。 我不使用任何代理—I 但从LLMs获取小片段逻辑或编码,但从未在IDE中使用它。

我意识到,我不是唯一一个面临这个问题的人。毕竟,我们选择成为开发人员才能建造一些东西。 所以我搜索了一个图形可视化工具,但找到了我想要的方式—所以我要建它。

它也给我想到,这对理解任何代码库来说是最有用的。因此,它将使在团队中向新同事传递KT(知识转移)变得容易。 同时,在GitHub开源项目的开发者为图形构建并且共享它,这些可以使其他人更容易理解并且贡献。当然,blast radius和K-hop特性对PR审查以及上下文理解也很有用。


特性:

  1. 通过AST(无AI)检测节点和边。
  2. 检测routes、JSX组件、Redux/Zustand/Jotai存储器、钩子等。
  3. 支持读取、写入、函数调用和7种其他类型的边。
  4. 您可以看到任何节点的blast radius—这意味着如果您更改该节点,其他节点将受何影响。
  5. 您可以看到详细的业务概述、技术概述和安全问题每个节点。
  6. 您也可以看到任何节点的代码。
  7. 每个节点被分配一个基于应用逻辑对其依赖程度的分数—由自定义算法生成,不使用AI。
  8. 您也可以查看提交差异每个节点。

优点:

  1. 它可以轻松可视化复杂的代码库—最大我测试过的代码库有2,500个节点。
  2. 因为它通过图形连接生成总结,因此使用比较少的令牌—总共仅2,500节点2,000,000令牌。
  3. 总结是因为图形连接和上下文理解而非常棒。 生成的总结使用grok-4.1-fast并且非常棒。
    4.如果您处于团队中,那么它会使向新同事转移代码库的知识变得非常简单。 它还会使PR审查变得非常简单。
  4. 如果你是一个个人的开发者,那么它将指出那些不太显而易见的严重问题。 我建了一个关于非常流行的公共app的图表,结果它捕捉到了他们在服务器日志中记录了付款凭证和其他敏感信息。
  5. 现在很多人使用AI对代码编写,因此将难以跟踪每个组件是如何连接的以及他们如何交互—这使得可视化成为可能。
  6. 构建的图形非常快。 2,500个节点的图表构建在22秒内完成。 总结生成需要更多的时间—I 在这个案例中使用grok-4.1-fast,并且需要25-30分钟。

限制:

  1. 目前仅支持React、Next.js和Node.js/Express等。它会为其他项目构建图表,但可能无法检测许多节点除函数之外。
  2. 边创建准确度约为95%—仍然会漏掉一些边。
  3. 虽然我正在努力使得评分算法尽可能强壮,但路由分数仍然需要改进。

云功能:除了开源模型之外,我们还将拥有更多特色的云选项—诸如与您的选择的LLM进行对话、导航和与图表进行交互。图表将可以共享。它将支持团队功能,这些可以用于在团队中使用。此外,用户可以连接到GitHub。在PR review中,高级开发人员可以看到变更和爆炸半径—它会影响多少和这些变更是什么。可视化地看待它将使其变得容易理解。


视频显示了keystone repo的图表。 Keystone是下一代头部无CMS的著名开源项目。像这样的流行仓库中,有些安全问题就可以清楚地看到。

这里是DevelensGithub repo=>https://github.com/devlensio/devlensOSS

您可以报名加入云等待名单这里=>https://devlens.io

我希望您喜欢这个概念。