\

Show HN: Nogic – VS Code extension that visualizes your codebase as a graph

124 points - yesterday at 6:43 PM


I built Nogic, a VSCode extension currently, because AI tools make code grow faster than developers can build a mental model by jumping between files. Exploring structure visually has been helping me onboard to unfamiliar codebases faster.

It’s early and rough, but usable. Would love feedback on whether this is useful and what relationships are most valuable to visualize.

Source
  • pentaphobe

    yesterday at 9:43 PM

    All the GitHub links on your extension page are borked (including issues)

    From the look of the associated domain it looks like you're going full product, best of luck

    I'm a huge proponent of graph & visual analysis of complex systems - would have loved to try this out, but will always skip closed source editor extensions (especially in the age of widespread npm supply chain attacks & vibe coding)

      • welder

        today at 12:28 AM

        Here's the source code minified and bundled:

        https://www.gallery.vsassets.io/_apis/public/gallery/publish...

        Unzip that archive and the source is in extension/dist folder.

          • phil-martin

            today at 8:10 AM

            I’m confused - is it the actual source code, or minified/bundled code? I don’t think those two are the same thing - unless of course you write your code minified. That would be really impressive.

        • davelradindra

          today at 1:28 AM

          We will make this project open source soon!

      • vmware508

        yesterday at 10:23 PM

        I guess it is still useless in Ruby or Ruby on Rails. Standard "find the method declaration" or "used here" do not work in Ruby on Rails. Still, huge companies maintain that Ruby on Rails mess, where you cannot properly investigate, so you just guess and use the search and find option. Those codebases won't be replaced for a while, but good luck working on them. Such a headache!

          • rochak

            today at 8:13 AM

            Man am I glad I don't have to work with Ruby anymore

            • TheRoque

              yesterday at 10:26 PM

              How come nobody came up with an LSP that can perform this, all this time ?

                • federicotdn

                  yesterday at 11:04 PM

                  I've developed a small tool[1] that has helped me for the same problem, but in Python. Basically just uses simple parsers to attempt to find a definition wherever is sensible. Adding a Ruby module should not be too difficult, but it would probably be trickier than Python to get some good enough results

                  [1] https://github.com/federicotdn/irk

                  • IshKebab

                    yesterday at 10:39 PM

                    Because it's an unsolvable problem without static type annotations and as far as I'm aware Ruby doesn't have a good solution for those yet (or if they do nobody uses it).

                • louiskottmann

                  today at 8:59 AM

                  First of all, ruby-lsp does a great job at this, and the recent Herb helps with frontend templates.

                  This is enough to navigate between controllers, models and libs, unless you're trying hard to be clever which you shouldn't.

                  Then, in Rails, things have a canonical place in the codebase, that is consistent between codebases.

                  This is in contrast to languages and frameworks where every codebase is setup differently, but the static typing helps find code wherever it's hidden without pain, and thus without need for cleanup and thoughtful design.

                  To each their own, I prefer power for me, and pain for whoever drifts from the convention.

              • bulletsvshumans

                yesterday at 11:21 PM

                Please publish to Open VSX so it is easily available for VS Code forks like Cursor as well.

                • tiborsaas

                  yesterday at 10:59 PM

                  I've tried it, but it's very slow on a not too complex codebase with my M3 Macbook Air.

                      --------------------------------------------------------------------------------
                       Language             Files        Lines        Blank      Comment         Code
                      --------------------------------------------------------------------------------
                       Typescript JSX         121        18724         1699         1051        15974
                       TypeScript              61         5389          629          550         4210
                       CSS                      5         1039           50           22          967
                       Markdown                 3          657          173            0          484
                      --------------------------------------------------------------------------------
                  
                  It was like 5-10FPS at best, not really usable unfortunately because I like these tools.

                  I'm using another similar one which is buttery smooth, Code Canvas.

                    • davelradindra

                      today at 2:16 AM

                      We are actively improving on the performance! Also, I am a previous code canvas user too, but I felt like it didn't help me understand my codebase as much as I wanted it to.. that's why I decided to experiment something myself! :)

                        • tiborsaas

                          today at 9:27 AM

                          Thanks, CC is really helpful already for me the more tools like these exists, the better. With AI coding agents, I keep watching the visualization rather than the changeset first.

                  • everlier

                    yesterday at 9:22 PM

                    Nice, I wanted to build something similar for a long time. The coolest thing is to start summarising clusters for very large codebases, which essentially provides an LoD system for the context.

                      • davelradindra

                        today at 2:23 AM

                        We were thinking of creating an MCP Server that could integrate well with the visualizer extension so that you'd understand the cluster visually and descriptively, so watch out for that! :) X: @Davellele

                    • oersted

                      yesterday at 11:23 PM

                      Looks great, it was actually just playing around yesterday with `code canvas app` which is similar, and also Charkoal.dev and Haystack Editor (before code-review pivot) which are related. Yours looks better than any of them already!

                      I wish it was available in Cursor as well though. Not sure how exactly they manage their marketplace, most VSCode extensions seem to be there but now and then I encounter one that is missing for no apparent reason.

                      • puppycodes

                        yesterday at 10:53 PM

                        I definitly think more tools like this are needed, but not open sourcing it is a mistake.

                        You will be quickly replaced by a friendlier competitor.

                          • dcreater

                            today at 12:02 AM

                            There already are open source extensions. Visor is one I remember off the top of my head. https://marketplace.visualstudio.com/items?itemName=sidhants...

                            • davelradindra

                              today at 2:19 AM

                              We will make it open source soon! Follow me on X (@Davellele) to be updated when we do :)

                                • puppycodes

                                  today at 3:28 AM

                                  Thats good to hear but what are you waiting for?

                                  • fortyseven

                                    today at 8:16 AM

                                    Twitter/X is a big nope.

                            • aqula

                              today at 7:34 AM

                              Really cool! I'm also dabbling with this idea. The biggest challenge I find is to reduce noise. Large codebases come with a lot of cruft. Surfacing every small detail in the visualization tends to make it messy and less useful. I've not seen contemporary tools tackle this, but think can be useful.

                              • nebula8804

                                yesterday at 10:03 PM

                                Very cool visualization. However it crashes on a more complex project. I added a folder with 2000+ files(included my assets) and now the visualizer locks up then shows nothing on its tab in VSCode. How do I manually delete old boards so that I can try again with a smaller slice of the code(without assets)?

                                • apem

                                  today at 8:18 AM

                                  Super cool! I've thought of literally this so many times.

                                  Is there any way to add a file to a board, then "explore" the imports of that file and potentially adding those files as well? I'm thinking as a way to explore a code base better.

                                  Best of luck :)

                                  • Imustaskforhelp

                                    yesterday at 10:03 PM

                                    Funny how world is so tiny. I am literally building myself an vscode extension which can abstract an api on top of google colab's vscode extension and I am able to effectively create a sandbox for any python code (I mean to be fair they all still share the same resource but that resource is of google)

                                    I have also hacked together a way for it to create new kernels aka new vm's itself but that becomes really really slow and also I am trying to look at other options to sandbox inside the jupyter notebook itself.

                                    The end result was very messy though so I was literally just currently experimenting with if I could just scrape/automate it from the browser directly.

                                    All in All I must admit that Vscode extensions are/feel very quite competent from what I can gather.

                                    • patabyte

                                      yesterday at 10:20 PM

                                      I've been having great success with LLMs generating Mermaid diagrams and flowcharts from a repo. Claude Code and Cursor both do consistently great jobs. For example: `generate a mermaid swimlanes diagram of the XX logic flow`.

                                        • davelradindra

                                          today at 2:25 AM

                                          This is what I do previously too! The problem that I realize with them is that mermaid diagrams and flowcharts are static and sometimes oversimplified.

                                      • kelsolaar

                                        today at 2:25 AM

                                        Quite enjoying the idea as I have been looking for something like this for a while but it is reallllllly slow for our medium sized codebase, I have like 2 or 3 fps on my M1: https://github.com/colour-science/colour/tree/develop/colour

                                        • fpauser

                                          yesterday at 10:00 PM

                                          Closed source vscode extensions: not for me.

                                            • davelradindra

                                              today at 1:15 AM

                                              Will be open source soon!

                                          • fishgoesblub

                                            yesterday at 10:02 PM

                                            Unfortunately the repository links are broken and this is ARR licensed.

                                            • wek

                                              yesterday at 9:49 PM

                                              From your first page, this looks cool and needed. But as others have posted, I can't get to your github pages.

                                                • davelradindra

                                                  today at 2:26 AM

                                                  Will make it open source soon!

                                              • Aspos

                                                yesterday at 9:46 PM

                                                The illustration gif is way too fast. Hard to understand what is going on. Slow it down 2x or so.

                                                • suprjami

                                                  yesterday at 10:38 PM

                                                  Only JS, TypeScript, and Python. You got me all excited for a C visualizer!

                                                    • davelradindra

                                                      today at 2:27 AM

                                                      Will definitely come!

                                                  • kachapopopow

                                                    yesterday at 11:16 PM

                                                    I always liked the idea having relationship based programming (graph programming), but with actual code. Never actually made the effort to make something like that. Pretty neat either way.

                                                      • davelradindra

                                                        today at 2:26 AM

                                                        Thanks! Shoot me a message if you would like to have something added :) X: @Davellele

                                                    • Scene_Cast2

                                                      yesterday at 11:07 PM

                                                      I used to use Doxygen to create caller and callee graphs to understand code flow. Unfortunately, the tool hasn't really changed in more than a decade.

                                                      • yesterday at 10:49 PM

                                                        • dolevalgam

                                                          today at 2:09 AM

                                                          This is incredibly needed!!

                                                          • matiszz

                                                            today at 2:21 AM

                                                            This is incredibly useful!

                                                            • frmfrm

                                                              today at 7:42 AM

                                                              Very nice!