jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.
jsperf.com URLs are mirrored at the same path, e.g:
https://jsperf.com/negative-modulo/2
Can be accessed at:
https://jsperf.app/negative-modulo/2
checking how best to insert shy of a template
<script src="//code.jquery.com/jquery-git2.min.js"></script>
<div id="test-wrapper"><span id="text">text</span></div>
var one = 'String Item 1';
var two = 'String Item 2';
var three = 'String Item 3';
var four = 'String Item 4';
var five = 'String Item 5';
var string = '<div class="entry" id="' + one + '">' +
'<a class="bookmark" href="' + two + '" title="' + three + '" >' +
'<div class="imgwrapper"><div class="image" style="background-image:url(' + four + ')" /></div>' +
'<table class="details">' +
'<tr>' +
'<td class="edit" title="Edit"><span class="foundicon-edit"></span></td>' +
'<td class="title"><div>' + five + '</div></td>' +
'<td class="remove" title="Remove"><div class="foundicon-remove"></div></td>' +
'</tr>' +
'</table>' +
'</div>' +
'</a>' +
'</div>';
var array = ['<div class="entry" id="' , one , '">' ,
'<a class="bookmark" href="' , two , '" title="' , three , '" >' ,
'<div class="imgwrapper"><div class="image" style="background-image:url(' , four , ')" /></div>' ,
'<table class="details">' ,
'<tr>' ,
'<td class="edit" title="Edit"><span class="foundicon-edit"></span></td>' ,
'<td class="title"><div>' , five , '</div></td>' ,
'<td class="remove" title="Remove"><div class="foundicon-remove"></div></td>' ,
'</tr>' ,
'</table>' ,
'</div>' ,
'</a>' ,
'</div>'].join('');
var parsed_string = $.parseHTML(string);
var parsed_array = $.parseHTML(array);
$('#test-wrapper').empty();
$('#test-wrapper').html("");
Ready to run.
Test | Ops/sec | |
---|---|---|
jQuery append string |
| ready |
jQuery append array |
| ready |
innerHTML string |
| ready |
innerHTML array |
| ready |
insertAdjacentHTML string |
| ready |
insertAdjacentHTML array |
| ready |
jQuery parsed string |
| ready |
jQuery parsed array |
| ready |
Hybrid parsed string |
| ready |
Hybrid parsed array |
| ready |
Hybrid direct parse |
| ready |
jQ + insertAdj |
| ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.