←back to thread

61 points ttd | 3 comments | | HN request time: 0.711s | source

I've been working on a diagramming tool [1] and wanted to get some thoughts from people who regularly make architecture and other technical diagrams. I know my own experiences but I'm quite curious to hear others.

I'm guessing for a lot of people draw.io and Excalidraw are probably the go-to. If you use draw.io (or something else), what do you like about it, or what do you wish was better?

[1] - https://app.vexlio.com/ for the curious

Show context
shagie ◴[] No.43344855[source]
Mermaid - support in many markdown rendering pages. Embedding a ``` block in Markdown and having it versioned as text is the big win.

Graphviz - same basic reason as Mermaid, though no markdown support. Versioning text is a lot easier than versioning binaries.

Draw.io - if you've got to have a binary, this is it. In particular, it allows you to embed the drawing information in the image so that you can import a .png file into draw.io and get the drawing.

replies(2): >>43351034 #>>43351218 #
1. rcarmo ◴[] No.43351218[source]
My big complaint about mermaid is that you cannot easily generate and store the SVGs without a browser engine—-even the CLI goes and runs Chrome, which feels insane.

Regarding graphviz/dot, I have been using it from what feels like the dawn of time and am somewhat sad that we haven’t improved upon it. The syntax, styling imitations, etc. put me off enough that I tend to avoid it.

replies(1): >>43355019 #
2. shagie ◴[] No.43355019[source]
Digging, there's https://github.com/mermaid-js/mermaid-cli

For graphviz, the "problem" with it is that it truly is general purpose and trying to make a general purpose syntax for diagrams is difficult. Mermaid tackles this by not having it be applicable to all possible graphs (flow chart has a different syntax than gitGraph) allowing for a better domain specific language for each subset of functionality.

https://mermaid.js.org/syntax/packet.html is really neat... and it would be a pain to do that in GraphViz ... but I believe that's more of a demonstration that it might be better to do specific syntaxes for specific types of diagrams.

The most general Mermaid form is https://mermaid.js.org/syntax/block.html - and that syntax doesn't really feel like it is an improvement over GraphViz.

replies(1): >>43355540 #
3. rcarmo ◴[] No.43355540[source]
mermaid-cli uses puppeteer to run a browser. The container packs Chromium. It makes no real effort to render anything without all that overhead.