Benchmark: Property access via dot notation vs brackets

Script Preparation code:

my_data = {
  the_property: 47,
};

THE_PROPERTY = 'the_property';

Tests:

Property notation
let a = my_data.the_property + 1;
Bracket notation
let a = my_data[THE_PROPERTY] + 1;

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Property notation
Bracket notation

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 133 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Property notation	170110832.0 Ops/sec
Bracket notation	165976480.0 Ops/sec

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

LLMs can make mistakes. Check important info.

I'd be happy to explain the benchmark and its various components.

**Benchmark Overview**

The provided JSON represents a JavaScript microbenchmark that tests two ways of accessing properties in an object: dot notation and bracket notation.

**Script Preparation Code**

```javascript
my_data = {
  the_property: 47,
};
THE_PROPERTY = 'the_property';
```

This code creates an object `my_data` with a single property `the_property` set to `47`. Then, it reassigns the value of `THE_PROPERTY` to `'the_property'`.

**Html Preparation Code**

The HTML preparation code is empty in this benchmark.

**Test Cases**

There are two individual test cases:

1. **Property Notation**
```javascript
let a = my_data.the_property + 1;
```

This test case uses dot notation to access the `the_property` property of the `my_data` object and then increments its value by 1.

2. **Bracket Notation**
```javascript
let a = my_data[THE_PROPERTY] + 1;
```

This test case uses bracket notation to access the `the_property` property of the `my_data` object, which has been previously reassigned to `'the_property'`, and then increments its value by 1.

**Library Usage**

There is no explicit library usage in this benchmark. However, some browsers might use internal optimizations or caching mechanisms that could affect the results.

**Special JS Feature/Syntax**

This benchmark does not use any special JavaScript features or syntax beyond what's standard in modern browsers.

**Options Comparison**

The two test cases compare the performance of dot notation (`my_data.the_property`) and bracket notation (`my_data[THE_PROPERTY]`).

Pros and Cons:

* **Dot Notation:**
	+ Pros:
		- Can be more readable and easier to maintain for some developers.
		- Might be faster in some browsers due to optimizations (e.g., caching or inlining).
	+ Cons:
		- Can lead to longer property names, making the code harder to read.
* **Bracket Notation:**
	+ Pros:
		- Allows for more flexible and dynamic property access.
		- Might be faster in some cases due to improved cache locality or optimization.
	+ Cons:
		- Can make the code harder to read and understand.

Other Alternatives

There are other ways to access properties in JavaScript, such as:

* Using `in` operator: `let a = my_data['the_property'] + 1;`
* Using bracket notation with a string literal: `let a = my_data["the_property"] + 1;`

However, these alternatives are not explicitly tested in this benchmark.

**Benchmark Result**

The latest benchmark result shows the performance of both test cases:

| Test Name | Executions Per Second |
| --- | --- |
| Property Notation | 17,108,312.0 |
| Bracket Notation | 8,345,080.5 |

Note that these results are specific to the Safari 17 browser on a Mac OS X 10.15.7 desktop device and might not be representative of other browsers or devices.

Related benchmarks:

Property access via dot notation vs brackets (version: 0)

Comparing performance of: Property notation vs Bracket notation

Created: 2 years ago by: Registered User

Jump to the latest result

Property notation

Bracket notation

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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