8 ms·
Codemaps: Understand Code, Before You Vibe It
- jrochkind1 11mo agoFiguring out new codebases is definitely one of the most challenging and time-intensive things I have had to do in my jobs.
- swyx 11mo agowe obviously agree but one of the problems i had with onboarding as a key proposition is that onboarding "seems" like a onetime problem. i lacked the datapoints or anecdotes to convincingly pitch "onboarding = context switching", a more recurring problem as the size of your team and size of your codebase and size of your tenure grows, even if its technically the same codebase, you're "always" onboarding to wahtever it is you're working on or maintaining or putting out fires.
- jrochkind1 11mo agoDepends on how big the codebase is and how many people work on it and how often you need to switch to an unfamiliar context, but yes agreed, it's context switching, and is a regular thing. It is part of the job of software engineering, learning piles of code you were previously unfamiliar with.
- shklqm 11mo agoI feel like understanding the codebase should be the default thing the AIs would need to do first. This sounds promising though.
- bluelightning2k 11mo agoI really think more people should give Windsurf a go. It's really good. I'm a senior engineer and do a mix of agentic and regular coding and I really think people are looking past Windsurf. As the conversation shifted towards Cursor vs Claude code vs Codex people seem to have stopped mentioning it which is a shame. Source: user for 12 months - not a shill. Codemaps was a very pleasant surprise when it showed up.
- sama004 11mo agoI just tried out windsurf yesterday, The only thing I hate for now is that when there are changes and I accept one of them, then trying to accept the others gives an error saying the file was changed
- all2 11mo agoThis is enough for me to give this a go. I've tried a few different tools; abacus.ai (and their IDE), claude CLI, crush-cli. My workflows are still mostly on the command line, and a little in VS Code. I haven't found a flow that works "right", yet.
- swyx 11mo agofirst mention i've heard of abacus.ai and IDE. what do you think stands out about them? you might struggle with Windsurf since you're so command line heavy. but pro tip - ask for command line work to be done inside of Windsurf's Cascade agent. they were first to the terminal-inside-aichat pattern and i really like how it's much better at command line stuff than i am (or can do the legwork to specify command line commands based on a few english descriptions)
- 11mo ago
- swyx 11mo ago(coauthor) happy to take any questions! see 1 min demo video here https://x.com/cognition/status/1985755284527010167 https://x.com/cognition/status/1985755284527010167 this is brainchild of cognition cto steven who doesn't like the spotlight but he deserves it for this one https://x.com/stevenkplus1/status/1985767277376241827 https://x.com/stevenkplus1/status/1985767277376241827 if you leave qtns here he'll see it
- bluelightning2k 11mo agoLess a question and more a strong suggestion: codemaps should be viewable in the main pain. The sidebar is FAR too small. Either default or a button or something to open it like an editor tab.
- swyx 11mo agoacked. you can also open it in a browser window for now https://windsurf.com/codemaps/9e2791c4-0b14-4757-b4be-a71488f8e344#1c https://windsurf.com/codemaps/9e2791c4-0b14-4757-b4be-a71488...
- bluelightning2k 11mo agoRight but you're an IDE and I want to view code (and especially the links) in the IDE. Hopefully we can get codemaps in the main IDE panel sooner rather than later. Feels like the very impressive thing (codemaps) is being held back by a trivial thing (reading them in a 200px panel) to the point it's impractical to use themm
- swyx 11mo agojust cahtted internally turns out our dev actually had a PR for it but wasnt sure it was valuable you just helped tip it over the line. see it in next release
- potamic 11mo agoDo you have any examples/demos for very large codebases? Because it's easy to get decent quality output using LLMs on small codebases. But large, messy codebases is where you really need help with understanding.
- ChrisbyMe 11mo agothis is the right way to try and tackle this problem imo. too much focus in AI dev tooling has been on building "products" that only half work. making codebases understandable to humans, and LLMs etc, is a better approach self documenting, interpretable systems would actually solve a lot of dev churn in big companies plus it's not like artifacts have to be limited to code once that's figured out
- esafak 11mo agoI don't think it's a choice; I use both. Code understanding is especially useful in new code bases, but once that's over you need to get work done.
- dennisy 11mo agoLooks an interesting enough feature to give Windsurf a try!
- yunyu 11mo agoGreat idea. I always end up having to tag the relevant files/abstractions anyways to avoid having the LLM produce duplicated slop, and something like this makes collecting this info much easier.
- rmonvfer 11mo agoThis looks awesome. I’m a very heavy Claude Code user (and Codex) in both the CLI and VS Code (and now in the web too!) and it’s quite infuriating when the agent just gets lost after context compaction and I have to point it to read CLAUDE/AGENTS.md (and update it if a lot of changes have been made) I tried Windsurf a while back but I’ll definitely come back ASAP just to play with this and see how it does in a somewhat complex project I’m working on. Kudos to the team!
- asdev 11mo agoA feature like this isn't useful because knowing what connects to what, dependencies, etc. means nothing without business context. AI will never know the why behind the architecture, it will only take it at face value. I think technical design docs which have some context and reading the code is more than enough. This sits in the middle ground where it lacks the context of a doc and is less detailed than the code.
- CharlesW 11mo ago> AI will never know the why behind the architecture… That's true only if you don't provide that context. The answer is: Do provide that context. My experience is that LLM output will be influenced and improved by the why's you provide.
- dingnuts 11mo agoit takes longer to explain the context to the model than it does to just write the code based on the context I already understand, especially since code is more terse than natural language
- Jaxan 11mo agoBut wouldn’t the context also be useful, in written form, to colleagues?
- CharlesW 11mo agoIt absolutely is, yes.
- fizx 11mo agoDefinitely, iff you have to provide the context with every task. If agent memory worked better and across your whole team, then providing context might be much easier
- asdev 11mo agoif you know that context, you don't need a codemap
- deleted 11mo ago[deleted]
- alansaber 11mo agoI really like this kind of applied statistical data infrastructure approach, feels much more natural than just raw text + immediate HIL
- swyx 11mo agohuh? whats statistical about it? i hope i didnt give the wrong impression in the post. but yes, keeping the human in the loop, in charge, on top of the code, is the way to prevent ai slop code
- gnarlouse 11mo agoA few things to point out after reading and thinking about this: - Another AI firm building products focused on Fortune 500 scale problems. If you're not at a F500, this tool isn't necessarily a good fit for you, so YMMV. - static analysis tools that produce flowcharts and diagrams like this have existed since antiquity, and I'm not seeing any new real innovation other than "letting the LLM produce it". They say it's ZDR, so maybe I don't fully understand what problem they're trying to solve, but in general I don't see the value add for a system like this. Also onboarding isn't necessarily just presenting flow charts and diagrams: one of the biggest things you can do to onboard somebody is level-set and provide them with problem context. You COULD go into a 30 minute diatribe about how "this is the X service, which talks to the Y service, and ..." and cover a whiteboard in a sprawling design diagram, or you could just explain to them "this is the problem we're working on", using simple, compact analogies where/when applicable. If the codebase is primarily boilerplate patterns, like CRUD, MVC, or Router/Controller/Service/DB, why talk about them? Focus on the deviant patterns your team uses. Focus on the constraints your team faces, and how you take the unbeaten path to navigate those constraints.
- _jayhack_ 11mo ago> static analysis tools that produce flowcharts and diagrams like this have existed since antiquity, and I'm not seeing any new real innovation other than "letting the LLM produce it". Inherent limitation of static analysis-only visualization tools is lack of flexibility/judgement on what should and should not be surfaced in the final visualization. The produced visualizations look like machine code themselves. Advantage of having LLMs produce code visualizations is the judgement/common sense on the resolution things should be presented at, so they are intuitive and useful.
- gnarlouse 11mo agoAlthough I haven't personally experienced the feeling of "produced visualizations looking like machine code", I can appreciate the argument you're making wrt judgment-based resolution scaling.
- bigiain 11mo ago
- stevenkplus 11mo agofor people too lazy to download windsurf to try it, codemaps is also in deepwiki example: https://deepwiki.com/search/how-do-react-hooks-work-under_7acb09a4-4b49-4e94-8c62-0b5d47e172d9 https://deepwiki.com/search/how-do-react-hooks-work-under_7a... this does a pretty good job of going in the weeds of how the useState hook works in react
- apstls 11mo agoSounds very cool. I wanted to try this out, so I opened Windsurf for the first time in ages and clicked the "Upgrade Available" button, which sent me to: https://windsurf.com/editor/update-linux https://windsurf.com/editor/update-linux Did you install using apt or apt-get? If so... 1. Update package lists sudo apt-get update 2. Upgrade Windsurf sudo apt-get upgrade windsurf Whle `apt-get upgrade windsurf` will technically upgrade Windsurf, instructing users to run a command that will attempt to upgrade all packages on their system is nuts when the command is provided in a context that strongly implies it will only upgrade Windsurf and has no warnings or footnotes to the contrary. Good thing I didn't ask Windsurf's agent to ugprade itself for me, I guess. EDIT - I don't want to detract from the topic at hand, however - after upgrading (with `sudo apt-get install --only-upgrade windsurf` :)) and playing around a bit, the Codemaps feature indeed seems very nifty and worth checking out. Good job!
- kps 11mo agoSo `apt-get upgrade $PACKAGE` has ridiculous semantics that no one would expect, and the actual syntax for upgrading a package is in neither the man page nor the command help.
- normie3000 11mo ago> So `apt-get upgrade $PACKAGE` has ridiculous semantics that no one would expect Especially not an LLM!
- pxc 11mo agoSure it is¹ (kinda): --no-upgrade Do not upgrade packages; when used in conjunction with install, no-upgrade will prevent packages on the command line from being upgraded if they are already installed. Configuration Item: APT::Get::Upgrade. The canonical way to do the thing you want via apt-get is `apt-get install`. And if you read the man page from start to finish, it'd be clear to you... but it is tucked away there in the most obtuse, indirect, ungreppable way. :'D That would be a great addendum to an EXAMPLES section! In the meantime, this is documented well and clearly in the tldr page for apt-get². Fwiw, apt-get not only sucks, but has been known to suck for many, many years (more than a decade at least). Its interface sticks around because it's basically plumbing at this point. But you, as a user, should never use it (or `apt-cache` or `apt-*`, if you can avoid it. Aptitude is preferable for a whole host of reasons, not least of which being that its upgrade commands have the semantics you'd intuitively expect³. They take packages as an optional list of positional args, and upgrade everything only if you don't pass any. (Aptitude also has a ton of other nice features and I highly recommend it.) There's also an official new porcelain in APT itself, aptly called "apt". It preserves⁴ the semantics of apt-get's `upgrade` command, but its usage message actually matches that syntactically— hopefully it'll barf if you tell it `apt upgrade windsurf` or whatever. But automation needs to rely on the ugly, old, disparate APT commands that have been around forever and can't really change. That probably goes, too, for things guides want you to copy and paste, or instructions handed over to LLMs. (This is one reason that if you only learn to use APT from guides/tutorials whose primary concern is something other than documenting or teaching how to use Debian-based systems, you'll probably never learn to use the correct tools (the nicer, newer ones).) -- 1: https://manpages.debian.org/trixie/apt/apt-get.8.en.html https://manpages.debian.org/trixie/apt/apt-get.8.en.html 2: https://tldr.inbrowser.app/pages/linux/apt-get https://tldr.inbrowser.app/pages/linux/apt-get 3: https://manpages.debian.org/trixie/aptitude/aptitude.8.en.html https://manpages.debian.org/trixie/aptitude/aptitude.8.en.ht... 4: https://manpages.debian.org/trixie/apt/apt.8.en.html https://manpages.debian.org/trixie/apt/apt.8.en.html
- ashirviskas 11mo agoSo it is the same thing when I ask Claude to build me mermaid charts of code flows? So no point in this tool?
- bigwheels 11mo agoThis was my conclusion, too! Over time as agentic coders get better at handling higher-complexity tasks, this kind of bracing will become less and less necessary.
- ravila4 11mo agoBtw, claude code is a lot better at graphviz than mermaid! I have been using it a lot for architecture designs.
- ashirviskas 11mo agoI just experimented and it seems like mermaid has much better support everywhere, including gitlab and github, graphviz seems to be mostly forgotten. Are you sure it is better at graphviz?
- kingjimmy 11mo agoOut of nowhere Cognition with a banging product. Probably not 100% yet but the idea is so good I'll be surprised if within 6 months all the other IDEs aren't copying.
- swyx 11mo agohey we been shipping!! https://cognition.ai/blog/swe-1-5 https://cognition.ai/blog/swe-1-5 https://cognition.ai/blog/swe-grep https://cognition.ai/blog/swe-grep https://cognition.ai/blog/devin-agent-preview-sonnet-4-5 https://cognition.ai/blog/devin-agent-preview-sonnet-4-5
- bluelightning2k 11mo agoActually another piece of feedback, the "waves" release notes/videos were pretty cool. Might want to consider bringing them back.
- swyx 11mo agotheyre not gone, just havent had a waves type thing to do in a while
- fHr 11mo agothis is amazing!
- casey2 11mo agoAggressively ironic for a pitch deck that has no respect for the readers critical thinking skills
- charcircuit 11mo ago>whereas people get into trouble when the code they generate and maintain starts to outstrip their ability to understand it. If you are trying to understand code, then you are not vibe coding by definition.
- Madmallard 11mo agoIs this like an entire astro-turfing for AI thread? Can mods like ban these topics? This is clearly just like monetarily incentivized amoral behavior. As far as I understand still working with this stuff regularly. None of the actual problems have yet to be solved at all. AI still produces garbage for anything complex. And if it doesn't, it's because you specified in full detail how it should do everything and heavily hand-held it and reviewed the results, taking more time than just doing it yourself. And it's either that or they are flying by the seat of their pants with the thing and free-balling their way to a broken system.
- pyrale 11mo agoSo we're back to UML?
- zknill 11mo agoI created a side project ~3 years ago based on a similar idea. It was before LLMs were a big thing, and AI could render the code relationships for you. I started with go and java (the two languages I was using in my job) and built AST parsers that would extract the relationships between the classes and functions and draw them with graphviz. Then I created a filter syntax based on regex to filter the graphs. I never followed through on the idea to a production ready version, but it helped massively as a personal tool when working on unfamiliar codebases. The site is still here, but lots of it is probably broken by now.. https://packagemap.co https://packagemap.co
- divan 11mo agoI did something similar but for non-classes based language (Go) and in 3D [1] But I saw it as next step towards shifting programming from sitting and scanning texts into something more tangible, where developer has broad overview of software, and can work on smaller parts while seeing context of how these parts are connected. Ended up concluding that this stuff should work in VR. [1] https://divan.dev/posts/visual_programming_go/ https://divan.dev/posts/visual_programming_go/
- BinaryIgor 11mo agoWell, interesting idea, but can you trust that it generates it properly? Because if it doesn't, then your understanding of the code will be incorrect, even worse than lack of knowledge; and if you do need to check all the things it has generated for you, as a description - doesn't it defeat the purpose of the tool?
- soco 11mo agoArguably, if you vibe code you don't really care about the code, thus even less about the diagram. So you'll vibe something, get a diagram of something to show your boss, and you can move on.
- tleyden5iwx 11mo agoYeah but there are a lot of vibe engineers, and we care about the code, because we have to own it
- raumgeist 11mo agoI really like the idea of visualizing code in any other way than text and have given it some thought from time to time. However, I think the problem here can quickly become that you tend to fall in love with a bad idea. No one, and I don't mean that in bad faith, wants to look at these diagrams. Usually they do not communicate the meaning they intend to do, and I find that I have to spend some time understanding what exactly is meant by any type of box or arrow. What people might want to look at is their mental visualization of the code or math they are working on (or their LLM made for them). At least to me, that is much more tied to what the data will look like at runtime and how different parts from different data-structures will interact with each other. If you were to visualize a flutter app, and nowhere in that visualization the tree-like structure of the widget-tree would appear as such, that would collide with my mental model of how such an app functions. This visualization will be induced by reading the code, much like reading a novel will produce pictures in your head. I'm not sure LLMs are the technology that will produce code-movies you would rather watch.
- tleyden5iwx 11mo agoFeature request: add a Github Action so I can generate a codemap for my repo and throw it on my README. Then update it when major PRs change the codemap.
- abdellah123 11mo agoThis is extremely useful and helpful ! How great is this use case for AI !!!
- tinyhouse 11mo agoLooks cool! I've been doing this a lot recently - a workflow I set up to create diagrams for code using the Claude cli and mermaid. It works pretty well but it's just a diagram - no links to the actual code. The latter is a neat addition that will likely get me to try codemaps.