title: what is the advantage of virtual DOM in Todo like app
body: <p>I think I understand how virtual dom works. It use internal javascript object to represent DOM structure, when something changes, it does the diff and patch the real dom. But in a lot of scenarios, we know what change we make, we can directly patch the DOM. wouldn't this be faster than going through an extra diffing step.</p>
  
  <p>For example, for TODO app, I need to add an item or remove an item, sometimes I need to check an item to mark it as done. In these cases, i know exactly where I should perform the operation in the DOM and directly manipulate the DOM at exact node. If using virtual DOM, it will do the diff, and find what the changes are, at last step, it will apply the change and patch the real DOM. and this is exactly what I do without virtual DOM. If my real DOM operation is expensive, the last step of virtual DOM is expensive too, right?</p>
  
  <p>Since DOM has structure, I think in a lot of cases we know the exact change we are going to make, which I don't see advantage of virtual DOM in these scenarios. Do I miss some important pieces in the picture?</p>
  
  <p>I see some other discussions on the topic of virtual DOM don't feel it answered my question. I hope giving an example will make it more specific.</p>