alixanderwang

You get this when transitioning boards in our hosted platform (try clicking): https://d2studio.ai/diagrams/664641071

I don't add this for D2 CLI because the outputs there are SVG, and this feature requires Javascript.

I love this hahah. Diagrams as a comic book.

The urge to add silly stuff like this vs working on v2 of sequence diagram that has much more demand is often tempting.

The purpose is to make use of a dimension of the visual space previously unused to make diagrams more expressive.

Even if it's something simple like a node turning from green to red to convey it's shutting down. Maybe something like that before animations would be a text saying, "this node will shut down now", which takes reading/zooming into text.

I also think it can, if used well, result in diagrams that ⋆⋆spark joy⋆⋆. People like to see diagrams like that, even if it's not more utilitarian. I think sketch mode is an example of this. It changes the font to an objectively less readable one, yet I often hear people make all their D2 diagrams in sketch mode.

We have examples here, though I need to add more.

https://d2lang.com/examples/elk/

I like ELK's output better sometimes too, e.g. the Golang Queue example. Choice is good

What if that style is already used though? (e.g. other connections are red)

Coauthor of D2 here. Lately I've been noodling on the idea of expanding the animation capabilities. I think out loud a bit here, and if you have thoughts, would love to hear them:

https://github.com/terrastruct/d2/discussions/2677

D2 does allow custom layout tweaking in the proprietary layout engine. Sadly it's not possible in the open-source ones.

https://docs.d2studio.ai/tour/freehand

At the very least, assuming you're correct the current slow infrastructure is by design, it seems good there are options.

A business can choose if they want

1. slow, pay for customer support and fraud protection

2. instant, lower cost, mistakes are irreversible

Thank you, made an issue: https://github.com/terrastruct/text-to-diagram-site/issues/6...

Yeah that one's a community plugin vs an officially maintained one, which can have a range of activity from graveyard to some being maintained better than many of our official ones. That maintainer seems active on GitHub though and the d2-emacs plugin is his top pinned repo (https://github.com/andorsk), I think he'd be receptive if you let him know your interest!

<3

The linking you can do already if I understand the request correctly: https://play.d2lang.com/?script=Ks5ILEi1UihOLSxNzUtOjU_JTEwv...

Okay, we'll put those sequence diagram improvements in our sprint for next release.

Can definitely concur about the Reddit part. Feels like commenters there are always looking for a gotcha

1. It depends on what you value =). For some, those 2 you mentioned are enough. For others, it can be something like the our CLI doesn't require a chromium browser to render SVGs (https://news.ycombinator.com/item?id=31275754). It doesn't cover every difference, but we made a little comparison site if it helps: https://text-to-diagram.com

2. I'm not trying to advertise our paid product in this post about the open source product, but since you mentioned it, we make an IDE that adds the ability to lock in positions and dimensions: https://docs.terrastruct.com/tour/freehand

Yeah I think what you're looking for is the note at the end of this section: https://d2lang.com/tour/exports/#svg

Feel free to make a PR to d2/d2-docs to include it in our list of community tools/plugins if you do!

Unfortunately not, I've tried reaching out to GH folks but no dice. However it should be noted that d2.js, which enables client-side renders, didn't really become usable until this month and still isn't really officially released (kind of hidden). So, we'll see if the official release (soon™) changes things. If any D2-enjoyers reading this knows anyone on the GH frontend team, plz bend their ear =)

Thanks! Good to know, we'll slot this for 0.7.2 (next release)

It switches to ELK: https://github.com/terrastruct/d2/blob/master/d2cli/main.go#...

It does now! (As of a week ago)

Check out the network tab in the d2 playground. It's powered by d2.js, a wrapper around a wasm port of d2, which we've recently been working on. Not super officially ready yet but soon to be, and will be a separate announcement.

Ah right, forgot to test the update with dark mode. Thanks for letting me know!

edit: fixed

Hello fellow devs. Just wanted to share a new feature we added this morning, though it's very alpha stage (already someone's filed a github issue for it hah)

If you want to skip the blog post and poke around directly: https://play.d2lang.com/?script=qlDQtVOotFLIyFTwSEzOTi1S8Est...

