Show HN: Haystack – an IDE for exploring and editing code on an infinite canvas
This is really cool! I like the fact that when you navigate to a method/declaration/whatever, it only contains the relevant snippet, rather than opening a secondary tab with the whole file scrolled to where the definition is.
I often end up in a situation where I keep losing track of whatever method I'm reading since I need to compare where a method is called vs its definition, which is frustrating. I like that I can just "pin" the method to the side, and can glance at it without accidentally switching to scrolling through the whole file in the pinned view.
I tried it out for a bit and I found it a bit too mouse-centric unfortunately, and I quickly ended up in a situation where I had way too many floating windows to manage, especially once I got into checking out methods inside of other methods. It would be nice to have an arrow or line to keep track of what the "parent" window is so that it's easier to build a sort of flowchart.
Regardless of my personal issues with it, hope you succeed with this! It's great to see alternative ways of thinking in this space, as I often feel things could be better but it's also hard to imagine how.
Congrats on the launch. I've actually been going in a totally separate direction lately, it helps with my focus and ADHD tendencies to jump around and get overwhelmed.
1. One window. 2. Minimal everything. 3. Most importantly, no tree navigation.
If I need to jump to a file, I either use recents menu in Intellij or use file markers to jump to it, means I have to remember the filemarker and have intent to go there (I'm using IdeaVim plugin for vim hotkeys). This, to me, make programming much more focused and pleasurable. This is part of my evolution from multi screen to widesreen and then back to a single screen.
For large and mature codebases like you mention, I just use LLM to guide me around.
Interesting, some notes:
- obsidian has similar feature called "Canvas", perhaps look at their work flow.
- For me this is uselles as a standalone tool. I need it as Idea plugin.
- creating layouts is the part I hate. Perhaps some AI that takes Git patches, or bug fixes and creates layout based on that.
- sharing layouts needs to be super easy
- integrate Git history as another dimensions. Diff and blame N notations in editor.
- there are data (git commits) that you can use to train AI.
- integrate debuging as another dimension
- integrate data from profiler...
I've been wanting to try something like this for a long time! Is there any way to sign up for updates?
(In particular, I'm waiting for the option to turn off the AI stuff, at least for when I am trying things out.)
I especially love the ability to zoom into a function and hide the rest of a file. I've wanted that sort of thing a surprising number of times. I'm thinking one could also use this to virtually rearrange a single file by pulling the functions in that file that you are working on next to each other easily?
In addition to the editing interface, I think there are probably a lot of visualization opportunities in editors:
- what's the interaction between my code and third-party dependencies? - what are the dependencies/call graph of my code? or perhaps just a portion of it? - call graphs can be nested — perhaps you care for a dependency graph at the class or module level, or perhaps you want to "drill down" into the call graph inside an object
In all these cases, being able to seamlessly transition between the visualization and editing — like you seem to be aiming towards — seems like the killer feature.
And, of course, there are lot of other interesting visualization opportunities once you have any sort of graphics in your editor:
- heatmaps of code churn - heatmaps of code performance - tracing variable usage - and, of course, lots more (https://adamtornhill.com/articles/crimescene/codeascrimescen...)
One last thought: if you haven't read _The Programmer's Brain_, you should at least listen to this podcast. https://se-radio.net/2021/06/episode-462-felienne-on-the-pro... There are a bunch of editing ideas related to how our brain works that I haven't seen well supported in an editor yet. You took one step in that direction — maybe there are some more opportunities?
Looking forward to what you come up with!
I really like the way it lets you navigate from function to function (and file to file) and back again. What would be even more useful would be to have a "history" window, similar to your browser's history, that would show the list of files/functions as I'm navigating from one to the other. This would allow me to step forwards or backwards, or even jump to anywhere in my navigation history, without having to slog through the open windows.
Note that this "navigation history" I'm thinking of would be completely unrelated to my edit history; undoing and redoing an edit would not bring me forward/back in my browse history, and vice-versa (although there could certain be keyboard shortcuts for traversing the navigation history as well).
Cool! Related to code bubbles: https://dl.acm.org/doi/abs/10.1145/1753326.1753706
> We do not store or log your code anywhere. We do send snippets of your code to Open AI as input for our navigational copilot. We'll add an option to disable this soon.
I look forward to checking this out once that option is in place.
I published a paper comparing navigation time with a canvas-based editor (Code Bubbles) vs. traditional tab-based editor (Eclipe) vs. a carousel-based editor (Patchworks, a tool I designed).
We found the canvas provided too much freedom.
Congrats on the release. This looks like an excellent, well implemented in tool. I look forward to trying it out.
It reminds me of a feature I've always wanted, and even built manually a couple times, but never in a shareable way, which is to unravel a code path into a single script or source file.
I've want to be able to set something like a breakpoint and hit an "unravel" button and be left with a single file that shows every action that occurs leading up to that point. Ideally it would be runnable as a single script as well. This is essentially the view a step debugger gives you, but I want to see it all in a single file from start to finish rather than I. Multiple layers referencing multiple files.
This looks really interesting and well thought out. Nonetheless, I feel like the OS window manager should provide this kind of experience, with appropriate hooks so that an IDE can implement this sort of experience with native windows.
I really liked using PaperWM¹ for a while, however, I'm still waiting for it to get more stable.
Another system that is sort of similar to this concept, Pipeworld² (part of the Arcan project) is an impressive research UI experiment which is a bit too far out for my daily use.
1. https://github.com/paperwm/PaperWM?tab=readme-ov-file#paperw... 2. https://arcan-fe.com/2021/04/12/introducing-pipeworld/
This is pretty cool!
Reminds me of the now defunct SourceTrail tool: https://github.com/CoatiSoftware/Sourcetrail
Actually, seeing lines between the code and where you opened it from would most likely be useful!
Wow, this looks wonderful!
I want this to integrate well with type checkers. For example, if I edit a TypeScript function and it causes several type errors, it's nice to open all files and jump to the errors. If more edits cause other errors, open those files again. This would make code changes much easier!
In my minds eye I've been yearning to see an IDE that focuses on a zoomable interface.
This looks like a good start.
I wonder if you've considered (or if there's already) an integration to Git to assist in reviewing pull requests? I often find myself jumping around in VSCode trying to understand some subtle changes in the PRs I'm reviewing which might have small one line changes to many functions.
Understanding how all of those are tangled together would simplify reviews a lot. Especially if the code in question touches places that I haven't visited in a long time (or written by someone else who might have slightly different style of architecting).
I could already see myself using the tool for pair coding / explaining my own PR to others, this looks seriously nice for any sharing.
Is it partly inspired by Smalltalk browsers?
You should definitely check out Understand https://scitools.com/features, if you haven't already.
Can you find code across service boundaries? I work with about 15 micro services right now, and finding root cause of an issue can be ... tedious.
Awesome!. I like the focus on a specific part instead of the whole file. This is built to address a very clear set of human problem: Working memory and distraction due to clutter. In general, using a machine to work with the human to solve a problem: Understanding and editing a code base that is formidable.
Use case 1, which you solve, is traversing your own - rather large - code base to do editing, but then there is also the usecase of traversing a new code base base and understanding it by reading/writing a unit test. And also the case of a person who is new to a language but is trying to understand a project. All while that memory pressure is causing him to forget/tire.
In general, I feel one comprehensive way to solve this is using the Theory Of Mind idea from AI-Planning:
1. Set the goal and subgoal of what you are trying to do: Typically these are: Edit code base to add feature, Edit, the code base to add tests, Understand code base by reading/executing a test. But there could be more based on goals and intentions of the person reading the code. These goals come with a set of Actions the system is capable of.
2. Your system can generate/propose a set of actions to meet that goal. Starting with the basics. LLMs could be used to generate "ideas" based on the goals which could be converted to a formal plan which could then be presented to a human in NL [1]. These plans could be just steps based on call graphs at first(very deterministic). But it could also mean that changes could affect other functionalities that you previously understood and now the understanding is obsolete because of those changes. Implementing an Agent that knows what you know and doing it well is a Theory of Min(ToM) implementation that is the holy grail of AI.
This is awesome. Are you using tldraw?
We're building a canvas for data / analytics at Definite[0]. Quick demo[1].
In order for the canvas to be meaningful, the individual code windows need to be related to each other; eg. like a visual programming language or a notebook, with sockets and connectors.
Otherwise, it needs to be more like canva / miro, where the canvas is a rich target to place notes and graphics with the code editor embedded in it.
I think iterating on the linear jupyter notebook (eg. make it a graph of executable script blocks) is a worthwhile thing to do... but just having multiple code windows side by side is something you can already do, with normal code editors.
So... I think most people will find this isn't as exciting as they imagine.
I downloaded it and had a play; honestly I found it quite charming and it worked well, but I immediately wanted to put sticky notes next to my code files like it was a miro board, and then zoom out to see all the files arranged together; but you can do neither of those things with it currently.
So... cool idea, but after using it for 30 minutes or so I couldn't really see any particular reason currently to not just go back to vscode...
I really really wanted to open it up, drop 5 files onto the canvas and them zoom out and edit them all at the same time, and I couldn't.
(but hey, you can literally just download and run it, and it works. Have a play, see what you think. That's just my first impression of it)
(side note: boo. AI. There's literally zero value in the AI attached to this. Just rely on your vscode extensions if you want that. Having it baked into the editor is lame 'I also do AI!' hype. I couldn't see any reason it has, or you would want, to have baked in AI instead of any normal vscode AI extension)
Apologies if I missed a repo link, but ... no open source, no go.
Awesome I've wanted this exact kind of thing for many years - a code editor that lets me create funnels of code sections/functions for flow through an app - because you're often working through a particular flow in an application spanning many files. Definitely trying this out
Very good work! What we would actually more helpful is a Window manager that acts like that instead of an IDE. That would be very useful for overall experience. Ideally window should be left to window managers. What would be more powerful is force directed graph of windows.
I can't get jupyter notebooks to render in the editor windows while I know the python language server isn't up and running yet being able to open the files using the extension on a vs code based IDE would be useful
Looks pretty interesting. A Figma style zoom in and out could help give you the big overview. I always get lost in the gazillions of tabs in IDEs. Stuff like this allows people to use their spatial memory, which is underutilized in a lot of tools.
There was CodeRibbon for Atom to navigate the code you work on: https://coderibbon.github.io/CodeRibbon/
How do you feel about that view of navigation?
I downloaded this and opened up a React based project that uses functions and not classes. I'm not seeing the sideways facing arrows to show the call stack of the function I'm looking at and have my cursor in - the functions that call the function I'm looking at and the functions that reference the function I'm looking at.
It seems the sideways arrows in the demo only appear for class based methods and not plain functions :(
Overall I love the idea and have wanted a graph visualization of a codebase showing every function call, who calls it, and who it is called by which this seems to do but for classes. Hope to see this working for functions as well soon! Great work.
That's a very cool concept but I don't understand how to use it. The 4 buttons above a pane (?) have no label or tooltip so I don't know what they do. Even clicking on them nothing happens, so it's not clear what the arrows, or blank paper, or the... thingy, do.
The zoom control with the wheel seems wrong too, scrolling up should zoom, not dezoom.
I also would like to display a single function in a pane but it doesn't seem to work, at least with Go code.
All in all that seems very well done and very close to what I'm looking for, but the UI is a bit confusing
In general, the issue is that we can not NAVIGATE INTO sections in files, but just can FOLD THEM AWAY. Also, a system of linking to sections is missed.
Some tools can do that however:
On Windows I use Code Browser – https://github.com/nilslindemann/Code_Browser_49 – It has its bugs, but I still love it very much. Does not work decent on Linuxes (Newer versions do, but miss features)
Leo is another editor, but it annoys me in many ways. It is just not polished enough.
Nice to have another contestant now.
In the end isn't it about maximising the pixel space you have in a way that avoids lots of panning or scrolling, allows you to easily arrange related parts nearby, all while maximising the ability to context switch?
I find multiple workspaces works well for large context switches, then within each workspace, maximising pixel space is done with sloppy/mouse focus, partially overlapping windows and the ability to split my text editor windows easily.
Really cool. Two suggestions to think about:
1. add a small button in the window title bar to pick a custom title or background color (from a predefined list of 16 or so colors). The color should be remembered somehow. With many windows open it would help quick orientation.
2. an ability to quickly load/save the current layout. When I work on feature A I want to see these windows, ... When you load a layout you could either fully replace the current one or add to it.
Interesting. It reminds me of the text editor Sam, in a weird way. A very, very evolved descendant of Sam, at least.
I love seeing software design that throws out convention and tries something new. This might not end up being for everyone, but if it's for someone, then it's helpful. The fact that it's based on VS Code means I could potentially use it for all of my professional work.
This looks way too mouse reliant to be something that I'd personally use. It's always interesting to see new approaches to ides though
Looks interesting, but the contrast between white background and actual windows is preventing me to use it. How can it be changed?
The landing demo really needs to show off the "infinite" part, instead it's just showing that windows in windows are clutter and need manual resizing to fit inside the box. E.g. show how it helps structure clusters of a hundred files all open at the same time, on an infinite canvas, in a way that is quickly traversed?
Nice work. It may not be a priority right now but I personally really don't like to have to move windows, see them overlap or not align because they have different widths, and have to resize them... I would love to see a good tiling (with optional padding between them maybe) Some kind of vertical masonry layout ?
Not a coder any more, but I wonder if a UI like Scrivener (https://www.literatureandlatte.com/scrivener/overview) would work. Each "scene" would be a function.
I am VERY interested in using this on Linux! But am only able to use it when the openai opt-out is available on linux. Hope you guess implement it for that build soon!
Very late but if you would like to follow along for updates or give me feedback, feel free to follow me on Twitter or give me feedback: https://x.com/AkshaySubr42403
It's interesting! But the spatial aspect of having to place the windows i believe will become a huge annoyance.
Sure is a good way to start, but imo you'll need much more ergonomic points of transversing, and nail for at least a couple dev scenarios.
This is awesome. Can't wait to try it. I feel like this is how I work with code already but in a much more cumbersome way. My only wish was that it felt more like a JetBrains IDE and less like VS Code, but that's just personal preference!
Congrats on the launch! Looks good! What's the plan for commercializing it? code visualization is one of those things that sound incredibly useful for developers but actually really hard to sell/get someone to actually buy it.
This is really neat, quite a paradigm shift from the IDEs we’ve been using for decades
Tried this tool, but cannot navigate through a python project. Is this something that is not supported at this time?
I posted this previously, but this, and notebook style output, then flat textfile view would be the sweet spot for universal development. I vasilate between notebooks and vscode to develop most of my projects.
How is it better than the open-source CodePod IDE (https://codepod.io)?
how can I make the canvas color dark ...? white hurts my eyes ^^'
https://project-haystack.org/ is what immediately came to mind when I read "haystack".
Looks pretty interesting. Although I have been a Java developer and has a preference for Eclipse, would like to see if this can ease out some parts of development for me.
Very cool concept! Will it be possible to make "boxes" with labels/titles so different frames can be grouped? And will zooming of the canvas be supported?
Love this, As a visual person wanted something like this for a long time. Please add more features and video guides on how to use this most effectively!
Nice. Reminds me of PyFlow: https://github.com/Bycelium/PyFlow
That's a great idea! Would love to see a lightweight version of this as a VScode extension only to browse through the code.
Wow this is amazing! I couldn't tell from the demo but can you zoom out? I can't wait for the windows release!
It would be amazing if you could add notes or draw on the canvas in the unfilled spots but this is a pretty cool idea
This is really nice - there is something about the whole concept that feels smooth in comparison to switching tabs.
I spent the last five+ years full-time deep diving the infinite canvas UX problem space if you happen to be hiring ;)
This is a neat idea. I have thought for ages about doing something like this, but for spreadsheets. Great work!
I think canvas apps is a huge thing coming
I quite enjoyed this style of editor while playing The Farmer Was Replaced. Cool to see it as an actualy IDE.
Can I manually add arrows between two parts of two files? How can I create textual notes in the canvas?
The moment I saw the screenshot I was like "oh now I know what is was missing"
This is amazing! I would love the ability to connect a line from one code snippet to other.
it brings me a thought: is it just me who kind of hate the "super-modular-files-with-10-lines" way of doing things today? would love to get back to the way of doing things in the past, like super well-commented files, with hooks here and there to help you navigate, single file for single contexts...
Can you have a black background? My eyes object to dark windows on a white canvas-
This could be really nice on a VR headset with all the floating windows.
Hover doesn't seem to be working
Looks a little like Labview without the data flow features. Interesting.
Oh nooooo, this is MacOS only? This is amazing and I need this so badly.
Okay! first thing first, this is super cool. Kudos to the whole team. I did some fiddling around and found it usable and I think I can get used to it. However, there are a couple of things that it can improve on. And I have listed a few here.
1. Allow zoom ins and zoom outs in the canvas. It is super hard to navigate through the files otherwise. One way I can see this working is I would make a file graph view which can be obtained by zooming out of it enough, or just a toggle somewhere. That way I can easily navigate through the files.
2. I was not able to create edges or connection between the panes. I had opened a python/django project. So if there is a feature for manually creating edges between the panes, that would be awesome.
3. There are sometimes files that are more important than others. For such cases if I could visually mark those, say perhaps by color or labels, the panes would make more sense. An example for this scenario in django would be, different colored panes for views, forms, urls, models and setting files.
Apart from the features mentioned above, I did not miss anything at all. Once again great work.
I couldn't tell -- does this editor work with Remote ssh?
This fits my mental model when coding so well. I love it!
Is “canvas” a technical term? What does it mean?
Are you hiring? I'd love to port this into your framework.
So it’s a more fancy/cpu intensive neovim without the learning curve?
I don’t know, looks cool. But seems like it would get annoying after a period of time. Too much dependency on a mouse for me.
How about making it 3D? :D
great idea! reminds me of lightroom what ever that ide was. But can this infinite canvas be implemented in VScode?
Nice! I think this is a step in the right direction of the future of IDEs. So tired of switching between dozens of tabs which are either sorted by name (fixed and useless) or usage (chaotic) in common IDEs like Intellij and VSCode.
Kudos for thinking out of the box ;)
Background colour control needed!
That reminded me gtoolkit.com
I think the title should make it clear it’s macOS only, before getting my hopes high to test it out, it looks interesting nonetheless.
[flagged]
[flagged]
Namespace conflict, and yes it does matter. Just as "mamba" was an anaconda package manager re-implementation before it got commandeered by the LLM research crowd, now Haystack is being stolen away from Deepset: https://github.com/deepset-ai/haystack
I'm not sure about the AI features but the concept of working with code on a canvas and having some sort of flowchart UI has been a dream of mine for some time. I mainly do data processing and draw lots of flowcharts for communicating pipelines and also for myself. Having a development UI which goes in that direction somewhat would be great for handling unwieldy codebases written by non-CS folk.