javascript : blocked scope inside loop , performance difference

Question

I've a following code snippets ,

poupulateData(data) {
    //lets assume variable data is an array of objects with more 400 data
    let arr = [];
    let obj;
    if (data && data.length) {
      for (let i = 0; i < data.length; i++) {
        obj=  data[i];
        arr.push(obj.features);        
      }
    }
  }

I've declared variable obj outside loop , and in the following code snippets i'm going to declare obj inside the loop , like this

poupulateData(data) {
        //lets assume variable data is an array of objects with more 400 data
        let arr = [];       
        if (data && data.length) {
          for (let i = 0; i < data.length; i++) {
            let obj=  data[i];
            arr.push(obj.features);        
          }
        }
      }

the memory allocation for variable obj will be released after the end of the loop , so i want to know which is best in terms of memory allocation and performance if the collection is big

Test it at [jsperf](https://jsperf.com/) and why not simple `let arr = data.map(x => x.features)` — Satpal, Nov 22 '18 at 08:23
The variable should be allocated on the stack (if you don't use closures inside the loop scope) anyway, so it would not make any difference. The performance difference will be absolutely negligible, you should focus on writing clean and correct code. — Bergi, Nov 22 '18 at 10:57

squeekyDave · Answer 1 · 2018-11-22T13:42:44.420

1

If you are after performance, in general when dealing with arrays it is advised to use the array methods provided, because they are optimised to work with arrays.

edited Nov 22 '18 at 13:42

answered Nov 22 '18 at 09:19

squeekyDave

918
2
16
35

The array methods are just as well optimised as explicit looping, there's no difference in performance. (But sure, using `map` here would be cleaner) – Bergi Nov 22 '18 at 10:58

score 1 · Answer 2 · answered Nov 22 '18 at 09:33

Variable declared within a loop will be declared every cycle, thus allocating extra memory. Also the variable is not immediately cleaned after a cycle. You can tell the garbage collector to run after each cycle by setting obj = null which will decrease your memory footprint, but will cost you some CPU time. Also keep in mind that you don't have direct control over the garbage collector. A JavaScript engine optimizes your code before running it and if there is enough free memory on your system it will most likely free memory when the CPU is not busy.

In general declaring variables outside a loop and cleaning them after is better for performance. Here is an example:

poupulateData(data) {
    let arr = new Array(data.length); // set the size to save some memory
    let obj = {}; //set it to object to avoid casting it when the loop starts
    if (data && data.length) {
      for (let i = 0; i < data.length; i++) {
        obj = data[i];
        arr[i] = obj.features;        
      }
    }
    obj = null //clean some memory
    i = null
}

Usually you don't need to care about this stuff in JavaScript. A pretty decent optimization is done before your code is being executed.

"*You can tell the garbage collector to run*" - no, clearing a variable does not automatically run the gargabe collector. Sure, it does mark the value as eligible for collection (assuming it's not referenced from elsewhere), but the GC decides itself when it will actually start collecting. — Bergi, Nov 22 '18 at 10:54
@Bergi probably I did not express myself correctly I tried to point exactly that. I wrote "... tell the GC..." not "will force it to do it". And the JS engine optimization may not respect your request . If you want help me to edit the answer to make it more clear. — Nedko Dimitrov, Nov 22 '18 at 11:02

javascript : blocked scope inside loop , performance difference

2 Answers2