For a bigger example: https://play.d2lang.com/?script=rJJBjtswDEX3OgWBrm2kzU4Feoru...

I’m often alone on this. Engineers look at complex systems with many interesting parts and think “wow, a lot of system design is happening here!” In fact, a complex system usually reflects an absence of good design.

For any job-hunters, it's important you forget this during interviews.

In the past I've made the mistake of trying to convey this in system design interviews.

Some hypothetical startup app

Interviewer: "Well what about backpressure?"

"That's not really worth considering for this amount of QPS"

Interviewer: "Why wouldn't you use a queue here instead of a cron job?"

"I don't think it's necessary for what this app is, but here's the tradeoffs."

Interviewer: "How would you choose between sql and nosql db?"

"Doesn't matter much. Whatever the team has most expertise in"

These are not the answers they're looking for. You want to fill the whiteboard with boxes and arrows until it looks like you've got Kubernetes managing your Kubernetes.

Played around with it for a serious task for 15 mins. Compared to Claude Code:

Pros:

- Beautiful UI

- Useful sidebar, keep track of changed files, cost

- Better UX for accepting changes (has hotkeys, shows nicer diff)

Cons:

- Can't combine models. Claude Code using a combination of Haiku for menial search stuff and Sonnet for thinking is nice.

- Adds a lot of unexplained junk binary files in your directory. It's probably in the docs somewhere I guess.

- The initial init makes some CHARM.md that tries to be helpful, but everything it had did not seem like helpful things I want the model to know. Simple stuff, like, my Go tests use PascalCasing, e.g. TestCompile.

- Ctrl+C to exit crashed my terminal.

Yeah we do this with globs.

  a.class: backend
  b.class: frontend

  # hide everything
  **: suspend

  layers: {
     backend: {
       # show backend stuff
       **: unsuspend {
         &class: backend
       }
     }
  }

At least for the layering + using text aspect, D2 support this:

defining diagrams as multiple layers like so

  x -> y

  layers: {
    inside_x: {
      a -> b
    }
  }

This is the first time I've wanted more AI video content. Thanks for sharing.

I work on the D2 project ([0]) and we switched from other Javascript runners (v8go) to Goja. Using a JS runtime with a dependency on cgo means your Go program loses the (huge) benefit of cross-compiling to different architectures, since at build time it gets linked to the current system's libc.

If you're interested in some production code with Goja, this is our code for calling RoughJS ([1]) from Go in order to produce the hand-drawn diagram look: [2]

[0] https://github.com/terrastruct/d2

[1] https://roughjs.com/

[2] https://github.com/terrastruct/d2/blob/master/d2renderers/d2...

No worries at all, the API is definitely a bit hidden. Anyway, best of luck and feel free to reach out if you want to chat diagrams!

Congrats on the launch! I'm the author of D2 (Terrastruct). I won't comment on comparisons you want to make as it's your launch, but just to clarify, we do have a programmatic API:

- https://terrastruct.com/blog/post/generate-diagrams-programm...

- https://d2lang.com/tour/api/

Would open-sourcing CodeViz change your willingness to give it a try?

Yup. Or a web app that I can point to an open-source repo.

Regarding C4, I'm no expert. I know the guys at IcePanel, an earlier YC-cohort company (https://news.ycombinator.com/item?id=34338995) that specializes in C4 diagrams, and they're very friendly, so if you haven't yet, they'll be much more equipped to chime in on C4 stuff.

If you'd like to try it out on a specific repo, you can always use our extension for further analysis.

VSCode extension marketplace doesn't have the best security rails or reputation for security, and with this being closed source, just personally, installing and running it on my machine isn't something I'm comfortable doing.

The idea is that CodeViz can replace or augment search and directory tree by providing a more intuitive interface for navigation!

That to me is a different goal than the one in your post (maybe it's just phrasing or I didn't understand the OP correctly), and is something I'd be excited to have!

ideally the definition of an architecture diagram would be rigorous enough that there is no ambiguity

Rigor is a big "if" in software ;). See: UML's attempt. C4 is some very loose guidelines. IIRC, a big part of its attraction is the lack of rigor/formal standards.

Anyway, best of luck! Feel free to reach out if you'd like to chat diagrams