Find Highest z-index

JavaScript performance comparison

Revision 3 of this test case created

Preparation code

<style type="text/css">
  #test1 {z-index: 50; position: aboslute;} #test2 {z-index: 1000; position: absolute;}
</style>
<div id="test1">
  Test 1
</div>
<div id="test1">
  Test 2
</div>
<div style="z-index: 25; position: absolute;">
  Test 3
</div>
<div style="z-index: 5; position: absolute;">
  Test 4
</div>
<div style="z-index: 250; position: absolute;">
  Test 5
</div>
<div style="z-index: 500; position: absolute;">
  Test 6
</div>
<div style="z-index: 525; position: absolute;">
  Test 7
</div>
<div style="z-index: 550; position: absolute;">
  Test 8
</div>
<div style="z-index: 750; position: absolute;">
  Test 9
</div>
<div style="z-index: 999; position: absolute;">
  Test 10
</div>

Preparation code output

Test 1
Test 2
Test 3
Test 4
Test 5
Test 6
Test 7
Test 8
Test 9
Test 10

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
zIndex Only
var zIndex, els, x, xLen, el, val;
zIndex = 0;
els = document.querySelectorAll('*');
for (x = 0, xLen = els.length; x < xLen; x += 1) {
  el = els[x];
  val = window.getComputedStyle(el).getPropertyValue('z-index');
  if (val) {
    val = +val;
    if (val > zIndex) {
      zIndex = val;
    }
  }
}
return zIndex;
pending…
Test Position First
var zIndex, els, x, xLen, el, val;
zIndex = 0;
els = document.querySelectorAll('*');
for (x = 0, xLen = els.length; x < xLen; x += 1) {
  el = els[x];
  if (window.getComputedStyle(el).getPropertyValue('position') !== 'static') {
    val = window.getComputedStyle(el).getPropertyValue('z-index');
    if (val) {
      val = +val;
      if (val > zIndex) {
        zIndex = val;
      }
    }
  }
}
return zIndex;
pending…
t3
return Math.max.apply(null, Array.prototype.map.call(document.getElementsByTagName('*'), function(el) {
  var z_index = 0;
  if (window.getComputedStyle(el).getPropertyValue('position') !== 'static') {
    z_index = parseInt(window.getComputedStyle(el).getPropertyValue('z-index'), 10);
    if (isNaN(z_index)) {
      z_index = 0;
    }
  }
  return z_index;
}));
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