DomNodeInserted (v2)

Revision 2 of this benchmark created on

Description

Testing out DOMNodeInserted

Preparation HTML

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

<div id="container" style="background-color:#e0d0a0; width:300px; height:100px;overflow:auto;"></div>

Setup

var iCount = 0;
    var ITERATIONS = 50;
    
    var htmlSnippet = "<div>Adding Simple Div tag</div>";
    
    function OnNodeInserted(event) {
      iCount++;
    }

Test runner

Ready to run.

Testing in
TestOps/sec
append
document.addEventListener( 'DOMNodeInserted', OnNodeInserted, true );

var c = $('#container');
for( var i = 0; i < ITERATIONS; i++ ) {
  c.append(  htmlSnippet );
}

document.removeEventListener( 'DOMNodeInserted', OnNodeInserted, true );
 
ready
html
document.addEventListener( 'DOMNodeInserted', OnNodeInserted, true );

var str = "";
for( var i = 0; i < ITERATIONS; i++ ) {
  str += htmlSnippet;
}

$('#container').html( str );

document.removeEventListener( 'DOMNodeInserted', OnNodeInserted, true );
 
ready
append w/o
var c = $('#container');
for( var i = 0; i < ITERATIONS; i++ ) {
  c.append( htmlSnippet );
}

 
ready
html w/o
var str = "";
for( var i = 0; i < ITERATIONS; i++ ) {
  str += htmlSnippet;
}

$('#container').html( str );

 
ready
append jquery event
$(document).bind( 'DOMNodeInserted', OnNodeInserted );

var c = $('#container');
for( var i = 0; i < ITERATIONS; i++ ) {
  c.append(htmlSnippet );
}

$(document).unbind( 'DOMNodeInserted', OnNodeInserted );
ready
html jquery event
$(document).bind( 'DOMNodeInserted', OnNodeInserted );

var str = "";
for( var i = 0; i < ITERATIONS; i++ ) {
  str += htmlSnippet;
}

$('#container').html( str );

$(document).unbind( 'DOMNodeInserted', OnNodeInserted );
ready
append no capture
document.addEventListener( 'DOMNodeInserted', OnNodeInserted, false );

var c = $('#container');
for( var i = 0; i < ITERATIONS; i++ ) {
  c.append(  htmlSnippet );
}

document.removeEventListener( 'DOMNodeInserted', OnNodeInserted, false );
 
ready
html no capture
document.addEventListener( 'DOMNodeInserted', OnNodeInserted, false );

var str = "";
for( var i = 0; i < ITERATIONS; i++ ) {
  str += htmlSnippet;
}

$('#container').html( str );

document.removeEventListener( 'DOMNodeInserted', OnNodeInserted, false );
 
ready

Revisions

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