Out of interest, put the above methods into jsperf. Plus a 'createTextNode' method clone without caching the $$ function, always going to be slower, little surprised by how much though. Apparently IE6 (under a virtual machine) performs better than Opera 11.10 apart from the Inject-Destroy method where it failed with the ol 'Object does not support this prop or method'. Didn't include the fiddle I put up previously, compared to the documentFragment and createTextNodemethods, it was sluggish (and very 2am not awsome...), always a little slower than 'Inject-Destroy'.
http://jsperf.com/docfrag-textnode-insertion On May 25, 6:37 pm, Rolf -nl <[email protected]> wrote: > of course, you're right > > On May 24, 10:51 pm, Michael Russell <[email protected]> wrote: > > > > > > > > > you really don't need a fragment for that. > > > this: > > > var elements = $$('span'); > > elements.each(function(elm){ > > var fragment = document.createDocumentFragment(); > > fragment.appendChild(document.createTextNode('X')); > > elm.parentNode.insertBefore(fragment, elm.nextSibling); > > > }); > > > could just be: > > > var elements = $$('span'); > > elements.each(function(elm){ > > var txtNode = document.createTextNode('X') > > elm.parentNode.insertBefore(txtNode, elm.nextSibling); > > > }); > > > Fragments are really nice when you don't want to inject a wrapper element > > but want to insert n+1 nodes into the DOM. Using it will cause the browser > > to only re[paint/structure] the DOM once when injecting them instead of on > > each iteration of your elements array
