Array map From querySelectorAll

JavaScript performance comparison

Test case created by felipenmoura

Preparation code

<div>A</div>
<div>B</div>
<div>C</div>
<div>D</div>
<div>E</div>
<div>F</div>
<div>G</div>
<div>H</div>
<div>I</div>
<div>J</div>
<div>K</div>
<div>L</div>
<div>M</div>
<div>N</div>
<div>O</div>
<div>P</div>
<div>Q</div>
<div>R</div>
<div>S</div>
<div>T</div>
<div>U</div>
<div>V</div>
<div>X</div>
<div>Y</div>
<div>W</div>
<div>Z</div>
      
<script>
Benchmark.prototype.setup = function() {
  // just a function to be used, logging some data
  function doSomething (el, i) {
    console.log(i, el);
  }
  

};
</script>

Preparation code output

<div>A</div> <div>B</div> <div>C</div> <div>D</div> <div>E</div> <div>F</div> <div>G</div> <div>H</div> <div>I</div> <div>J</div> <div>K</div> <div>L</div> <div>M</div> <div>N</div> <div>O</div> <div>P</div> <div>Q</div> <div>R</div> <div>S</div> <div>T</div> <div>U</div> <div>V</div> <div>X</div> <div>Y</div> <div>W</div> <div>Z</div>

Test runner

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

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec
Array.from
// using array from
Array.from(document.querySelectorAll('div')).map(doSomething);
pending…
map.call
// using call
[].map.call(document.querySelectorAll('div'), doSomething);
pending…
prototype.map
Array.prototype.map.call(document.querySelectorAll('div'), doSomething);
pending…
Spreading
[...document.querySelectorAll('div')].map(doSomething)
pending…

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

Compare results of other browsers

0 Comments

A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
X
Y
W
Z