Benchmark: startswith vs indexOf vs regex

Script Preparation code:

 var lorem = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent congue, ipsum non scelerisque convallis Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent congue, ipsum non scelerisque convallis Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent congue, ipsum non scelerisque convallis Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent congue, ipsum non scelerisque convallis";
 var LOREM_RE = /^L/;
 var ROLEM_RE = /^R/;

Tests:

lorem.startsWith("L");
lorem.startsWith("L");
lorem.indexOf("L") === 0;
lorem.indexOf("L") === 0;
LOREM_RE.test(lorem);
LOREM_RE.test(lorem);
lorem.startsWith("R");
lorem.startsWith("R");
lorem.indexOf("R") === 0;
lorem.indexOf("R") === 0;
ROLEM_RE.test(lorem);
ROLEM_RE.test(lorem);
lorem && lorem[0] === "L";
lorem && lorem[0] === "L";

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
lorem.startsWith("L");
lorem.indexOf("L") === 0;
LOREM_RE.test(lorem);
lorem.startsWith("R");
lorem.indexOf("R") === 0;
ROLEM_RE.test(lorem);
lorem && lorem[0] === "L";

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 111 on Windows

View result in a separate tab

Test name	Executions per second
lorem.startsWith("L");	19701126.0 Ops/sec
lorem.indexOf("L") === 0;	20596980.0 Ops/sec
LOREM_RE.test(lorem);	8627034.0 Ops/sec
lorem.startsWith("R");	20186576.0 Ops/sec
lorem.indexOf("R") === 0;	20728834.0 Ops/sec
ROLEM_RE.test(lorem);	9000487.0 Ops/sec
lorem && lorem[0] === "L";	10217614.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, the pros and cons of each approach, and other considerations.

**Benchmark Overview**

The benchmark compares the performance of three different methods to check if a string starts with a certain substring:

1. `startsWith()`
2. `indexOf()` with a condition
3. Regular expression (`^` anchor)

The test case uses a sample string `lorem`, which is defined in the script preparation code.

**Script Preparation Code**

```javascript
var lorem = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent congue, ipsum non scelerisque convallis Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent congue, ipsum non scelerisque convallis Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent congue, ipsum non scelerisque convallis Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent congue, ipsum non scelerisque convallis";
var LOREM_RE = /^L/;
var ROLEM_RE = /^R/;
```

The script defines the `lorem` string and two regular expressions: `LOREM_RE` to match the starting character 'L' and `ROLEM_RE` to match the starting character 'R'.

**Benchmark Definitions**

There are six test cases, each defining a different benchmark:

1. `lorem.startsWith("L");`
2. `lorem.indexOf("L") === 0;`
3. `LOREM_RE.test(lorem);`
4. `lorem.startsWith("R");`
5. `lorem.indexOf("R") === 0;`
6. `ROLEM_RE.test(lorem);`

Each test case uses a different method to check if the string starts with the specified substring.

**Performance Comparison**

The benchmark measures the execution time of each test case on multiple browsers and devices. The latest result shows that:

* `lorem.indexOf("R") === 0;` has the highest number of executions per second (20596980) followed by `LOREM_RE.test(lorem);` (9000487), then `lorem.startsWith("L");` (19701126), and so on.

**Pros and Cons**

Here's a brief analysis of each approach:

* **startsWith()**: This method is generally the fastest and most efficient way to check if a string starts with a substring. It has an average time complexity of O(n), where n is the length of the string.
* **indexOf()` with a condition**: This method also checks for the starting character, but it uses a binary search approach under the hood, which makes it slightly slower than `startsWith()`. The time complexity is still O(n), but the constant factor may be higher due to the overhead of the binary search algorithm.
* **Regular expression (`^` anchor)**: This method uses a regular expression with a caret character (`^`) at the start. While regular expressions can be powerful and flexible, they often come with a performance overhead due to the complexity of the pattern matching. In this case, the time complexity is still O(n), but the constant factor may be higher than `startsWith()`.

**Other Considerations**

* **Browser and device differences**: The benchmark result shows significant variations in execution times across different browsers and devices. This highlights the importance of considering these factors when optimizing performance-critical code.
* **Constant-time vs variable-time complexity**: Both `startsWith()` and regular expressions have a time complexity of O(n), but `startsWith()` is generally faster due to its simpler implementation and lower overhead.

Overall, while all three methods are suitable for checking if a string starts with a substring, `startsWith()` remains the fastest and most efficient approach.

Related benchmarks:

startswith vs indexOf vs regex (version: 0)

Comparing performance of: lorem.startsWith("L"); vs lorem.indexOf("L") === 0; vs LOREM_RE.test(lorem); vs lorem.startsWith("R"); vs lorem.indexOf("R") === 0; vs ROLEM_RE.test(lorem); vs lorem && lorem[0] === "L";

Created: 4 years ago by: Guest

Jump to the latest result

lorem.startsWith("L");

lorem.indexOf("L") === 0;

LOREM_RE.test(lorem);

lorem.startsWith("R");

lorem.indexOf("R") === 0;

ROLEM_RE.test(lorem);

lorem && lorem[0] === "L";

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