MeasureThat.net

Run results for: ES6 Class vs Prototype vs Object Literal access 2

Test the speed and memory usage using 3 different techniques for accessing class objects.

Go to the benchmark
Run details:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.0 Safari/605.1.15
Safari 15
Mac OS X 10.15.7
Desktop
2 years ago
Test name Executions per second
ES6 Class 9497850.0 Ops/sec
Function Prototype 9330962.0 Ops/sec
Object Literal 7778546.0 Ops/sec
Object 2 5129016.5 Ops/sec
Script Preparation code:
​x
 
class PointC {
    constructor(x, y){
        this.x = x;
        this.y = y;
    }
​
    add(value){
        return this.x + this.y + value;
    }
}
​
//---------------------------------------
​
​
function PointP(x, y){
    this.x = x;
    this.y = y;
}
​
PointP.prototype.add = function(value){
    return this.x + this.y + value;
}
​
//---------------------------------------
​
function PointO(x, y){
    return {
        x, 
        y, 
        add:  value => this.x + this.y + value
    }  
}
​
//---------------------------------------
​
var PointS = {
    x:  10,
    y:  10
}
​
var Add = (point, value) => point.x + point.y + value;
​
var p1C = new PointC(10, 10);
var p1P = new PointP(10, 10);
var p1O = new PointO(10, 10);
​
​
​
​
​
Tests:

  • ES6 Class

     
    var sum = p1C.add(10000);

  • Function Prototype

     
    var sum = p1P.add(10000);

  • Object Literal

     
    var sum = p1O.add(10000);
    ​

  • Object 2

     
    var sum = Add(PointS, 10000);