jquery.html vs innerHTML (v12)

Revision 12 of this benchmark created on


Preparation HTML

<script src="//code.jquery.com/jquery-2.0.3.min.js"></script>

<div id="list" style="display:none"></div>

Setup

var html = [];
    for (var i = 0; i < 500; ++i) {
      html.push('<div>Test ' + i + '</div>');
    }
    html = html.join('');
    
    var $el = $('#list');
    var el = $el.get(0);

Teardown


    $('#list').empty();
  

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery.html()
$el.html(html);
ready
innerHTML
el.innerHTML = html;
ready
jQuery.empty().append()
$el.empty().append(html);
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.