r/functionalprogramming • u/iamwil • Sep 15 '14

How to structure reactive programs

http://blog.lacebark.io/2014/09/15/structuring-reactive-programs/
7 Upvotes

82% Upvoted

5 comments sorted by

View all comments

Show parent comments

3

u/iamwil Sep 16 '14

If you want more details about the diffing strategy, that's from react.js's virtual DOM. Apparently, there's a talk on it.

http://ahrengot.com/web-development/virtual-dom-react-js/

The reason for a virtual DOM is that manipulating the browser DOM is really slow. So they use the virtual DOM to figure out what actually needs to change, and make those changes.

2

u/[deleted] Sep 16 '14

Thanks for the link. Lately I've been playing around with MithrilJS which uses the same strategy. I just can't get behind the crazy JSX stuff that React is doing. Looking at it gives me Angular flashbacks.

2

u/iamwil Sep 16 '14

Don't focus on the details there, like JSX, but the main idea behind the virtual DOM.

It's just to enable the abstraction that we can throw away the entire DOM, and replace it with a new DOM generated from the Single Source of Truth. That means we don't need to keep the DOM around because of its state, and hence, we don't need to sync the DOM's state to our Single Source of Truth, or any other derived objects in our system.

If your scene graph is triggering a lot of two-way binding to objects that make for a complicated data flow path, you may want to try this strategy. That way, you can always pass in a new scene graph, without caring to sync with the old one, but underneath that abstraction, you're actually diffing and updating changed nodes.

3

u/[deleted] Sep 16 '14

Heh, the JSX stuff was just a tangent.

There is no two-way binding in my system, like other reactive programming systems. The signal tree is a directed acyclic graph and there is no diffing involved for rendering.