Hacker News Reader

Comment by jamesrom | Hacker News Reader

I've built all kinds of things with d3, I've been using it for over 4 years. It's a seriously great library.

However, there's a cognitive overhead of thinking in selections and update patterns... It's hard to remove state and make composable components that can work well in React, Angular, et al.

While p5 sounds like the answer. We've been stripping away imperative programming on the web for the best part of it's history. Modern web development is more and more declarative every day... I just can't help shake the feeling it's a step backwards.

View on HN

> While p5 sounds like the answer. We've been stripping away imperative programming on the web for the best part of it's history. Modern web development is more and more declarative every day... I just can't help shake the feeling it's a step backwards.

Maybe, but I really like it -- a use case I'm looking at is making interactive versions of the types of figures you'd normally find in textbooks, and there's no one good library for this kind of thing. Each case is unique and has a large illustrative element. p5.js (and, before that, Processing) just allows you to get stuff done. I think that's why Processing took off so much in the artistic community too.

I think you're agreeing with the parent. He's saying the idea that everything's supposed to be declarative is a step backwards, because indeed sometimes you just want to write some imperative code and make something happen.

Excuse my clumsy wording. I mean p5 feels like it's out of step with modern web development.

I just started learning d3 today for a work project, and yeah the selections and `data()`, `enter()`, `exit()` definitely add some cognitive overhead. Now that I've (mostly) wrapped my head around it, I like it a lot (and I'm also happy with d3's documentation!) Have you used react-faux-dom? [0] I've only just started using it, but so far it feels like a good solution for marrying react and d3.

[0] https://github.com/Olical/react-faux-dom

Having gone through the process of marrying react and d3 - IMHO it's far easier to let react do DOM diffing and manipulation, and let d3 worry about data processing. The two work great together, just so long as you don't try to shoehorn one into the other. React more or less mirrors data(), enter(), and exit() with props, componentDid(/Will)Mount, and componentWillUnmount

This may be too late for you, but this is a great library that marries d3 with React. https://github.com/tannerlinsley/react-charts

Yeah, that does exactly the thing I was describing from a quick skim. https://github.com/uber/react-vis does it as well. I've found that attempting to wrangle one of these chart libs takes more time than a quick `myData.map(d => <line path={linefunc(d)}/>)` or similar.

Having officiated the same kind of union between Ember and D3 in a few different ways, I have to agree - let Ember handle rendering, and D3 handles dynamic data binding. I've been working on an open source Ember library based on these concepts: http://locusenergy.github.io/ember-sparkles/#/sine-wave

Can you say what is the problem with D3 and react working together?

you might try d3-component (https://github.com/curran/d3-component)

Reply on news.ycombinator.com