Create diagrams with code using Graphviz
A couple of important tips that the article omits:<p>1. For manual editing, dot -Tx11 foo.dot displays the graph in a window <i>and updates it automatically whenever you save</i>.  So you can have an editor window open and the dot window and see the results of every tweak.  For automatically generated graphs, this provides you with a window that you can update by overwriting a file with a new graph description.<p>2. Although HTML nodes are more versatile, shape=record is much easier, and sufficient for a pretty wide range of diagrams.<p>For doing quick stuff by hand if you don&#x27;t have Graphviz installed, or if you&#x27;re stuck on a Mac without X-Windows, there&#x27;s <a href="https:&#x2F;&#x2F;graphviz.christine.website&#x2F;" rel="nofollow">https:&#x2F;&#x2F;graphviz.christine.website&#x2F;</a>.  I like Graphviz a lot; as other people point out, TikZ is capable of a wider range of graphics, and also you can write programs to generate graphs in TikZ.  But Graphviz is often enough.<p>A really simple graph like <a href="https:&#x2F;&#x2F;graphviz.christine.website&#x2F;#digraph G {a->{b->{c->{d->{e->{f->{g->{h->{i->{j->{k}}}}}}}}}};}" rel="nofollow">https:&#x2F;&#x2F;graphviz.christine.website&#x2F;#digraph G {a->%7...</a> is sometimes good enough without further tweaking, but for, <i>e.g.</i>, the top diagram in <a href="https:&#x2F;&#x2F;github.com&#x2F;kragen&#x2F;dumpulse#dumpulse-an-embeddable-dumb-heartbeat-daemon-in-260-bytes-of-ram-and-350-bytes-of-code" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;kragen&#x2F;dumpulse#dumpulse-an-embeddable-du...</a>, you usually have to tweak stuff a bit.