仮想DOMとは

DOM要素を模したJavaScriptのオブジェクトのことで
仮想ノード（VirtualNode:VNode）の集合体みたいなものと考えるとわかりやすそう

仮想DOMの経緯

document.createElementなどで直接DOM要素にアクセスして編集を行うと、
とてもパフォーマンスが落ちるため開発された。

例えばブラウザ上で一箇所だけ変更された場合はすべてを再描画するのではなく、
変更された一箇所のみ変更したほうが描画コストが抑えられる。

これを実現しようとしたときに一つの方法として変更前のDOMと変更後のDOM
の差分を比較して変更のあった部分のみ更新するというものがあったが、
変更後のDOMを一度生成する必要があったので、この方法はとてもコストが掛かった

これを解消するために作られたのが仮想DOM

documentもオブジェクトだが、このオブジェクト自体はブラウザがもっているので、
アクセスに時間がかかる
javascript側で、同様なオブジェクトを生成し変更前のオブジェクトと変更後の
オブジェクトを比較して上の方法を実現できるようにした。