Benchmark: class with/without declared fields vs function constructor vs object literal vs Object.create vs Object.setPrototypeOf

class with/without declared fields vs function constructor vs object literal vs Object.create vs Object.setPrototypeOf (version: 0)

Comparing performance of: class without declared fields vs class with declared fields vs function constructor vs object literal vs object literal & sum.call vs object literal & sum.bind vs Object.create vs Object.setPrototypeOf

Created: 3 years ago by: Guest

Jump to the latest result

Script Preparation code:

// classes declared here can't be accessed in test cases for some reason...

AخA
 
// classes declared here can't be accessed in test cases for some reason...

Tests:

class without declared fields

class X {
  constructor(foo, bar, baz) {
    this.foo = foo;
    this.bar = bar;
    this.baz = baz;
  }
  sum() {
    return this.foo + this.bar + this.baz;
  }
}

let i = 1000;
let y = 0;
while (i--) {
  let x = new X(1, 2, 3);
  y += x.foo + x.bar + x.baz;
  y += x.sum();
}
return y;

​x
 
class X {  constructor(foo, bar, baz) {    this.foo = foo;    this.bar = bar;    this.baz = baz;  }  sum() {    return this.foo + this.bar + this.baz;  }}​let i = 1000;let y = 0;while (i--) {  let x = new X(1, 2, 3);  y += x.foo + x.bar + x.baz;  y += x.sum();}return y;

class with declared fields

class X {
  foo;
  bar;
  baz;
  constructor(foo, bar, baz) {
    this.foo = foo;
    this.bar = bar;
    this.baz = baz;
  }
  sum() {
    return this.foo + this.bar + this.baz;
  }
}

let i = 1000;
let y = 0;
while (i--) {
  let x = new X(1, 2, 3);
  y += x.foo + x.bar + x.baz;
  y += x.sum();
}
return y;

 
class X {  foo;  bar;  baz;  constructor(foo, bar, baz) {    this.foo = foo;    this.bar = bar;    this.baz = baz;  }  sum() {    return this.foo + this.bar + this.baz;  }}​let i = 1000;let y = 0;while (i--) {  let x = new X(1, 2, 3);  y += x.foo + x.bar + x.baz;  y += x.sum();}return y;

function constructor

function X(foo, bar, baz) {
  this.foo = foo;
  this.bar = bar;
  this.baz = baz;
}
X.prototype.sum = function() {
  return this.foo + this.bar + this.baz;
}

let i = 1000;
let y = 0;
while (i--) {
  let x = new X(1, 2, 3);
  y += x.foo + x.bar + x.baz;
  y += x.sum();
}
return y;

 
function X(foo, bar, baz) {  this.foo = foo;  this.bar = bar;  this.baz = baz;}X.prototype.sum = function() {  return this.foo + this.bar + this.baz;}​let i = 1000;let y = 0;while (i--) {  let x = new X(1, 2, 3);  y += x.foo + x.bar + x.baz;  y += x.sum();}return y;

object literal

function X(foo, bar, baz) {
  return {foo, bar, baz};
}
function sum(x) {
  return x.foo + x.bar + x.baz;
}

let i = 1000;
let y = 0;
while (i--) {
  let x = {foo: 1, bar: 2, baz: 3};
  y += x.foo + x.bar + x.baz;
  y += sum(x);
}
return y;

 
function X(foo, bar, baz) {  return {foo, bar, baz};}function sum(x) {  return x.foo + x.bar + x.baz;}​let i = 1000;let y = 0;while (i--) {  let x = {foo: 1, bar: 2, baz: 3};  y += x.foo + x.bar + x.baz;  y += sum(x);}return y;

object literal & sum.call

function X(foo, bar, baz) {
  return {foo, bar, baz};
}
function sum() {
  return this.foo + this.bar + this.baz;
}

let i = 1000;
let y = 0;
while (i--) {
  let x = X(1, 2, 3);
  y += x.foo + x.bar + x.baz;
  y += sum.call(x);
}
return y;

 
function X(foo, bar, baz) {  return {foo, bar, baz};}function sum() {  return this.foo + this.bar + this.baz;}​let i = 1000;let y = 0;while (i--) {  let x = X(1, 2, 3);  y += x.foo + x.bar + x.baz;  y += sum.call(x);}return y;

object literal & sum.bind

function X(foo, bar, baz) {
  let x = {foo, bar, baz};
  x.sum = sum.bind(x);
  return x;
}
function sum() {
  return this.foo + this.bar + this.baz;
}

