So if you have a page which changes regularly (aka a dynamic web page), then directly manipulating the DOM would be very inefficient.
Sort of. Directly manipulating the DOM is highly efficient - after all, at the end of it all, React still has to do that on top of the VDOM handling. It's that naively manipulating the DOM without checking for optimizations (e.g. reordering elements, moving nodes, ...) is very inefficient.
React does this by effectively determining the minimal operation necessary to transform the prior DOM to the new DOM according to the changes tracked in the VDOM.
(As a result, various VDOM-less frameworks have sprung up recently as well, which still determine minimal operations, but without relying on a VDOM representation)
I'm a full-stack developer who loves to write about software programming and technology in general. Need a freelancer or want to collaborate? Send an email to my address below.
Sort of. Directly manipulating the DOM is highly efficient - after all, at the end of it all, React still has to do that on top of the VDOM handling. It's that naively manipulating the DOM without checking for optimizations (e.g. reordering elements, moving nodes, ...) is very inefficient.
React does this by effectively determining the minimal operation necessary to transform the prior DOM to the new DOM according to the changes tracked in the VDOM.
(As a result, various VDOM-less frameworks have sprung up recently as well, which still determine minimal operations, but without relying on a VDOM representation)
Thanks a lot for pointing that out.