Benchmark: ES6 Class vs Prototype vs Object Literal 2

ES6 Class vs Prototype vs Object Literal 2 (version: 0)

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

Comparing performance of: ES6 Class vs Function Prototype vs Object Literal vs ES6 Class (inheritance) vs Function Prototype (inheritance) vs Object Literal (inheritance) vs Inline Object Literal vs Inline Object Literal (inheritance) vs Spread Object Literal vs Spread Object Literal (inheritance) vs Modified ES6 Class vs Modified ES6 Class (inheritance) vs Modified Properties ES6 Class vs Modified Properties ES6 Class (inheritance)

Created: 2 years ago by: Guest

Jump to the latest result

Script Preparation code:

var Point1 = class Point1 {
	constructor(x, y){
		this.x = x;
		this.y = y;
    }

	add(point){
		return new Point1(this.x + point.x, this.y + point.y);
    }

	sub(point){
		return new Point1(this.x - point.x, this.y - point.y);
    }
}

var Point1b = class Point1b extends Point1 {
	addb(point){
		return new Point1b(this.x + point.x, this.y + point.y);
    }

	subb(point){
		return new Point1b(this.x - point.x, this.y - point.y);
    }
}

function Point2(x, y) {
	this.x = x;
	this.y = y;
}

Point2.prototype.add = function add(point){
    return new Point2(this.x + point.x, this.y + point.y);
}

Point2.prototype.sub = function sub(point){
	return new Point2(this.x - point.x, this.y - point.y);
}

function Point2b(x, y) {
	Point2.call(this, x, y);
}
Point2b.prototype = Object.create(Point2.prototype);
Point2b.prototype.constructor = Point2b;

Point2b.prototype.addb = function addb(point){
    return new Point2b(this.x + point.x, this.y + point.y);
}

Point2b.prototype.subb = function subb(point){
	return new Point2b(this.x - point.x, this.y - point.y);
}

const add = (x,y) => function add(point){
    return Point3(x + point.x, y + point.y);
}

const sub = (x,y) => function sub(point){
	return Point3(x - point.x, y - point.y);
}

function Point3(x, y){
	return {
      	x, 
      	y, 
        add: add(x,y),
        sub: sub(x,y)
    }  
}

const addb = (x,y) => function addb(point){
    return Point3b(x + point.x, y + point.y);
}

const subb = (x,y) => function subb(point){
	return Point3b(x - point.x, y - point.y);
}

function Point3b(x, y){
	return {
      	__proto__: new Point3(x, y),
        addb: addb(x,y),
        subb: subb(x,y)
    }  
}

function Point4(x, y){
	return {
      	x, 
      	y,
      	add: (point)=>Point4(x + point.x, y + point.y),
	 	sub: (point)=>Point4(x - point.x, y - point.y)
    }  
}

function Point4b(x, y){
	return {
      	__proto__: Point4(x, y),
      	addb: (point)=>Point4b(x + point.x, y + point.y),
	 	subb: (point)=>Point4b(x - point.x, y - point.y)
    }  
}

const point5common = (x, y) => ({
  	add(point){
    	return Point5(x + point.x, y + point.y);
	},
  	sub(point){
		return Point5(x - point.x, y - point.y);
	}
});

function Point5(x, y) {
	return {
		x,
    	y,
      	...point5common(x,y)
    }
}

const point5bcommon = (x,y) => ({
  	addb(point){
    	return Point5b(x + point.x, y + point.y);
	},
  	subb(point){
		return Point5b(x - point.x, y - point.y);
	}
});

function Point5b(x, y) {
	return {
		...Point5(x,y),
      	...point5bcommon(x,y)
    }
}

var Point6 = class Point6 {
	constructor(x, y){
		this.x = x;
		this.y = y;
    }
}

Point6.prototype.add = function add(point){
	return new Point6(this.x + point.x, this.y + point.y);
}
Point6.prototype.sub = function sub(point){
	return new Point6(this.x - point.x, this.y - point.y);
}

var Point6b = class Point6b extends Point6 {}

Point6b.prototype.addb = function addb(point){
	return new Point6b(this.x + point.x, this.y + point.y);
}
Point6b.prototype.subb = function subb(point){
	return new Point6b(this.x - point.x, this.y - point.y);
}

const basePropertyDescriptor = {
    configurable: true,
    enumerable: false,
    writable: true,
}

var Point7 = class Point7 {
	constructor(x, y){
		this.x = x;
		this.y = y;
    }
}

Object.defineProperties(Point7.prototype, {
	add: { ...basePropertyDescriptor, value: function add(point){
		return new Point7(this.x + point.x, this.y + point.y);
	}},
	sub: { ...basePropertyDescriptor, value: function sub(point){
		return new Point7(this.x - point.x, this.y - point.y);
	}}
});

var Point7b = class Point7b extends Point7 {}

Object.defineProperties(Point7b.prototype, {
	addb: { ...basePropertyDescriptor, value: function addb(point){
		return new Point7b(this.x + point.x, this.y + point.y);
	}},
	subb: { ...basePropertyDescriptor, value: function subb(point){
		return new Point7b(this.x - point.x, this.y - point.y);
	}}
});

Tests:

ES6 Class
var p1 = new Point1(10, 10); var p2 = new Point1(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Function Prototype
var p1 = new Point2(10, 10); var p2 = new Point2(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Object Literal
var p1 = Point3(10, 10); var p2 = Point3(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
ES6 Class (inheritance)
var p1 = new Point1b(10, 10); var p2 = new Point1b(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Function Prototype (inheritance)
var p1 = new Point2b(10, 10); var p2 = new Point2b(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Object Literal (inheritance)
var p1 = Point3b(10, 10); var p2 = Point3b(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Inline Object Literal
var p1 = Point4(10, 10); var p2 = Point4(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Inline Object Literal (inheritance)
var p1 = Point4b(10, 10); var p2 = Point4b(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Spread Object Literal
var p1 = Point5(10, 10); var p2 = Point5(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Spread Object Literal (inheritance)
var p1 = Point5b(10, 10); var p2 = Point5b(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Modified ES6 Class
var p1 = new Point6(10, 10); var p2 = new Point6(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Modified ES6 Class (inheritance)
var p1 = new Point6b(10, 10); var p2 = new Point6b(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Modified Properties ES6 Class
var p1 = new Point7(10, 10); var p2 = new Point7(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);
Modified Properties ES6 Class (inheritance)
var p1 = new Point7b(10, 10); var p2 = new Point7b(10, -10); var sum = p1.add(p2); var dif = p1.sub(p2);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
ES6 Class
Function Prototype
Object Literal
ES6 Class (inheritance)
Function Prototype (inheritance)
Object Literal (inheritance)
Inline Object Literal
Inline Object Literal (inheritance)
Spread Object Literal
Spread Object Literal (inheritance)
Modified ES6 Class
Modified ES6 Class (inheritance)
Modified Properties ES6 Class
Modified Properties ES6 Class (inheritance)

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

Related benchmarks: