Ask HN: What would you want from a diagrams-as-code editor? | Hacker News Reader

Ask HN: What would you want from a diagrams-as-code editor?

3 pointszero_shift5 comments

I'm thinking of taking on a new open source project. This would be a native desktop application distributed under something like GPL or MPL2.

As a software engineer I do a lot of architecture and process diagrams but I find existing web editors for things like D2 and Mermaid somewhat cumbersome. I was thinking of building a dedicated, native editor.

Some features I'm thinking of:

- autocomplete and macros for faster composition

- wizards for common diagram types

- save diagrams as editable PNGs / editable SVGs

- generate code for git "architecture" repositories

- create themes for diagrams

- offline documentation for language syntax

- generate diagrams from json (nodes / edges lists)

- some form of LLM assistant integration, e.g. to bootstrap diagrams with a prompt

What features would make something like this worth using, to you?

I use Mermaid a lot, and my biggest gripe is the lack of normalized syntax. Everytime I want to create a new type of diagram, it's like learning a new language. I'm a big diagram-as-code proponent (https://ashwinsundar.com/posts/diagrams-as-code/) - however, I get the impression that no one at Mermaid is really talking to each other when making new features. There doesn't seem to be much thought for how to make the syntax cohesive or easy-to-grok

I love that Mermaid is portable, but I hate its syntax. I wish I could just define the things graphically, dragging nodes around an auto layout canvas, and then have it generate the corresponding code that I could then further edit.

In other words, the graphical output wouldn't just be a preview of the code, but an editable canvas like Figma or SVG editors.

Mermaid is so terrible to work with I usually have to use ChatGPT to make all but the simplest diagrams. It is not very good at it though and will frequently hallucinate invalid syntax, especially for less common charts like sankeys.

I agree that Mermaid is kind of a bad language. I get the impression it was the creator's first real DSL project and this has lead to the jumbled syntax.

I've found D2 better. There's more control over the layout, the syntax makes more sense. But the web editor is limited.

Maybe what I should do is prototype some kind of bidirectional editing for Mermaid. So that you could add / remove / combine / group / reorient the graph items through a GUI. I have some ideas for how to do this

shouldn't this be called code-as-diagram?

No.

Reply on news.ycombinator.com