Demystifying React's Virtual DOM

The article suggests that using virtual DOM you can avoid the 6 steps described after<p><pre><code> document.querySelector(&#x27;#elementId&#x27;).innerHTML=&quot;New Value&quot; </code></pre> But this is not the case, the virtual DOM ensures you that if you have a complex component it will only update the nodes that actually needs updating, but the 6 steps still must take place.<p><a href="https:&#x2F;&#x2F;reactjs.org&#x2F;docs&#x2F;rendering-elements.html#react-only-updates-whats-necessary" rel="nofollow">https:&#x2F;&#x2F;reactjs.org&#x2F;docs&#x2F;rendering-elements.html#react-only-...</a>

this article is really misleading.. the authors writes as if direct Dom manipulation is slower than react, then uses a strawman of someone just changing a huge chunk of the Dom tree at once when only a text label needed to be changed. no good developer ever does that. reacts selling point is not blazing speed imo it&#x27;s good performance (not best) with the plus side of being easier to write good code.

*remystifying