javascript - documentfragment と replacechild を組み合わせてリフローを最小限に抑える

Question

キャンバスを使用せずに JavaScript ゲームを作成しています。速度を上げるために、画面をサイクルごとに 1 回だけリフローさせたいと考えています。documentFragment が名前付き要素を置き換える方法はありますか?

編集: javascript ガイドは、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?
}

Answer 1

すべてをラップに入れれば、うまくdivいくはずです。

function reverse...最後の行では、一度だけ実行されます。ただし、前の行 (while ループ内) では要素が 1 つずつ削除され、毎回リフローが発生します。