jQuery append() Techniques (v3)

Revision 3 of this benchmark created on

Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<select id="container"></select>

Setup

$container = $('#container');
    
    $container.empty();
    
    var els = [];
    var $els = $();
    var string = '';
    
    for (var i = 0; i < 1000; i++) {
      $els.add(new Option(i, i));
      els.push(new Option(i, i));
      string += '<option value="' + i + '">' + i + '</option>';
    }

Test runner

Ready to run.

Testing in
TestOps/sec
string
$container.html(string);
ready
array
$container.append(els);
ready
jQ object
$container.append($els);
ready
control
$.each(els, function(i, el) {
  $container.append(el);
});
ready
control2
$.each($els, function(i, el) {
  $container.append(el);
});
ready

Revisions

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