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: 8 years ago by: Registered User

Jump 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;

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

Autogenerated LLM Summary (model llama3.2:3b, generated one month 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.

Latest run results:

Run details: (Test run date: 19 days ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36

Browser/OS: Chrome 130 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Read from data property	26333944.0 Ops/sec
Write to data property	26727718.0 Ops/sec
Read from accessor method	14317244.0 Ops/sec
Write to mutator method	12511429.0 Ops/sec
Read from object literal property	11265467.0 Ops/sec
Write to object literal property	7910180.0 Ops/sec
Read from object literal property on prototype	14426491.0 Ops/sec
Write to object literal property on prototype	12680637.0 Ops/sec

Related benchmarks:

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: 8 years ago by: Registered User

Jump 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

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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