title: Moving a DOM node and browser repaint performance
body: <p>Say I have a page with a bunch of divs stack one after another. At one point, I move the 30th one from its position below up to position, say, 5. This causes the old nodes 5 to 29 to move down a slot.</p>
  
  <p>Neglecting what's inside the divs, how much of a <em>relative</em> performance impact does this operation have? If I understood the repaint concept correctly, this would cause a big repaint since lots of visible items' positions are changed. But I thought something as simple would have been optimized by the browser using some tricks.</p>
  
  <p>Disclaimer: I did try to test the repaint on Chrome, but I guess my method wasn't adequate enough, and I couldn't discern much.</p>
  
  <p><em>Here's the follow-up question:</em> say I move a few of these divs around. What would be better in terms of performance: moving each individually, or, say, just simply re-append every node? My thought is that, at a certain point, would it be better to just re-append the whole thing once, rather than moving 6 or 7 divs around and repaint around half the screen each time (if that's indeed the case).</p>
  
  <p>Thanks.</p>