結合documentfragment和replacechild最大限度地減少迴流

我正在做一個JavaScript遊戲，而不使用畫布，我希望屏幕迴流每個週期只有一次，速度。有沒有辦法讓documentFragment替換已命名的元素？結合documentfragment和replacechild最大限度地減少迴流

編輯： The javascript guide暗示的replaceChild（）可以用DocumentFragment的使用，但例子似乎暗示多個迴流：

function reverse(n) { // Reverses the order of the children of Node n 
    var f = document.createDocumentFragment(); 
    while(n.lastChild)     
      f.appendChild(n.lastChild); 
    n.appendChild(f);     // surely this causes a reflow each time? 
}

來源

2011-12-13 Chris Tolworthy

你可以做的最好的是「雙緩衝」。克隆你關心的整個節點樹，使用它與文檔分離，然後用當前樹代替它，並重復 – Raynos

@Raynos完全在這裏，這是最有效的方法，它只需要一次迴流。除此之外，你可以用文檔中不相交的節點樹來代替你需要的東西，所以優化++ – alessioalex

謝謝。我在IE8中發現內存泄漏，但這可能是一個單獨的問題。 –

如果你把一切都放在一個包裹div它應該工作了罰款。

在function reverse...最後一行只執行一次。但之前的行（在while循環內）將逐個移除元素，並且每次都會引起重排。

來源

2011-12-13 10:19:25 bennedich

結合documentfragment和replacechild最大限度地減少迴流

回答

相關問題