Benchmark: Symbol vs String property square bracket

Script Preparation code:

var foo = {};
var sym = Symbol("key");
var str = "key";

Tests:

Symbol
foo[sym] = 1;
String
foo[str] = 1;

Historical Performance Data aggregated from 124 community runs

Desktop Results:

Chrome 88 runs

String

13.6M/s

Symbol

13.3M/s

View exact numbers

✓ String: 13,550,116 ops/sec
• Symbol: 13,295,436 ops/sec

Firefox 16 runs

String

663.5M/s

Symbol

643.7M/s

View exact numbers

✓ String: 663,524,544 ops/sec
• Symbol: 643,668,608 ops/sec

Mobile Results:

Chrome 11 runs

String

22.4M/s

Symbol

21.6M/s

View exact numbers

✓ String: 22,390,088 ops/sec
• Symbol: 21,603,908 ops/sec

Safari 9 runs

Symbol

196.3M/s

String

184.7M/s

View exact numbers

✓ Symbol: 196,315,376 ops/sec
• String: 184,748,880 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
Symbol
String

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:143.0) Gecko/20100101 Firefox/143.0

Browser/OS: Firefox 143 on Mac OS X 10.15

View result in a separate tab

String

1263.4M/s

Symbol

1253.1M/s

View exact numbers

Test name	Executions per second
✓ String	1,263,352,448 Ops/sec
Symbol	1,253,146,240 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 and explain what's being tested, compared, and their pros and cons.

**Benchmark Overview**

The benchmark is testing how fast JavaScript engines can access properties on an object using either a `Symbol` property or a string property. The benchmark is comparing the performance of these two approaches.

**Options Compared**

There are only two options being compared:

1. **Symbol Property**: Using a `Symbol` property to access the value.
2. **String Property**: Using a string property (e.g., "key") to access the value.

**Pros and Cons of Each Approach**

* **Symbol Property**
	+ Pros:
		- Unique identifier, which can prevent conflicts with other properties.
		- Can be used as a key in `Object.prototype.hasOwnProperty()` checks for performance optimization.
	+ Cons:
		- May not be supported by older JavaScript engines or browsers.
		- Not human-readable, making it harder to debug.
* **String Property**
	+ Pros:
		- Widely supported across older and newer JavaScript engines and browsers.
		- Human-readable, making it easier to debug.
	+ Cons:
		- May cause conflicts with other properties if not used carefully.

**Library and Purpose**

In this benchmark, the `Symbol` function is being used to create a new symbol property. The `Symbol` function was introduced in ECMAScript 2015 (ES6) as a way to create unique identifiers that can be used as property keys or function signatures.

**Special JS Feature/ Syntax**

The benchmark uses the `Symbol` function, which is a special feature introduced in ES6. It's not a standard JavaScript syntax, but rather a new construct introduced by the language specification. This means that older JavaScript engines and browsers may not support it natively.

**Other Alternatives**

If you wanted to write this benchmark yourself, here are some alternatives:

1. Use `Object.create(null)`: Instead of using a symbol property, you could use an object created with `Object.create(null)` as the test subject.
2. Use `Map` or `WeakMap`: If you're targeting modern browsers that support `Map` and `WeakMap`, you could use these data structures to store the keys and values.
3. Write a custom property accessor: You could write a custom property accessor function to test how JavaScript engines handle property access.

Keep in mind that implementing this benchmark yourself would require writing custom code to replicate the exact behavior of the `Symbol` property.

For your reference, here's some sample code for each alternative:

* Using `Object.create(null)`: `var foo = Object.create(null); foo[sym] = 1;`
* Using `Map`: `const map = new Map(); map.set(symmetricKey, value);`
* Writing a custom property accessor: You would need to write a function that takes the property key and value as arguments and performs the desired operation.

Symbol vs String property square bracket (version: 0)

Comparing performance of: `Symbol vs String`

Created: 5 years ago by: Guest

Go to the latest result

Symbol

String

Historical Performance Data aggregated from 124 community runs

Desktop Results:

Chrome 88 runs

Firefox 16 runs

Mobile Results:

Chrome 11 runs

Safari 9 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Symbol vs String property square bracket (version: 0)

Comparing performance of: Symbol vs String

Created: 5 years ago by: Guest

Go to the latest result

Symbol

String

Historical Performance Data aggregated from 124 community runs

Desktop Results:

Chrome 88 runs

Firefox 16 runs

Mobile Results:

Chrome 11 runs

Safari 9 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

Comparing performance of: `Symbol vs String`