Why custom implementation of Array is more performant than native JavaScript Array?

Question

I was solving a challenge which involves some looping and computation of new array. My solution worked well for fairly small arrays but it failed on big ones with 10k+ items. I was getting a "timeout error"

Then I have implemented my own array like:

  class MyArray {
    constructor(initialArray) {
      this.length = initialArray.length
      this.data = initialArray
    }
    get(index) {
      return this.data[index]
    }
    push(item) {
      this.data[this.length] = item
      this.length++
      return this.data
    }
    pop() {
      const lastItem = this.data[this.length - 1]
      delete this.data[this.length - 1]
      this.length--
      return lastItem
    }
    /// etc
  }

Then I initiated this with given array and used my arrays methods to perform the calculations and it worked even with big arrays given for the assignment.

I still don't really understand why this is more performant and faster? Since I'm using native JavaScript Arrays methods on my new Array class methods...

I would appreciate more clarification on it.

It's probably impossible to say without knowing why exactly the native array didn't perform well. In fact, your custom array is already just a wrapper around an actual array. This leads me to believe that the problem was elsewhere, otherwise you would have probably found the same problem. — VLAZ
– VLAZ, Commented Feb 25, 2019 at 6:17

holydragon · Accepted Answer · 2019-02-25 06:32:37Z

The problem must come from your data and/or its structure. Here is some rough prove that your customized class is not always more performant than the native array.

class MyArray {
  constructor(initialArray) {
    this.length = initialArray.length
    this.data = initialArray
  }
  get(index) {
    return this.data[index]
  }
  push(item) {
    this.data[this.length] = item
    this.length++
      return this.data
  }
  pop() {
    const lastItem = this.data[this.length - 1]
    delete this.data[this.length - 1]
    this.length--
      return lastItem
  }
}
const TESTS = 100000 // 100k
// Custom
let myCustomArray = new MyArray([])
console.time('customClassPush');
for (let i = 0; i < TESTS; i++) {
  myCustomArray.push(i)
}
console.timeEnd('customClassPush');
console.time('customClassGet');
for (let i = 0; i < TESTS; i++) {
  myCustomArray.get(i)
}
console.timeEnd('customClassGet');
console.time('customClassPop');
for (let i = 0; i < TESTS; i++) {
  myCustomArray.pop()
}
console.timeEnd('customClassPop');
// Native
let myNativeArray = []
console.time('nativeArrayPush');
for (let i = 0; i < TESTS; i++) {
  myNativeArray.push(i)
}
console.timeEnd('nativeArrayPush');
console.time('nativeArrayGet');
for (let i = 0; i < TESTS; i++) {
  myNativeArray[i]
}
console.timeEnd('nativeArrayGet');
console.time('nativeArrayPop');
for (let i = 0; i < TESTS; i++) {
  myNativeArray.pop()
}
console.timeEnd('nativeArrayPop');

Run it multiple times to get more possible results so you can do some statistics about it for more precise data.

Collectives™ on Stack Overflow

Why custom implementation of Array is more performant than native JavaScript Array?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related