Benchmark: optional chain vs typeof

Script Preparation code:

var obj = { func: function (v) { return v; } };

Tests:

optional chain prop found
for (let n = 0; n < 1000; n++) { const r = obj.func?.(true) ?? false }
optional chain prop not found
for (let n = 0; n < 1000; n++) { const r = obj.func2?.(true) ?? false }
typeof match
for (let n = 0; n < 1000; n++) { const r = typeof obj.func === 'function' ? obj.func(true) : false }
typeof mismatch
for (let n = 0; n < 1000; n++) { const r = typeof obj.func2 === 'function' ? obj.func2(true) : false }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
optional chain prop found
optional chain prop not found
typeof match
typeof mismatch

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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 is being tested.

**Benchmark Overview**

The benchmark compares the performance of two approaches: using optional chaining (`?.`) versus checking if a value is a function using `typeof`.

**Optional Chaining (`?.`)**

Optional chaining allows you to access nested properties of an object without explicitly checking if the property exists. In this case, the code uses `?.` to call the `func` method on the `obj` object with the argument `true`, and then checks if the result is truthy using the nullish coalescing operator (`??`). If the expression is falsy, it returns `false`.

**Checking for Functionality using `typeof`**

The other approach uses `typeof` to check if the `func2` property of the `obj` object is a function. If it is, then it calls the function with the argument `true`. This approach requires an explicit check for `function` type before calling the method.

**Pros and Cons of Each Approach**

* **Optional Chaining (`?.`)**:
	+ Pros: concise and expressive syntax, reduces repetition.
	+ Cons: can lead to runtime errors if the property is not found, may be slower due to the nullish coalescing operator's overhead.
* **Checking for Functionality using `typeof`**:
	+ Pros: explicit and safe way to check for function existence, potentially faster since it avoids the nullish coalescing operator's overhead.
	+ Cons: more verbose syntax, requires additional checks.

**Library Usage**

There is no library used in this benchmark. The code relies on built-in JavaScript features such as optional chaining (`?.`) and `typeof`.

**Special JS Feature or Syntax**

The benchmark uses a feature that was introduced in ECMAScript 2020: the nullish coalescing operator (`??`). This operator returns its first operand if it's not null or undefined, otherwise it returns its second operand.

**Other Alternatives**

If you're interested in exploring alternative approaches, here are a few options:

* Using `in` operator to check for property existence instead of optional chaining.
* Utilizing the `isFunction` function from a library like Lodash.
* Implementing a custom check using a more complex expression or a separate function.

Keep in mind that these alternatives may have different performance characteristics and trade-offs, so it's essential to test them thoroughly before making a decision.

Related benchmarks:

optional chain vs typeof (version: 0)

Comparing performance of: optional chain prop found vs optional chain prop not found vs typeof match vs typeof mismatch

Created: 3 years ago by: Registered User

Jump to the latest result

optional chain prop found

optional chain prop not found

typeof match

typeof mismatch

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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