This Helps You Vibe Code Huge Projects

Okay, so I'm going to go over a pretty interesting brand new feature that came out earlier today in Windsor called code maps. And you can see they announced it on Twitter earlier today with a couple diagrams and this blog post. Basically, I'll talk about what it is and I'll use an example of my own code bases. The fundamental idea is that your coding ability or your vibe coding ability even is constrained by your codebase understanding. And back in the day before vibe coding was a thing and AI was writing your code. In my case, whenever I was working on projects, I knew exactly which files did what. And if I wanted to add a new feature or fix a bug, I knew exactly which file to go to. Also, in team projects, I had a really good mental model of the codebase because I reviewed almost every PR that another team member did and also wrote a lot of the code myself. But now with AI writing significantly more code, I'm starting to feel lost myself personally and I'm sure many other people are feeling like this where you kind of feel like you're walking on eggshells where when you make a change to codebase or add a new feature, you feel like you're going to break a couple more things or the feature isn't going to connect well to existing features and so forth and you basically feel pretty lost in your mind. And I guess where code maps comes in is it helps you build your own mental model of the codebase with the help of AI. And this can be especially useful when your code base gets significantly big. Basically, what Cognition and the Windsor team say is that most AI by coding tools are aimed at relieving you of the burden by reading, thinking, and writing code for you, increasing the separation between you and your code. And this is fine for like low value commodity tasks, but is absolutely unacceptable for hard, sensitive, and high value work that defines real engineering. So of course like if you're making a small tiny project it probably doesn't matter for you but if your project was in complexity and you have paying users such as in my case with hyper whisper in this case like AI has written about 99. 9% of the code I probably have written like 10 20 lines myself out in the thousands of lines and like people are paying for this now it's getting sufficiently complicated that I feel like I'm going to break things when I make more edits to it and I don't have a good mental model of the codebase because I didn't write like most of the code either. So basically what they say is that every big engineering task such as debugging refactors and new features starts with understanding. Most modern code bases span hundreds of files, have multiple services and dense abstractions. And when it comes to onboarding new engineers, there's basically a lot of time wasted. And this is something that most AI coding tools have not solved yet. And I think that's generally true because I don't see many AI coding tools tackling this particular problem. So it's quite nice that Windsor and Cognition overall are kind of like the frontiers of this. I'm sure that overs will follow suit and basically the diagram that they've showed over here is that your coding ability is constrained by your codebase understanding especially for big code bases. So you can see in that diagram you have the limits of manual understanding over here and these are the tasks that you can prompt and then you have a small uplift in vi coding. So like the very small initial stages of the project like the first couple dozens of hours you are more productive because you're basically by coding a lot of the codebase but then you start to hit into limits over here and then you can't write good prompts to the AI either because your manual understanding of the codebase is not very strong. So what code maps is basically designed to help you do is you only introduce it later on at a certain point and then you can prompt more difficult tasks because you can use code maps to have a better understanding of the codebase. And before going to example, I thought this part was pretty interesting with Vibes slop. You see a lot more of this on Reddit these days because people vibe code an application in a weekend and then never bother to update it and the payment system doesn't even work. So if you try paying for it, then like your payment just doesn't go through or whatever. Basically, what they say is that if you look at the differences between the most productive and most problematic AI assisted vibe coders, the most productive ones can serve the vibes of the code that they understand well. Whereas people get in trouble when the code they generate and maintain start to abstract their ability to understand it. So you can see over here if your understanding is low and your velocity is high because your vibe coding then you get a lot of vibes. If your understanding is high and your velocity is also high then you are a 10x engineer. There's a bunch more stuff in this blog post that you can read but anyways if you go for an example in

windfur there is a brand new section called code maps on the left hand side here. And when you go to it you can choose a starting point for your codebase. So using my tool Hyperwisper on my codebase Hyper Whisper I'm going to say hey so I want to add a membership portal where they can manage their membership and credits and so forth. how does the current membership portal work and then press stop and that will transcribe what I said and then I can press enter and I can either choose smart mode which will use Clawson Sonic 4. 5 and that takes 1 to 4 minutes but is generally more accurate or I can choose fast mode which uses Windf's own model which is I think SWE. 5 but I'll go for smart mode in this case and then I have some previous code maps that I've generated so whilst we're waiting for this one I have one that I made here for transcription handling and retry flow. So this was made using the smart model because it has icon here and you can even switch between two modes. So you can go to diagram view and then you can click on any of these particular like sections and it takes you to a relevant part of the codebase that actually does that thing. So I actually really like this particular thing because it groups a lot of things together. So it grouped the automatic network to retry and then basically gave me a rough overview of how it works and then all these other sections too. And then it gave me a description if I press see more of how this particular part of the codebase works. And then if I go to toggle diagram view then it takes me to a mermaid style diagram. And I wish this could open in a new tab or something or it was easier to like move and navigate. But this is basically what it looks like. So this is a retry logic of the entire application and like there's a couple automatic retries, a persistence for like uh saving the retry and error status and a couple other things as well. And the benefit of this is that I can then click on any section such as handle insufficient credits and it takes me to that particular like part of the codebase and then it shows me the other part such as 6E which is throw credit error. And then of course you can press share code map and share it with the rest of your team if you're on the winds team plan or something like that. But you can see that I have the for the exact same prompt I have the code map that was made using the fast mode and then I have the code map made using the smart mode. And I generally have found the smart mode code map to be better and like more comprehensive and more detailed than the fast mode as well, which is kind of what you would expect. So you may want to use a fast mode for like a really small thing that you want to understand and the small mode for understanding a more complicated set of features in your codebase. I also made a nova code map for how this entire project works. So this is like super detailed and it basically shows like I have a mode system, a recording system, uh the app initialization as well. And then I can see where Polar the billing system is integrated yet. And I think this makes me much more confident when I'm making a bigger change in codebase. As for the code map that we made earlier, I'm not exactly sure why this particular theme is messed up because it seems to be light mode when we're using dark mode. But going to the online version of that particular code map, it does look better. So yeah, I think basically the workflow that I'm going to be trying out over the coming days with this new feature is whenever I'm making a bigger change to codebase, I'm going to make a code map of it and then slowly with enough times and code maps on different parts and features of the codebase, I will have a better mental model of how the entire codebase works and I'll feel less lost and then also the prompts that I'm writing because like my mental model of the codebase is closer to what's actually written and how the AI understands a codebase as well because like this was generated by AI. This is how AI understands the codebase. If our two mental models of the codebase are very similar, then I think it means that I will be writing better and more useful prompts to AI and then also getting tasks done faster and also saving on credits as well because the tasks are being done more refined and less changes have to be made and iterations and so forth. One thing you can do as well is that if you open the right hand side and press add to cascade then you can reference that particular code map in the cascade view and then you can say do you think anything is missing from this like billing system here and yeah then you can just look at the response and I really hope that they do take this like feature further as well and then like have like a bigger code map and then you can like click into smaller sections and then like view a micro code map for that particular set of features and so forth and then when you're generating a new feature it kind of shows it like as a preview of how it would fit and connect to existing features after it's made that particular change. So, I really hope they do make more improvements on this and I hope that over AI coding tools do something similar because generally I think this is a field that's worth exploring more for like larger code bases. I will be trying out this feature more over the coming days and then any techniques that I discover or thoughts that I have about it, I will share my AI vibe coding community and this is completely free to join. It's a brand new community all about AI vibe coding and there will be a link down below for those who are interested.