[philsnow]

In emacs, M-x global-auto-revert-mode. in a shell:

    while inotifywait -e modify -r .; do sleep 0.5; make; done

load up the .dot file and the output .png file side by side in an emacs frame. Every time you save the .dot file, the inotifywait loop rebuilds the output .png, writes it to disk, and then emacs notices that the file on disk is newer than its buffer so it "reverts" (reloads) it.

There's even a bit more you can do, with flymake-mode. With flymake-mode, the buffer you're working on gets saved to a separate filename every time you stop editing it for a few ms. If your makefile is set up right, it will build an output file from the temporary flymake file, so you can have that resulting "temporary" artifact open as the other emacs buffer and get automatic refreshing every time you stop typing.

This workflow works for nearly anything you can edit in emacs, as long as you can write a makefile. I wrote everything in grad school this way.

I think VS Code has something even nicer preview (no manual setup or dinking around in a shell) for some plugins, but I don't know if it's general like this setup is.

Edit: Though, this setup has the perennial problem of anything involving emacs: it's completely single-player. I can't easily collaborate with anybody while using this workflow. I also can't really touch any part of it while I'm on my phone. SaaS web/mobile apps can do those things, so they might be more applicable depending on the situation.

[beaconstudios]

I think you underestimate how lazy I am.

If it was something I did often, I would probably make a vscode plugin or shell macro for it though. Or just use mermaid if it turns out to be good.