Massive Node Insert

Benchmark created on

Description

Test the performance claims of this StackOverflow question:

http://stackoverflow.com/questions/6797852/firefox-jquery-appendto-inefficiency

Preparation HTML

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

Test runner

Ready to run.

Testing in
TestOps/sec
Original recipe.
(function generate(q) {
    var min, max, sum, bokeh_count;
    $("#bokeh_container").remove();
    if (q == 0) {
        min = 30, max = 30, bokeh_count = 1;
    } else if (q == 1) {
        min = 7, max = 10, bokeh_count = 300;
    } else if (q == 2) {
        min = 7, max = 15, bokeh_count = 300;
    } else if (q == 3) {
        min = 8, max = 11, bokeh_count = 500;
    }
    sum = min + max;
    window_width = $(document).width();
    window_height = $(window).height();
    colorful = $("#colorful").attr("checked");
    var container = $("<div />", {
        "id": "bokeh_container",
        "style": "width:100%; height:100%; position:absolute; left:50%; margin-left:-600px; top:0px; z-index:1; display:none; "
    });
    for (var i = 0; i < bokeh_count; i++) {
        $("<div />", {
            "class": "bokeh",
            "style": get_bokeh()
        }).appendTo(container);
    }
    container.appendTo("body").show();
})(500);
 
ready
na
var x = 666;
ready

Revisions

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