6 ms·
Two way data bind is fast because a graph of binds and dependency is created. So you can have atomic updates while in virtual dom you must rerun all the tree. S
by saskurambo 10y ago
Two way data bind is fast because a graph of binds and dependency is created. So you can have atomic updates while in virtual dom you must rerun all the tree.
See vue.js and ractive
But is also true that 2way double binding take more memory that virtual dom.
- qwertyuiop924 10y agoTwo-way binding CAN be fast, however, due to various issues, Angular's only option was Dirty Checking, which is sloooow. And no, a depgraph doesn't make it fast. What can make it fast is firing less events, using better triggers, and basically handling it exactly the way that Angular didn't. VDOM can help, but really not much. However you want to put it, two-way binding is costly, and it should be avoided whenever possible, or minimized by catching multiple bind events at a higher up element on the tree (see http://lhorie.github.io/mithril-blog/asymmetrical-data-bindings.html http://lhorie.github.io/mithril-blog/asymmetrical-data-bindi...) Just spraying it everywhere, the way Angular encourages, with no optimization (like the aforementioned asymetrical bindings), should be considered an antipattern.
- saskurambo 10y agoAngular 2way is based on dirty check. Ractive and vue.js are really data binding with atomic changes.
- qwertyuiop924 10y agoI said nothing about Ractive and Vue. Their 2 way binding is better, but with large quantities of bindings, it's still slow.
- saskurambo 10y agoVirtual dom consume more computation processor while data binding consume more memory.
- qwertyuiop924 10y ago...In theory, but IIRC, binding doesn't cover all the types of updates that vdom does, and vdom is better at avoiding thrashing.
- saskurambo 10y agoData binding is also about computates function where you know the dependencies of this and know when recalculate it
- qwertyuiop924 10y agoAre you talking about Computed Values? Because Data Binding has nothing to do with that. Not really. In any case, Computed values make 2 way binding more expensive, because you have to run a depgraph on all the vars that are part of the binding network, every time an event fires. This is O(n). This is only one reason why Computed Values, as implemented in JS, are a Bad Idea. If you have to update a var on event fire, okay, but leaving the things everywhere is slow and ungainly. If you instead change the var to a function call, you can optimize far better, because you only have to update when the value is read. In conclusion, if you want to polymorphism between functions and variables, treat everything as a function, not as a variable. At least, I think that's a response to your question. Your English is pretty broken, so it's hard to tell. Sorry.
- digitalarborist 10y agoNot sure what you mean "rerun all the tree", if you change a a state variable that is added as a prop in another component it has to rerun refresh on those components, but only those components, so not all the tree. Also not sure how this relates to atomic updates, with a flux pattern each state change is associated with ui changes propogating down, the difference to angular is, they aren't supposed to be allowed to propogate up, which you can do in angular since there isn't necessarily a central state store and since there is two way binding children or parent can change the variable. It's easy enough to write two way binding into a react state variable, it's just nice to not have it happen by default since having state able to change anywhere in the app can get confusing.
- saskurambo 10y agoYes but generally speak you must do all this things manually and also optimizatio s and binding you must know what updates. In a real 2way db this is automatic also for performance.
- qwertyuiop924 10y agoNo, the perf's pretty bad if you do a lot of binding, and the manual binding gives you a better sense of what your app is doing, the performance tradeoffs you're making, and more control over an area where you'll probably have to optimize.
- saskurambo 10y agoVue.js 2 is an hibrid between virtual dom and data binding.
- qwertyuiop924 10y agoAll VDOM systems are. The difference is how explicit the data binding is: I maintain implicit 2-way binds, Angluar style, are a Bad Idea.