Benchmark: Data Properties vs. Accessor Properties vs. Getter / Setter Methods

Data Properties vs. Accessor Properties vs. Getter / Setter Methods (version: 0)

The purpose of this benchmark is to determine the performance differences between data properties, accessor properties and getters / setter functions.

Comparing performance of: `Read from data property vs Write to data property vs Read from accessor method vs Write to mutator method vs Read from object literal property vs Write to object literal property vs Read from object literal property on prototype vs Write to object literal property on prototype`

Created: 9 years ago by: Registered User

Go to the latest result

Script Preparation code:

var data = {
  property: property
};

var property = undefined;

var method = {
  getProperty: function() {
    return property;
  },

  setProperty: function(value) {
    property = value;
  }
};

var objectLiteralAccessor = {
  get property() {
    return property;
  },
  set property(value) {
    property = value;
  }
};

function Class() {
}

Class.prototype = {
  get property() {
    return property;
  },
  set property(value) {
    property = value;
  }
};
    
var prototypeAccessor = new Class();

Tests:

Read from data property
var value = data.property;
Write to data property
data.property = true;
Read from accessor method
var value = method.getProperty();
Write to mutator method
method.setProperty(true);
Read from object literal property
var value = objectLiteralAccessor.property;
Write to object literal property
objectLiteralAccessor.property = true;
Read from object literal property on prototype
var value = prototypeAccessor.property;
Write to object literal property on prototype
prototypeAccessor.property = true;

Historical Performance Data aggregated from 27 community runs

Desktop Results:

Chrome 27 runs

Read from data property

31.1M/s

Write to data property

30.9M/s

Read from accessor method

16.7M/s

Read from object literal property on prototype

16.5M/s

Write to mutator method

14.6M/s

Write to object literal property on prototype

14.3M/s

Read from object literal property

13.3M/s

Write to object literal property

9.0M/s

Fastest: Read from data property (3.4x faster)

View exact numbers

✓ Read from data property: 31,055,598 ops/sec
• Write to data property: 30,865,770 ops/sec
• Read from accessor method: 16,697,731 ops/sec
• Read from object literal property on prototype: 16,498,720 ops/sec
• Write to mutator method: 14,593,375 ops/sec
• Write to object literal property on prototype: 14,310,569 ops/sec
• Read from object literal property: 13,345,314 ops/sec
• Write to object literal property: 9,029,430 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Read from data property
Write to data property
Read from accessor method
Write to mutator method
Read from object literal property
Write to object literal property
Read from object literal property on prototype
Write to object literal property on prototype

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 7 months ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36

Browser/OS: Chrome 143 on Windows

View result in a separate tab

Read from data property

132.3M/s

Read from accessor method

129.6M/s

Write to mutator method

129.4M/s

Write to data property

124.5M/s

Read from object literal property on prototype

117.5M/s

Write to object literal property on prototype

114.3M/s

Read from object literal property

51.5M/s

Write to object literal property

10.1M/s

View exact numbers

Test name	Executions per second
✓ Read from data property	132,316,656 Ops/sec
Read from accessor method	129,604,000 Ops/sec
Write to mutator method	129,409,640 Ops/sec
Write to data property	124,522,288 Ops/sec
Read from object literal property on prototype	117,481,648 Ops/sec
Write to object literal property on prototype	114,295,216 Ops/sec
Read from object literal property	51,487,680 Ops/sec
Write to object literal property	10,112,071 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark test cases and explain what is being tested, the pros and cons of each approach, and other considerations.

**Benchmark Definition**

The benchmark tests the performance differences between three approaches to access and modify properties in JavaScript:

1. **Data Properties**: Directly accessing a property on an object using dot notation (e.g., `data.property`).
2. **Accessor Properties**: Using accessor methods or getters and setters to access and modify properties (e.g., `objectLiteralAccessor.property`).
3. **Getter/Setter Methods**: Using getter and setter functions as methods to access and modify properties (e.g., `method.getProperty()`).

**Pros and Cons of Each Approach**

1. **Data Properties**:
	* Pros: Simple, efficient, and widely supported.
	* Cons: Can lead to polluting the global scope if not used carefully, can cause issues with property shadowing, and may not be as readable as other approaches.
2. **Accessor Properties**:
	* Pros: Encapsulate data and behavior, improve code readability, and reduce polluting the global scope.
	* Cons: May introduce additional overhead due to method calls, and can lead to confusion if not used consistently.
3. **Getter/Setter Methods**:
	* Pros: Decoupling between data and behavior, improving code modularity, and better support for dependency injection.
	* Cons: Can be more verbose than accessor properties, may introduce additional overhead, and can lead to performance issues if not implemented efficiently.

**Other Considerations**

* **Prototype Chain**: In JavaScript, objects inherit properties from their prototype chain. This means that the `prototypeAccessor` test case also accesses the property through the prototype chain.
* **Property Accessors on Prototypes**: Some browsers may optimize property access on prototypes, making them faster than accessing properties directly.

**Library and Dependencies**

There is no explicit library or dependency mentioned in the benchmark definition or test cases. However, it's worth noting that some JavaScript engines, like V8, have optimized built-in support for accessor properties and getters/setters.

**Special JS Features or Syntax**

The benchmark does not explicitly use any special JavaScript features or syntax beyond standard language constructs. However, the use of getter and setter functions (getter/setter methods) may be a more advanced concept that not all developers are familiar with.

In summary, this benchmark tests the performance differences between three approaches to access and modify properties in JavaScript: data properties, accessor properties, and getter/setter methods. Each approach has its pros and cons, and understanding these trade-offs is essential for writing efficient, readable, and maintainable code.

Data Properties vs. Accessor Properties vs. Getter / Setter Methods (version: 0)

The purpose of this benchmark is to determine the performance differences between data properties, accessor properties and getters / setter functions.

Created: 9 years ago by: Registered User

Go to the latest result

Read from data property

Write to data property

Read from accessor method

Write to mutator method

Read from object literal property

Write to object literal property

Read from object literal property on prototype

Write to object literal property on prototype

Historical Performance Data aggregated from 27 community runs

Desktop Results:

Chrome 27 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks