Sibling Index

JavaScript performance comparison

Revision 9 of this test case created by Jack

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div id="whereami">2</div>
</div>
<script>
Benchmark.prototype.setup = function() {
    function findRow(node){
        var i=1;
        while(node.previousSibling){
            node = node.previousSibling;
            if(node.nodeType === 1){
                i++;
            }
        }
        return i;
    }
   
    function findRow2(node)
    {
        return $(node).index();
    }
   
    function findRow3(node)
    {
        var i = 1;
        while (node = node.previousSibling) {
            if (node.nodeType === 1) { ++i }
        }
        return i;
    }
   
    function findRow4(node)
    {
        return [].indexOf.call(node.parentNode.children, node)
    }
   
    (function() {
        var fn = document.body.previousElementSibling ? 'previousElementSibling' : 'previousSibling'; // ie <=8 skips text nodes
   
            findRow5 = function(node) {
                var i = 1;
                while (node = node[fn]) { ++i }
                return i;
            }
    }());
   
    var node = document.getElementById('whereami'); //div node to find
};
</script>

Preparation code output

1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
2

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
Original
findRow(node);
pending…
jQuery
findRow2(node);
pending…
Jack's one
findRow3(node);
pending…
Using Array.indexOf
findRow4(node);
pending…
using conditional function
findRow5(node);
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