Pete Hunt was back with his latest version of "Rethinking Best Practices" at JSConf.Asia announcing the React Chrome Developer Tools released today at facebook.github.io/react/blog/2014/01/02/react-chrome-developer-tools.html
23:32 -- on the virtual DOM performance, does React rebuild the whole DOM virtually and diff the whole DOM? Or does it scope to the particular component being rendered?
It's scoped to the component being updated and all its children. You can use the pure render mixin (facebook.github.io/react/docs/pure-render-mixin.html) or manually override shouldComponentUpdate (facebook.github.io/react/docs/component-specs.html#updating-shouldcomponentupdate) to improve performance by making it only call render() when the component has actually changed (in which case it'll only diff the components whose shouldComponentUpdate implementation returns true for that particular change)
@6:25 he states "a lot of times you have to pass along the row color" that is not true of modern templating languages. angular 2+ could use an ngClass to evaluate the index to determine the class or color.
What the heck happened so that rebuilding a complete event system with javascript is magnitudes faster than the native browser event system?!?!? Sounds pretty much like browsers don't care about performance at all. Also, modifying the native DOM is more expensive than computing the difference between two virtual DOM trees and also modifying the native DOM a little? Sounds pretty much like browsers don't care about performance at all. Don't browsers compute a difference first? Don't browsers batch-update? Don't browsers already have an event bubbling system? I'd really like to know how exactly React has achieved better performance. Does it use simpler computations? Nice video though.
Pete Hunt was back with his latest version of "Rethinking Best Practices" at JSConf.Asia announcing the React Chrome Developer Tools released today at facebook.github.io/react/blog/2014/01/02/react-chrome-developer-tools.html
I couldn't agree more.
Nice talk, benefit a lot
This is super!
23:32 -- on the virtual DOM performance, does React rebuild the whole DOM virtually and diff the whole DOM? Or does it scope to the particular component being rendered?
It's scoped to the component being updated and all its children. You can use the pure render mixin (facebook.github.io/react/docs/pure-render-mixin.html) or manually override shouldComponentUpdate (facebook.github.io/react/docs/component-specs.html#updating-shouldcomponentupdate) to improve performance by making it only call render() when the component has actually changed (in which case it'll only diff the components whose shouldComponentUpdate implementation returns true for that particular change)
Can i put this video on my channel and add some subtitles?
Sure, just send us the sub titles.
@6:25 he states "a lot of times you have to pass along the row color" that is not true of modern templating languages. angular 2+ could use an ngClass to evaluate the index to determine the class or color.
Whats up with the tank and the divers inside :o kinda weird. but thats Asia.
I'm curious, are those divers there to perform or actually maintain the tank and feed the fish?
Facebooks' React.js is intriguing contrast to Angular. Good viewing for javascript hackers and DOM manipulators.
What the heck happened so that rebuilding a complete event system with javascript is magnitudes faster than the native browser event system?!?!? Sounds pretty much like browsers don't care about performance at all.
Also, modifying the native DOM is more expensive than computing the difference between two virtual DOM trees and also modifying the native DOM a little? Sounds pretty much like browsers don't care about performance at all.
Don't browsers compute a difference first? Don't browsers batch-update? Don't browsers already have an event bubbling system? I'd really like to know how exactly React has achieved better performance. Does it use simpler computations?
Nice video though.
browsers render.