OOP vs PROCEDURAL (v2)

Revision 2 of this benchmark created on

Setup

function shuffle(array) {
  for (let i = (array.length - 1); i > 0; i -= 1) {
    const randomIndex = Math.floor(Math.random() * (i + 1));
    [array[i], array[randomIndex]] = [array[randomIndex], array[i]];
  }
}

// === OO === //
class Shape2D {
  width
  height

  constructor(w, h) {
    this.width = w
    this.height = h
  }

  calculateArea() {
    throw new Error("calculateArea function is not implemented!")
  }
}

class Triangle extends Shape2D {
  calculateArea() {
    return (this.width * this.height) / 2
  }
}

class Square extends Shape2D {
  calculateArea() {
    return this.width * this.width
  }
}

const triangle = new Triangle(10, 10)
const square = new Square(10)

function sumAllShapes(shapes) {
  let total = 0
  for (const shape of shapes) {
    total += shape.calculateArea()
  }
  return total
}

const shapes = [
  triangle, square, triangle, square, triangle, square, triangle, square, triangle, triangle,
  triangle, square, triangle, square, triangle, square, triangle, square, triangle, triangle,
  triangle, square, triangle, square, triangle, square, triangle, square, triangle, triangle,
  triangle, square, triangle, square, triangle, square, triangle, square, triangle, triangle,
  triangle, square, triangle, square, triangle, square, triangle, square, triangle, triangle,
  triangle, square, triangle, square, triangle, square, triangle, square, triangle, triangle,
  triangle, square, triangle, square, triangle, square, triangle, square, triangle, triangle,
  triangle, square, triangle, square, triangle, square, triangle, square, triangle, triangle,
  triangle, square, triangle, square, triangle, square, triangle, square, triangle, triangle,
  triangle, square, triangle, square, triangle, square, triangle, square, triangle, triangle,
]

// === Procedural === //
const triangleObj = { type: 'triangle',width: 10, height: 10 }
const squareObj = { type: 'square',width: 10, height: 0 }

function calculateAreaTriangle(shape) {
  return (shape.width * shape.height) / 2
}

function calculateAreaSquare(shape) {
  return shape.width * shape.width
}

function sumAllShapesObj(shapes) {
  let total = 0
  for (const shape of shapes) {
    switch(shape.type) {
      case 'triangle':
        total += calculateAreaTriangle(shape)
        break
      case 'square':
        total += calculateAreaSquare(shape)
        break
    }
  }
  return total
}

const shapesObj = [
  triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, triangleObj,
  triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, triangleObj,
  triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, triangleObj,
  triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, triangleObj,
  triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, triangleObj,
  triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, triangleObj,
  triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, triangleObj,
  triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, triangleObj,
  triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, triangleObj,
  triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, squareObj, triangleObj, triangleObj,
]

Test runner

Ready to run.

Testing in
TestOps/sec
OOP
shuffle(shapes)
sumAllShapes(shapes)
ready
PROCEDURAL
shuffle(shapesObj)
sumAllShapesObj(shapesObj)
ready

Revisions

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