Skip to content

Instantly share code, notes, and snippets.

@Tarabyte
Forked from lukasz-zak/compareTests.js
Last active August 29, 2015 14:02
Show Gist options
  • Save Tarabyte/4242eec2ea07c366de87 to your computer and use it in GitHub Desktop.
Save Tarabyte/4242eec2ea07c366de87 to your computer and use it in GitHub Desktop.
/**
* Code which I test on twitter.com
* Both tests were runing in Chrome 35.x dev tools
*
* This test just gets all a tags from html and read their content
* and then write it on end of document (body element)
*
**/
console.time('testCreateElem');
elemA = document.getElementsByTagName('a');
body = document.getElementsByTagName('body')[0];
for(var i = 0; i < elemA.length; i++){
var span = document.createElement('span');
span.textContent = elemA[i].textContent;
body.appendChild(span);
}
console.timeEnd('testCreateElem');
// Result 36ms
//=======================================
console.time('testDocumentFragment');
elemA = document.getElementsByTagName('a');
body = document.getElementsByTagName('body')[0];
fragment = document.createDocumentFragment();
for(var i = 0; i < elemA.length; i++){
var span = document.createElement('span');
span.textContent = elemA[i].textContent;
fragment.appendChild(span);
}
body.appendChild(fragment);
console.timeEnd('testDocumentFragment');
// Result 7ms
//========================================
console.time('testInsertAdjacentHTML');
elemA = document.getElementsByTagName('a');
body = document.getElementsByTagName('body')[0];
var html = [];
for(var i = 0; i < elemA.length; i++){
html.push('<span>', elemA[i].textContent, '</span>');
}
body.insertAdjacentHTML('beforeend', html.join(''));
console.timeEnd('testInsertAdjacentHTML');
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment