Benchmark: Property Assignment vs Symbol Assignment in Class Constructor

Script Preparation code:

class Propertied {
    constructor() {
        this.key = 1;
    }
}
window.Propertied = Propertied;

const symbol = Symbol("key");
class Symboled {
    constructor() {
        this[symbol] = 1;
    }
}

window.Symboled = Symboled;

Tests:

Property
new Propertied();
Symbol
new Symboled();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Property
Symbol

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/114.0

Browser/OS: Firefox 114 on Ubuntu

View result in a separate tab

Test name	Executions per second
Property	99961976.0 Ops/sec
Symbol	94740024.0 Ops/sec

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

LLMs can make mistakes. Check important info.

I'll break down the benchmark and explain what's being tested, compared options, pros and cons of those approaches, and other considerations.

**Benchmark Overview**

The benchmark measures the performance difference between two ways to assign properties to an object in JavaScript:

1. **Property Assignment**: Using dot notation (e.g., `this.key = 1;`)
2. **Symbol Assignment**: Using symbols as property keys (e.g., `this[symbol] = 1;`)

**Options Compared**

The benchmark compares the performance of these two approaches on the same JavaScript class constructor (`Propertied` and `Symboled`) with the following variations:

* Creating a new instance of `Propertied`
* Creating a new instance of `Symboled`

**Pros and Cons of Each Approach**

1. **Property Assignment (dot notation)**:
	* Pros: Widespread support, easy to use.
	* Cons: Performance may be slower due to property lookup in the object's prototype chain.
2. **Symbol Assignment (symbol key)**:
	* Pros: Potential performance improvement over dot notation, as symbols are stored in a separate data structure that avoids the overhead of property lookup on the object's prototype chain.
	* Cons: Symbol creation is computationally expensive and may not be suitable for all use cases.

**Other Considerations**

* The benchmark uses `window.Propertied` and `window.Symboled` to make these classes globally accessible, allowing them to be instantiated directly in a browser console or test environment. This approach simplifies the benchmarking process but may not accurately reflect real-world scenarios where class definitions are typically wrapped in a module or used within a specific context.
* The benchmark does not consider other factors that might impact performance, such as the size of the object being assigned properties to, the number of properties being assigned, or the JavaScript engine's implementation-specific optimizations.

**Library and Special JS Features**

The benchmark uses the `Symbol` function from the JavaScript Standard Library (ECMAScript 2015) to create symbols. The `Symbol` function is used to define unique symbols that can be used as property keys.

**Other Alternatives**

If you're looking for alternative approaches or libraries, consider:

* Using a library like `fast-symbol` which provides an optimized symbol creation mechanism.
* Implementing your own custom property key system using arrays, strings, or other data structures.
* Considering the use of a JavaScript engine's built-in optimization techniques, such as inlining and caching.

Keep in mind that these alternatives might not provide the same level of performance benefits as the original benchmark, which is specifically designed to compare the performance of property assignment and symbol assignment.

Related benchmarks:

Property Assignment vs Symbol Assignment in Class Constructor (version: 0)

Comparing performance of: Property vs Symbol

Created: 4 years ago by: Guest

Jump to the latest result

Property

Symbol

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):