search

cujojs / most

Ultra-high performance reactive programming
MIT License
3.49k stars 231 forks source link

Speed when using DOM compared to virtual DOM #528

Closed frankymacster closed 5 years ago

frankymacster commented 5 years ago

Hi,

How does the speed compare with React virtual DOM when using Most.js with DOM elements?

davidchase commented 5 years ago

Hi @frankymacster can you help me understand what exactly you are asking ? Are you trying to compare the performance of most dom events to react dom events ? Or something else ?

frankymacster commented 5 years ago

@davidchase Sorry for not having been so clear. I meant in terms of performance in the rendering of the DOM.

How does using most.js with HTML elements compare with using a virtual DOM to diff between changes that need to be applied to the actual DOM in terms of rendering?

In the examples (https://github.com/mostjs/examples) pointers to DOM elements are used and modified after the state changes. Will the DOM only be rerendered at that element?

I am trying to compare most.js and cycle.js and saw that cycle.js uses a virtual dom for rendering while most.js doesn't. I was wondering if this can make most.js less performant in terms of rendering.

Thanks

davidchase commented 5 years ago

No worries @frankymacster 😄 So Most.js is an events based library without an specific tie to any DOM virtual or not, so you can choose any. While cycle.js is closer to a framework which provides a vDOM which is based on snabbdom. If im not mistaken you can actually use Most.js with cycle.js.

Hope my answer helps. let me know if i can help some more.

frankymacster commented 5 years ago

Oh I wasn't aware of '@cycle/most-run'. I think this is what I was looking for. I want to stay as close as possible to using monads for streams (which I'm not completely sure cycle.js does) but still being able to work with a virtual DOM.

Thanks a lot! :)

briancavalier commented 5 years ago

Hey @frankymacster, in addition to @davidchase's excellent answer, you may also want to check out @most/core. It's the next version of most, and we recommend it for new projects. Updated docs are here, and there are some simple examples in the GitHub repo. As already mentioned, it can be used with whatever DOM library you prefer, and along those lines, there is a todomvc example using @most/core and react.

Cheers!

UPDATE: Fixed the todomvc link.