let i = 1000;
let y = 0;
while (i--) {
  let x = X(1, 2, 3);
  y += x.foo + x.bar + x.baz;
  y += x.sum();
}
return y;

 
function X(foo, bar, baz) {  let x = {foo, bar, baz};  x.sum = sum.bind(x);  return x;}function sum() {  return this.foo + this.bar + this.baz;}​let i = 1000;let y = 0;while (i--) {  let x = X(1, 2, 3);  y += x.foo + x.bar + x.baz;  y += x.sum();}return y;

Object.create

function X(foo, bar, baz) {
  let x = Object.create(proto);
  x.foo = foo;
  x.bar = bar;
  x.baz = baz;
  return x;
}
const proto = {
  sum() {
    return this.foo + this.bar + this.baz;
  }
}

let i = 1000;
let y = 0;
while (i--) {
  let x = X(1, 2, 3);
  y += x.foo + x.bar + x.baz;
  y += x.sum();
}
return y;

 
function X(foo, bar, baz) {  let x = Object.create(proto);  x.foo = foo;  x.bar = bar;  x.baz = baz;  return x;}const proto = {  sum() {    return this.foo + this.bar + this.baz;  }}​let i = 1000;let y = 0;while (i--) {  let x = X(1, 2, 3);  y += x.foo + x.bar + x.baz;  y += x.sum();}return y;

Object.setPrototypeOf

function X(foo, bar, baz) {
  let x = {foo, bar, baz};
  Object.setPrototypeOf(x, proto);
  return x;
}
const proto = {
  sum() {
    return this.foo + this.bar + this.baz;
  }
}

let i = 1000;
let y = 0;
while (i--) {
  let x = X(1, 2, 3);
  y += x.foo + x.bar + x.baz;
  y += x.sum();
}
return y;

 
function X(foo, bar, baz) {  let x = {foo, bar, baz};  Object.setPrototypeOf(x, proto);  return x;}const proto = {  sum() {    return this.foo + this.bar + this.baz;  }}​let i = 1000;let y = 0;while (i--) {  let x = X(1, 2, 3);  y += x.foo + x.bar + x.baz;  y += x.sum();}return y;

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
class without declared fields
class with declared fields
function constructor
object literal
object literal & sum.call
object literal & sum.bind
Object.create
Object.setPrototypeOf

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one month ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.3.1 Safari/605.1.15

Browser/OS: Safari 18 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
class without declared fields	63465.6 Ops/sec
class with declared fields	81251.4 Ops/sec
function constructor	67440.1 Ops/sec
object literal	1583286.2 Ops/sec
object literal & sum.call	1613394.8 Ops/sec
object literal & sum.bind	91517.2 Ops/sec
Object.create	47204.8 Ops/sec
Object.setPrototypeOf	43916.7 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 7 months ago):

It looks like we have a benchmarking result for JavaScript performance comparisons!

After analyzing the results, I'll provide some insights:

Chrome 129 is a consistent performer across all tests.
The test with the highest ExecutionsPerSecond score is object literal, which suggests that the test performs better when objects are created using literal syntax (e.g., let x = { foo: 'bar', bar: 'baz' };) rather than other methods.
The test with the next-highest ExecutionsPerSecond score is object literal & sum.call, which suggests that combining object creation with the sum() function call improves performance.
The tests involving function constructor, class without declared fields, and class with declared fields show varying levels of performance, but overall, they are slower than the object literal tests.

These results may be influenced by factors such as:

JavaScript engine optimizations
Cache effects on repeated calls to X(1, 2, 3)
The specific use cases and performance requirements of each test

Keep in mind that these findings are based on a single benchmarking result and should be interpreted with caution.

LLMs can make mistakes. Check important info.

It looks like we have a benchmarking result for JavaScript performance comparisons!

After analyzing the results, I'll provide some insights:

1. **Chrome 129** is a consistent performer across all tests.
2. The test with the highest **ExecutionsPerSecond** score is **object literal**, which suggests that the test performs better when objects are created using literal syntax (e.g., `let x = { foo: 'bar', bar: 'baz' };`) rather than other methods.
3. The test with the next-highest **ExecutionsPerSecond** score is **object literal & sum.call**, which suggests that combining object creation with the `sum()` function call improves performance.
4. The tests involving **function constructor**, **class without declared fields**, and **class with declared fields** show varying levels of performance, but overall, they are slower than the object literal tests.

These results may be influenced by factors such as:

* JavaScript engine optimizations
* Cache effects on repeated calls to `X(1, 2, 3)`
* The specific use cases and performance requirements of each test

Keep in mind that these findings are based on a single benchmarking result and should be interpreted with caution.

Related benchmarks: