Visualize the entropy of a codebase with a 3D force-directed graph
Hi HN! I'm Gabriel, the author of dep-tree (https://github.com/gabotechs/dep-tree), and I wanted to show off this tool and explain why it's being really useful at my current org for dealing with code complexity. I work at a startup where business evolves really fast, and requirements change frequently, so it's easy to end up with big piles of code stacked together without a clear structure, specially with tight deadlines. I made dep-tree [1] to help us maintain a clean code architecture and a logical separation of concerns between parts of the application, which is…
What it does
In the maker’s words, at launch
Hi HN! I'm Gabriel, the author of dep-tree (https://github.com/gabotechs/dep-tree), and I wanted to show off this tool and explain why it's being really useful at my current org for dealing with code complexity. I work at a startup where business evolves really fast, and requirements change frequently, so it's easy to end up with big piles of code stacked together without a clear structure, specially with tight deadlines. I made dep-tree [1] to help us maintain a clean code architecture and a logical separation of concerns between parts of the application, which is accomplished by: (1) Visualizing the source files and the dependencies between them using a 3D force-directed graph; and (2) Enforcing some dependency rules that allow/forbid dependencies between different parts of the application. The 3D force-directed graph visualization works like this: - It takes an entrypoint to the codebase, usually the main executable file or a library's entrypoint (index.js, main.py, etc...) - It recursively crawls import statements gathering other source files that are being depended upon - It creates a directed graph out of that, where nodes are source files and edges are the dependencies between them - It renders this graph in the browser using a 3D force-directed layout, where attraction/repulsion forces will be applied to each node depending on which other nodes it is connected to. With this, properly decoupled codebases will tend to form clusters of nodes, representing logical parts that live together and are clearly separated from other parts, and tightly coupled codebases will be rendered without clear clustering or without a clear structural pattern in the node placement. Some examples of this visualization for well-known codebases are: TypeScript: https://dep-tree-explorer.vercel.app/api?repo=https%3A%2F%2F... React: https://dep-tree-explorer.vercel.app/api?repo=https%3A%2F%2F... Svelte: https://dep-tree-explorer.vercel.app/api?repo=https%3A%2F%2F... Langchain: https://dep-tree-explorer.vercel.app/api?repo=https%3A%2F%2F... Numpy: https://dep-tree-explorer.vercel.app/api?repo=https%3A%2F%2F... Deno: https://dep-tree-explorer.vercel.app/api?repo=https%3A%2F%2F... The visualizations are cool, but it's just the first step. The dependency rules checking capabilities is what makes the tool actually useful in a daily basis and what keeps us using it every day in our CI pipelines for enforcing decoupling. More info about this feature is available in the repo: https://github.com/gabotechs/dep-tree?tab=readme-ov-file#che.... The code is fully open-source.
Does the same job
all alternatives →- CDCreate diagrams of complex data flows in software systems2024 · github.com · ▲205
Hello HN, It has been a while since I contributed to the web, so I decided to get back in shape and publish "something". This app is a POC of "what if diagrams were more dynamic". I'm a software engineer by trade, and with conventional tools, I often times struggle to explain flows of data in complex software systems. I got inspired by video games like The Incredible Machine and Factorio, as in some ways, software systems tend to become Rube Goldberg-esque machines ;) As a side quest, I also wanted to craft diagrams faster than text-based tools (ex: mermaid), as I am always forgetting their…
- IVInstantly visualize any codebase as an interactive diagram2024 · gitdiagram.com · ▲222
GitDiagram is an open-source micro dev-tool that I made this past week Given any public GitHub repository it generates diagrams in Mermaid.js with Claude 3.5 Sonnet I extract information from the file tree and README for details and interactivity (you can click components to be taken to relevant files and directories) Also, you can replace "hub" with "diagram" in any repository URL to access its diagram I created this because I wanted to contribute to open-source projects but quickly realized their codebases are too massive for me to dig through manually, so this helps me get started I do…
- CCCodemap – Codebase Visualizer for JavaScript, TypeScript, and Python2020 · codemap.app · ▲84
- TATurn any workflow diagram into compilable, running and stateful code2025 · workflows.diagrid.io · ▲109
Hi HN folks, I'm a co-creator of the Dapr CNCF project and co-founder of Diagrid. Today we announced a free-to-use web app that takes any form of workflow diagram (UML, BPMN, scribble in your favorite drawing tool or even on paper) and generates code that runs in any IDE and that can be deployed to Kubernetes and other container based systems, based on Dapr's durable execution workflow engine. This essentially allows you to run durable workflows in minutes and leaves out the guesswork for how to structure, code and optimize a code-first workflow app. I'm happy for you to give this a try and…
- WCWe create visual codebase maps that scale (static analysis and LLMs)2025 · github.com · ▲6
Hi all, I'm Ivan, and together with Alex, we're building a diagram visualization tool for codebases. Alex and I are devs, and we've noticed that recently we've been super productive at writing code (prompting :D). But when it comes to understanding big systems, prompting doesn't work that well — for that, diagrams are best imo. Most tools out there don't scale to big projects (e.g. PyTorch), so we're building CodeBoarding — a recursive visualizer for codebases. It starts from the highest level of abstractions and lets you dive deeper. We use static analysis and LLM agents. The control-flow…
More dev tools this month
the category →
Open-source GTM skills for technical founders
Dev tools · 29d ago · gtmcofounder.com
Lettertrace▲375Track your AI visibility for free (using your own API keys!)
Dev tools · 25d ago · lettertrace.com
Launched alongside, January 2024
the whole month →
- IM
Life & fun · 2024 · sitinshade.com
