Which is more performant for/forEach if we are accessing current item in loop?

Question

Every where people are saying for is more performant then forEach e.g.

Javascript efficiency: 'for' vs 'forEach'

But does it holds true when accessing current element in loop.

If not why not if yes what about following code, which gives contradictory results in different cases:

Logic:

//----------------------------------------
var arr = [], len = 1000000, nos = 100;

for(var t = 0; t<len; t++) {
  arr.push({
    a:'a',b:'b',t:Math.random()
  });
}
//----------------------------------------

//===========forEach start====================
var tp1 =  new Date();
arr.forEach( (ik)=>{
  let tmp = [];
  for(let x = 0;x<nos;x++){
    tmp.push(ik.a);
  }
});
var tp2 =  new Date();
//===========forEach end====================


//===========for loop start(let outside loop)====================
var t1 =  new Date();
let i;
for(i = 0; i<arr.length; i++){
  let tmp = [];
  for(let x = 0;x<nos;x++){
    tmp.push(arr[i].a);
  }
}
var t2 =  new Date();
//===========for loop end(let outside loop)====================


//===========for loop start(let inside loop)====================
var ti1 =  new Date();
for(let i = 0; i<arr.length; i++){
  let tmp = [];
  for(let x = 0;x<nos;x++){
    tmp.push(arr[i].a);
  }
}
var ti2 =  new Date();
//===========for loop start(let inside loop)====================


//----------------------------------------

var dff = t2-t1;
var dffi = ti2-ti1;
var dffp = tp2-tp1;

console.log("Execution Time:- (let outside loop): ",dff);
console.log("Execution Time:- (let inside loop): ",dffi);
console.log("Execution Time:- forEach: ",dffp);

console.log("Execution Time:- forEach - for(inside loop): ",dffp-dffi);
console.log("Execution Time:- forEach - for(outside loop): ",dffp-dff);

//----------------------------------------

Which gives output as follows:

case 1: nos = 100

Execution Time:- (let outside loop):  3739
Execution Time:- (let inside loop):  3699
Execution Time:- forEach:  730
Execution Time:- forEach - for(inside loop):  -2969
Execution Time:- forEach - for(outside loop):  -3009

case 2: nos = 10

Execution Time:- (let outside loop):  427
Execution Time:- (let inside loop):  396
Execution Time:- forEach:  98
Execution Time:- forEach - for(inside loop):  -298
Execution Time:- forEach - for(outside loop):  -329

case 3: nos = 2

Execution Time:- (let outside loop):  106
Execution Time:- (let inside loop):  125
Execution Time:- forEach:  90
Execution Time:- forEach - for(inside loop):  -35
Execution Time:- forEach - for(outside loop):  -16

case 4: nos = 1

Execution Time:- (let outside loop):  62
Execution Time:- (let inside loop):  85
Execution Time:- forEach:  72
Execution Time:- forEach - for(inside loop):  -13
Execution Time:- forEach - for(outside loop):  10

case 5: nos = 0

Execution Time:- (let outside loop):  17
Execution Time:- (let inside loop):  23
Execution Time:- forEach:  72
Execution Time:- forEach - for(inside loop):  49
Execution Time:- forEach - for(outside loop):  55

If you replace `new Date()` with the more precise `performance.now()`, the `for`-loop gives better results in all cases on V8 / Chrome. — le_m, Dec 11 '17 at 17:11
If you like, on node.js, you can do `node --print-opt-code script.js` to see the resulting optimized machine code and compare. — le_m, Dec 11 '17 at 18:17
Thanks for new insight sir, but even now it is showing same behaviour. — Akhilesh Kumar, Dec 11 '17 at 18:20

Akhilesh Kumar · Accepted Answer · 2017-12-11T16:46:27.650

1

After some analysis I reduced some facts below:

Basically for loop is more performant then forEach by execution
Both has a native(c/c++) implementation for looping.
forEach has native(at c/c++ layer) implementation for accessing current element which is provided in callback.

Deduction

In case of third point when we are accessing current element while iteration, forEach will give faster result since it will execute at native level but in case of for loop it has to pass to two layers JS then native
There is more efficient variable resolution in case of forEach for current_item, index, array as they are passed through callback from native method but incase of for loop it is not

edited Dec 11 '17 at 16:46

answered Dec 11 '17 at 16:39

Akhilesh Kumar

9,085
13
57
95

I don't know how exactly the `Array.forEach` method is implementd but i think that the function call of the method is kind of expensive in contrast to the for loop which does not call a function. So there should be a significant difference between the two. I'm not sure if the optimizing compiler of the Javascript runtime can inline a function when the function get's called from native code. – Siggy Dec 16 '17 at 00:43

Which is more performant for/forEach if we are accessing current item in loop?

1 Answers1