The goal is to add N new elements to the DOM as quickly and as painlessly as possible.
I have access to jQuery and found the code below to be faster than the following:
$(parentElement)
.append(Array(1001).join(template))
;| var | |
| fragment = document.createDocumentFragment() | |
| ,div = document.createElement('div') | |
| ,temp = '<div class="foo"><a href=#">bar</a><span class="catpants">baz</span></div>' | |
| ; | |
| div.innerHTML = Array(1001).join(temp); | |
| while (temp = div.firstChild) { | |
| fragment.appendChild(temp); | |
| } | |
| parentElement.appendChild(fragment); |
Here is my jsPerf test: