DOM操作重建整個DOM結構

Question

從第2節以下鏈接我看到了聲明：「作爲一個例子，假設你有一個包含10個項目的清單你檢查過的第一個項目大部分的JavaScript框架將重建。整個列表，這是十倍超過必要的工作！只有一項改變，但其餘九他們如何纔得到重建準確。重建名單也沒什麼大不了的web瀏覽器，但現代的網站可以使用DOM的鉅額操縱，無效更新已經成爲一個嚴重的問題。「請詳細解釋這一點。如何操縱一個DOM元素重建整個父項？

https://www.codecademy.com/articles/react-virtual-dom

Answer 1

想象一下，你有一定的順序元素的列表，並將該列表每秒更新一次（在商店出售的最後項目，依熱門程度排序的，例如列表）。每次更新中的任何物品都可能不在列表中，新物品可以隨機輸入。這使得很難以更新移動，替換或插入的元件列表中，所以最簡單的方法是重新生成的任何更新列表。

這種情況是最糟糕的情況之一，但一般這種方法是最常見的，因爲是最簡單的一個：忘記舊列表並將一個新的，甚至有以不變應萬變。

反應，其「虛擬DOM」，能夠採取新的列表，它與舊的相比並檢測在「真實DOM」所需的更改，並應用它們。這是基於這樣的事實，它的虛擬DOM的速度遠遠超過了真正的操控。