CODEWITHSUNDEEP
javascript
nonamorando
nonamorando

Reputation: 1605

Why is a custom function slower than a builtin?

I'm messing around with the performances of JavaScript's push and pop functions. I have an array called arr. When I run this:

for (var i = 0; i < 100; i++) {
  for (var k = 0; k < 100000; k++) {
    arr.push(Math.ceil(Math.random() * 100));
    arr.pop();
  }
}

I get a time of 251.38515999977244 Milliseconds (I'm using performance.now() function).

But when I run a custom push and pop:

Array.prototype.pushy = function(value) {
  this[this.length] = value;
}
Array.prototype.poppy = function() {
  this.splice(-1, 1);
}

for (var i = 0; i < 100; i++) {
   for (var k = 0; k < 100000; k++) {
      arr.pushy(Math.ceil(Math.random() * 100));
      arr.poppy();
    }
 }

The time is 1896.055750000014 Milliseconds.

Can anyone explain why there's such a huge difference between these?

To those who worry about time difference. I ran this test 100 times and computed an average time. I did that 5 times to ensure there weren't any outlying times.

Upvotes: 0

Views: 133

Answers (2)

Anonymous
Anonymous

Reputation: 12017

The reason is that the built-in function was specifically designed and optimized to perform a specific function. The browser takes whatever shortcuts possible when using the built-in function that it may not be as quick to recognize in the custom function. For example, with your implementation, the function needs to get the array length every single time the function is called.

Array.prototype.pushy = function(value) {
  this[this.length] = value;
}

However, by simply using Array.prototype.push, the browser knows that the purpose is to append a value on to the array. While browsers may implement the function differently, I highly doubt any needs to compute the length of the array for every single iteration.

Upvotes: 2

James Curran
James Curran

Reputation: 103495

Because the built-in function is written is whatever language the browser was written in (probably C++) and is compiled. The custom function is written in Javascript and is interpreted.

Generally interpreted languages are much slower than compiled ones. One usually doesn't notice this with Javascript because for the most part, you only execute a couple lines of JS between human interactions (which is always the slowest part).

Running JS in a tight loop as your done here, highlights the difference.

Upvotes: 4

Related Questions