Benchmark: if-else vs switch-case vs object literals vs ternary-operator

Script Preparation code:

var str = 'abc';
str = str.charAt(Math.floor(Math.random() * 3));

AخA
 
var str = 'abc';str = str.charAt(Math.floor(Math.random() * 3));

Tests:

If - Else

if(str === 'a'){
 	console.log('A'); 
} else if (str === 'b'){
 	console.log('B'); 
} else if (str === 'c'){
 	console.log('C'); 
}

 
if(str === 'a'){    console.log('A'); } else if (str === 'b'){    console.log('B'); } else if (str === 'c'){    console.log('C'); }

Switch - Case
switch (str) { case 'a': console.log('A'); break; case 'b': console.log('B'); break; case 'c': console.log('C'); break; }
switch (str) {
case 'a': console.log('A'); break;
case 'b': console.log('B'); break;
case 'c': console.log('C'); break;
}

Object literals

var objLiteral = {
  a: function() {
    console.log('A');
  },
  b: function() {
    console.log('B');
  },
  c: function() {
    console.log('C');
  }
}

objLiteral[str]();

​x
 
var objLiteral = {  a: function() {    console.log('A');  },  b: function() {    console.log('B');  },  c: function() {    console.log('C');  }}​objLiteral[str]();

ternary-operator
str === 'a' ? console.log('A') : str === 'b' ? console.log('B') : str === 'c' ? console.log('C') : console.log('nothing')
str === 'a' ? console.log('A') : str === 'b' ? console.log('B') : str === 'c' ? console.log('C') : console.log('nothing')

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
If - Else
Switch - Case
Object literals
ternary-operator

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 134 on Windows

View result in a separate tab

Test name	Executions per second
If - Else	187476.7 Ops/sec
Switch - Case	185697.1 Ops/sec
Object literals	200783.8 Ops/sec
ternary-operator	221315.2 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 6 months ago):

Let's break down the provided JSON and explain what's being tested, compared, and their pros and cons.

Benchmark Definition

The benchmark measures the performance of different JavaScript control flow structures:

If-Else statements
Switch-Case statements
Object literals (using function invocation)
Ternary operators

The goal is to determine which approach is the fastest for a specific use case, in this case, setting a variable str to one of three possible values: 'a', 'b', or 'c', and then performing operations on that value.

Test Cases

Each test case represents a single control flow structure. Here's a brief explanation of each:

If-Else: This test case uses an if-else statement with three conditions, checking for 'a', 'b', and 'c'. If the condition matches, it logs a message to the console.
Switch-Case: Similar to the if-else test, but using a switch-case statement instead. The values are still 'a', 'b', or 'c'.
Object literals: This test case uses an object literal with three functions (one for each possible value of str). It then invokes one of these functions based on the current value of str.
Ternary Operator: A single-line ternary operator is used to set a variable to 'A', 'B', or 'C' based on the value of str. Then, it logs a message to the console.

Pros and Cons

Each approach has its trade-offs:

If-Else statements:
- Pros: Simple to read and write, flexible.
- Cons: Can be slower due to branch prediction issues and the need for multiple checks.
Switch-Case statements:
- Pros: Fast lookup times, suitable for discrete values.
- Cons: Limited flexibility if value ranges are not well-defined.
Object literals:
- Pros: Can encapsulate complex logic, flexible data structures.
- Cons: May be slower due to function invocation and object lookups.
Ternary Operator:
- Pros: Concise and readable, suitable for simple conditional expressions.
- Cons: Limited flexibility if the condition is not a simple equality check.

Browser-Specific Notes

The benchmark results show that Chrome 129 on Mac OS X 10.15.7 favors switch-case statements ( highest ExecutionsPerSecond value). This might be due to the way switch-case statements are optimized in modern JavaScript engines.

Other Considerations

Function Invocation: The object literal test case involves function invocation, which can add overhead.
Branch Prediction: If-Else and Switch-Case statements rely on branch prediction to execute faster. Poor branch prediction or misaligned code execution can negatively impact performance.

Keep in mind that these results are specific to the provided benchmarking scenario and may not generalize to other use cases or JavaScript engines.

As for alternatives, you could consider:

Using Object.hasOwn() instead of property lookups
Implementing custom loops for each control flow structure (e.g., a switch-case loop)
Optimizing the logic using bitwise operators or other optimizations specific to the target architecture.

LLMs can make mistakes. Check important info.

Let's break down the provided JSON and explain what's being tested, compared, and their pros and cons.

**Benchmark Definition**

The benchmark measures the performance of different JavaScript control flow structures:

1. If-Else statements
2. Switch-Case statements
3. Object literals (using function invocation)
4. Ternary operators

The goal is to determine which approach is the fastest for a specific use case, in this case, setting a variable `str` to one of three possible values: 'a', 'b', or 'c', and then performing operations on that value.

**Test Cases**

Each test case represents a single control flow structure. Here's a brief explanation of each:

1. **If-Else**: This test case uses an if-else statement with three conditions, checking for 'a', 'b', and 'c'. If the condition matches, it logs a message to the console.
2. **Switch-Case**: Similar to the if-else test, but using a switch-case statement instead. The values are still 'a', 'b', or 'c'.
3. **Object literals**: This test case uses an object literal with three functions (one for each possible value of `str`). It then invokes one of these functions based on the current value of `str`.
4. **Ternary Operator**: A single-line ternary operator is used to set a variable to 'A', 'B', or 'C' based on the value of `str`. Then, it logs a message to the console.

**Pros and Cons**

Each approach has its trade-offs:

1. **If-Else statements**:
	* Pros: Simple to read and write, flexible.
	* Cons: Can be slower due to branch prediction issues and the need for multiple checks.
2. **Switch-Case statements**:
	* Pros: Fast lookup times, suitable for discrete values.
	* Cons: Limited flexibility if value ranges are not well-defined.
3. **Object literals**:
	* Pros: Can encapsulate complex logic, flexible data structures.
	* Cons: May be slower due to function invocation and object lookups.
4. **Ternary Operator**:
	* Pros: Concise and readable, suitable for simple conditional expressions.
	* Cons: Limited flexibility if the condition is not a simple equality check.

**Browser-Specific Notes**

The benchmark results show that Chrome 129 on Mac OS X 10.15.7 favors switch-case statements ( highest `ExecutionsPerSecond` value). This might be due to the way switch-case statements are optimized in modern JavaScript engines.

**Other Considerations**

* **Function Invocation**: The object literal test case involves function invocation, which can add overhead.
* **Branch Prediction**: If-Else and Switch-Case statements rely on branch prediction to execute faster. Poor branch prediction or misaligned code execution can negatively impact performance.

Keep in mind that these results are specific to the provided benchmarking scenario and may not generalize to other use cases or JavaScript engines.

As for alternatives, you could consider:

* Using `Object.hasOwn()` instead of property lookups
* Implementing custom loops for each control flow structure (e.g., a switch-case loop)
* Optimizing the logic using bitwise operators or other optimizations specific to the target architecture.

Related benchmarks:

if-else vs switch-case vs object literals vs ternary-operator (version: 0)

Comparing performance of: If - Else vs Switch - Case vs Object literals vs ternary-operator

Created: 2 years ago by: Guest

Jump to the latest result