3 ms·

We implemented a library at my company that does not use a virtual DOM, but instead captures reactive "change functions". The framework captures dependencies b

by osrec 7y ago

We implemented a library at my company that does not use a virtual DOM, but instead captures reactive "change functions". The framework captures dependencies between the reactive "change functions" and underlying variables, and executes the functions whenever a variable's value changes. You can also have dependencies between variables (like computed vars in Vue), and the lib works out the correct order for calculation and execution. All the change functions get queued up and applied in order before the next repaint. Everything is component based, and there is even a nice kind of inheritance (with lazy, async component loading). It works rather well. I'd be happy to share it with anyone that's interested! Not open sourcing it yet, as I envisage it would be a full time job to support it! Edit: the upside of the change functions is that YOU decide how the DOM is updated. It's really quite cool to be able to implement a function like the following and have it run to update this.$dateOfBirth whenever this.data.dateOfBirth changes: function() { this.$dateOfBirth.val(this.data.dateOfBirth); } That is of course a simple example, but when you need even more control, reactive change functions have proven to be super useful (for us anyway!).

markharper 7y ago
That sounds similar to the incremental lambda calculus described in this paper: https://arxiv.org/abs/1312.0658 https://arxiv.org/abs/1312.0658 There's an implementation for DOM updates in Purescript (https://blog.functorial.com/posts/2018-04-08-Incrementally-Improving-The-DOM.html https://blog.functorial.com/posts/2018-04-08-Incrementally-I...), but I haven't come across a similar approach in Javascript yet.
- osrec 7y ago
  Yes, it's a similar idea. The only difference I can see is that in our library, the dependencies are automatically tracked, and there is some additional clever scheduling around when a function should be run.

by osrec 7y ago

markharper 7y ago

That sounds similar to the incremental lambda calculus described in this paper: https://arxiv.org/abs/1312.0658 https://arxiv.org/abs/1312.0658 There's an implementation for DOM updates in Purescript (https://blog.functorial.com/posts/2018-04-08-Incrementally-Improving-The-DOM.html https://blog.functorial.com/posts/2018-04-08-Incrementally-I...), but I haven't come across a similar approach in Javascript yet.

osrec 7y ago
Yes, it's a similar idea. The only difference I can see is that in our library, the dependencies are automatically tracked, and there is some additional clever scheduling around when a function should be run.