Cloning and appending rows

JavaScript performance comparison

Revision 4 of this test case created

Preparation code

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

<table id="sourceT">
    <tr>
        <td>Col 1</td>
        <td>Col 2</td>
        <td>Col 3</td>
    </tr>
    <tr>
        <td>Col 1 - value</td>
        <td>Col 2 - value</td>
        <td>Col 3 - value</td>
    </tr>
</table>
<table id="targetT"></table>

Preparation code output

Col 1 Col 2 Col 3
Col 1 - value Col 2 - value Col 3 - value

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
first
$('#sourceT tr')
        .clone()
        .find('td:gt(1)')
        .remove()
        .end()
        .appendTo('#targetT');
pending…
second
$('#sourceT tr').clone().appendTo('#targetT')
$('#targetT tr').find('td :gt(1)').remove();
pending…
third
var $target = $("#targetT");
$("#sourceT tr").each(function() {
    var $tds = $(this).children(),
        $row = $("<tr></tr>");
    $row.append($tds.eq(0).clone()).append($tds.eq(1).clone()).appendTo($target);
});
pending…
fourth
$("#sourceT tr").each(function(index) {
    var newRow = $("<tr></tr>");
    $(this).find("td:lt(2)").clone().appendTo(newRow);
    $("#targetT").append(newRow);
});
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment