On Wed, 21 Jan 2015 00:45:32 +0100, Glen Huang <curvedm...@gmail.com>
wrote:
Ah, thank you for letting me know.
I vaguely remember document fragment is introduced just to reduce
reflows. Looks like this best practice is obsolete now? (I remember
myself wondering why bowsers couldn’t optimize that back then.) Many
people still suggest it though, including google
(https://developers.google.com/speed/articles/javascript-dom
<https://developers.google.com/speed/articles/javascript-dom> the
"DocumentFragment DOM Generation” section), and you can find more by
googling “why use document fragment".
I think that article is a bit misguided. Changing a class does trigger a
reflow, but it doesn't force a reflow while the script is running (maybe
it does in old browsers). Asking for layout information does force a
reflow.
I think documentfragment has been faster in several browsers and maybe
still is, but in Blink at least it appears that the different methods are
getting about equally fast. It probably depends on how you do it, though.
This jsperf might be interesting:
http://jsperf.com/appendchild-vs-documentfragment-vs-innerhtml/81
So to recap, when you have the need to pass the context node as an
argument along with other nodes, just use before() and after() to insert
these other nodes? And even insert them one by one is fine?
Yeah.
--
Simon Pieters
Opera Software
