Benchmark: conditionally insert properties w/ terinary

Tests:

boring
const obj = { hello: "world" }; if (Math.random()>.5) { obj.foo = "bar"; }
spread
const obj = { hello: "world", ...Math.random()>.5 && { foo: "bar" } };
Object.assign
const obj = Object.assign({ hello: "world" }, Math.random()>.5 && { foo: "bar" });
Terinary
const obj = { hello: "world" }; Math.random()>.5 ? obj.foo = "bar" : false

Historical Performance Data aggregated from 18 community runs

Desktop Results:

Chrome 10 runs

Terinary

105.2M/s

boring

105.2M/s

spread

36.5M/s

Object.assign

30.5M/s

Fastest: Terinary (3.5x faster)

View exact numbers

✓ Terinary: 105,219,280 ops/sec
• boring: 105,200,048 ops/sec
• spread: 36,548,416 ops/sec
• Object.assign: 30,450,228 ops/sec

Firefox 8 runs

boring

103.8M/s

Terinary

101.8M/s

Object.assign

25.6M/s

spread

20.7M/s

Fastest: boring (5.0x faster)

View exact numbers

✓ boring: 103,825,144 ops/sec
• Terinary: 101,795,376 ops/sec
• Object.assign: 25,643,344 ops/sec
• spread: 20,746,062 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
boring
spread
Object.assign
Terinary

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 152 on Windows

View result in a separate tab

Terinary

69.3M/s

boring

66.3M/s

spread

18.6M/s

Object.assign

12.5M/s

View exact numbers

Test name	Executions per second
✓ Terinary	69,345,056 Ops/sec
boring	66,305,428 Ops/sec
spread	18,589,244 Ops/sec
Object.assign	12,474,527 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net.

The provided benchmark measures the performance of three different approaches to conditionally insert properties into an object: the ternary operator, spread syntax, and `Object.assign()`.

**Benchmark Definitions**

1. **Ternary Operator**: This approach uses a single expression with two conditions to set a property on the object. The syntax is: `obj.foo = "bar"` if `(Math.random() > 0.5)`. The purpose of this benchmark is to test the performance of assigning properties dynamically.
2. **Spread Syntax**: This approach uses the spread operator (`...`) to create a new object with conditionally included properties. The syntax is: `{ ...Math.random() > .5 && { foo: "bar" } }`. The purpose of this benchmark is to test the performance of using the spread operator for dynamic property creation.
3. **Object.assign()**: This approach uses the `Object.assign()` method to merge two objects, conditionally including properties. The syntax is: `Object.assign({ hello: "world" }, Math.random() > .5 && { foo: "bar" })`. The purpose of this benchmark is to test the performance of using `Object.assign()` for dynamic property assignment.

**Comparison**

| Approach | Description |
| --- | --- |
| Ternary Operator | Simple, direct assignment with a single expression. Pros: easy to read, concise. Cons: might be slower due to parsing overhead. |
| Spread Syntax | More expressive and flexible than ternary operator. Pros: readable, maintainable code. Cons: may introduce additional overhead due to object creation. |
| Object.assign() | Powerful method for merging objects, but can have performance implications if not optimized correctly. Pros: versatile, powerful. Cons: might be slower due to method invocation overhead. |

**Library Usage**

None of the benchmark definitions use a library explicitly.

**Special JS Features or Syntax**

* None mentioned in this explanation.
* Note that MeasureThat.net does support testing specific JavaScript features and syntax using its `--experimental-features` option, but it's not enabled by default.

**Other Alternatives**

If you're interested in comparing performance of other approaches for conditionally inserting properties into an object, here are a few alternatives:

1. Using a template literal with a conditional expression: `{ hello: "world", foo: ${Math.random() > 0.5 ? "bar" : null} }`.
2. Using the `?` operator (introduced in ECMAScript 2020): `const obj = { hello: "world" }; const foo = Math.random() > 0.5 ? "bar" : undefined; Object.defineProperty(obj, "foo", { value: foo });
3. Using a loop to dynamically set properties on an object.

Keep in mind that each alternative has its own trade-offs and potential performance implications, which may or may not be relevant depending on the specific use case.

conditionally insert properties w/ terinary (version: 0) Benchmark.js

https://www.reddit.com/r/javascript/comments/mrzrty/the_shortest_way_to_conditionally_insert/

Comparing performance of: `boring vs spread vs Object.assign vs Terinary`

Created: 5 years ago by: Guest

Go to the latest result

boring

spread

Object.assign

Terinary

Historical Performance Data aggregated from 18 community runs

Desktop Results:

Chrome 10 runs

Firefox 8 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

conditionally insert properties w/ terinary (version: 0) Benchmark.js

https://www.reddit.com/r/javascript/comments/mrzrty/the_shortest_way_to_conditionally_insert/

Comparing performance of: boring vs spread vs Object.assign vs Terinary

Created: 5 years ago by: Guest

Go to the latest result

boring

spread

Object.assign

Terinary

Historical Performance Data aggregated from 18 community runs

Desktop Results:

Chrome 10 runs

Firefox 8 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Comparing performance of: `boring vs spread vs Object.assign vs Terinary`