I am still proud of the D3 gadget I made about 8 years back as a green web dev. Couldn't have made it any other way, not sure if I could with any other library today. Wouldn't want to do it again, though, unless I was a dedicated front-end guy.
[0] At least in the core, I'm not too familiar with the full ecosystem and what is considered official in terms of plugins. Everytime I've tried to use it, I've not found the documentation leading me to using anything more specifically oriented towards charting.
You can simply just use Tableau or Power BI and take screenshots otherwise.
It clearly has some bugs (like the score sometimes being NaN - no idea how I messed that up), but I haven't touched the code in over a decade, so it's a little time capsule.
According to the other comment it seems he meant the |> pipe operator that is under proposal in js
https://blog.frankel.ch/learning-clojure/2/
Something like a(b(c(d(e(7)))))) in Javascript could be written (-> 7 e d c b a) in Clojure?
(Trust me. I don't know jack about JavaScript, I had to get through the MDN docs to understand what they were, and once I did, made a whole lot more sense).
JS does not have a straightforward equivalent. The old and deprecated `with` keyword might seem similar but it's only a surface resemblance as it does not perform the return-value threading that makes the above pattern useful, it was meant for methods that mutate object state. There's a TC39 proposal[2] to add a pipe operator that would accomplish a similar thing to threading macros via an infix operator but it's still a draft.
I'd also argue that D3 is no more verbose than vanilla JS (at least for this example). What's the alternative for creating a line in SVG?
const line = document.createElementNS('http://www.w3.org/2000/svg', 'line')
line.setAttribute('x1', ...)
line.setAttribute('y1', ...)
line.setAttribute('x2', ...)
line.setAttribute('y2', ...)
// etc
document.querySelector('svg').appendChild(line)The `.selectAll().data().join()` data binding method (or `.enter()` on older versions) is very intuitive once you understand it, but for the layman coming in, it's inaccessible AF. I fudged a little in my explanation to make it more accessible. But hey. That's learning.
Right? So why load a bunch of JS to do the same thing? One step further, why load any JS at all since you're just generating an SVG? People have forgotten that HTML and SVG are meant to be DATA containers, you don't have to use JSON + JS.
D3 is cool for the advanced visualizations and the interactivity. If you're sticking to static graphs, for the love of god just have the server serve a static SVG.
Mike Bostock is an interesting person, and a case study in why we don't design languages from a single person's genius.
Semantics matter more than literals sometimes.
*EDIT: Grammar. I was typing on my phone. Soz.
My main takeaway from so much of this is that "just a chart" is one of the biggest sources of hidden complexity in displaying useful information to people. It's right up there with "a simple web form" and "a web page with some simple interactivity."
Everybody has a wildly different idea of what good looks like. Defaults will never be right. Personal and global taste changes annually. We clown react (rightly) for constantly reinventing the same 4 wheels, but customers gleefully use new stuff all the time.
It's kind of amazing that d3 has been so durable in the frontend world. It really is a wrapper over a pretty solid approach. And yeah, that approach is complex, but that's the reality of visualization. It's hard to imagine another one that's that good.
Whereas once th3 D3 training wheels come off, its muscle memory is hard to shed.
Another thing worth mentioning that newcomers seem to take for granted - the margin boilerplate required for correct positioning (see https://observablehq.com/@d3/margin-convention).
esafak•3h ago
I suppose it matters less now in the LLM age.
lionkor•2h ago
Once your LLM gets too expensive, goes out of business, and the competitors just don't quite do it the way your favorite LLM does it, you have a problem.
esafak•2h ago