Benchmark: JS Regex vs .startsWith vs .indexOf [Fixed]

HTML Preparation code:

<div></div>

Script Preparation code:

window.regexStart = /^test/;
window.regexEnd = /test$/;
window.match = 'test';
window.matchLength = window.match.length;
var data = window.data = [];
const possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
var TOTAL_STRINGS = window.TOTAL_STRINGS = 100000;

function getRandomInt(max) {
  return Math.floor(Math.random() * max);
}

function makeRandomString(len) {
  var text = "";
  for( var i=0; i < len; i++ ) {
    text += possible.charAt(getRandomInt(possible.length));
  }
  return text;
}

while (data.length < TOTAL_STRINGS) {
  data.push(makeRandomString(getRandomInt(20)));
}

Tests:

regex start
var x = 0; var TOTAL_STRINGS = window.TOTAL_STRINGS; var data = window.data; var regex = window.regexStart; while (x < TOTAL_STRINGS) { const str = data[x]; regex.test(str); x += 1; }
startsWith
var x = 0; var TOTAL_STRINGS = window.TOTAL_STRINGS; var data = window.data; var match = window.match; while (x < TOTAL_STRINGS) { const str = data[x]; str.startsWith(match); x += 1; }
regex end
var x = 0; var TOTAL_STRINGS = window.TOTAL_STRINGS; var data = window.data; var regex = window.regexEnd; while (x < TOTAL_STRINGS) { const str = data[x]; regex.test(str); x += 1; }
endsWith
var x = 0; var TOTAL_STRINGS = window.TOTAL_STRINGS; var data = window.data; var match = window.match; while (x < TOTAL_STRINGS) { const str = data[x]; str.endsWith(match); x += 1; }
indexOf start
var x = 0; var TOTAL_STRINGS = window.TOTAL_STRINGS; var data = window.data; var match = window.match; while (x < TOTAL_STRINGS) { const str = data[x]; str.indexOf(match) === 0; x += 1; }
indexOf end
var x = 0; var TOTAL_STRINGS = window.TOTAL_STRINGS; var data = window.data; var match = window.match; var length = window.matchLength; while (x < TOTAL_STRINGS) { const str = data[x]; str.indexOf(match) === str.length - length; x += 1; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
regex start
startsWith
regex end
endsWith
indexOf start
indexOf end

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/118.0.0.0 Safari/537.36

Browser/OS: Chrome 118 on Windows

View result in a separate tab

Test name	Executions per second
regex start	478.7 Ops/sec
startsWith	875.6 Ops/sec
regex end	438.5 Ops/sec
endsWith	857.5 Ops/sec
indexOf start	8736.6 Ops/sec
indexOf end	8714.3 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark and its options.

**Benchmark Definition**

The benchmark compares four string matching methods:

1. **Regex Start (`window.regexStart`)**: Uses a regular expression to match the start of a string.
2. **StartsWith (`str.startsWith(match)`)**: Checks if a string starts with a given substring.
3. **Regex End (`window.regexEnd`)**: Uses a regular expression to match the end of a string.
4. **IndexOf Start (`str.indexOf(match) === 0`)**: Finds the index of the first occurrence of a substring in a string, and checks if it's at the start of the string.
5. **IndexOf End (`str.indexOf(match) === str.length - length`)**: Similar to the previous one, but checks if the found index is at the end of the string.

**Options Compared**

The benchmark compares these four methods for each test case:

| Test Case | Method |
| --- | --- |
| `regex start` | Regex Start (`window.regexStart`) |
| `startsWith` | StartsWith (`str.startsWith(match)`) |
| `regex end` | Regex End (`window.regexEnd`) |
| `indexOf start` | IndexOf Start (`str.indexOf(match) === 0`) |
| `indexOf end` | IndexOf End (`str.indexOf(match) === str.length - length`)** |

**Pros and Cons**

Here's a brief summary of the pros and cons of each method:

* **Regex Start**: Fast, but can be slower for large strings due to regex compilation.
	+ Pros: Efficient use of regex engine, can match complex patterns.
	+ Cons: Slower than other methods for large strings, may require more memory.
* **StartsWith**: Simple and fast, but limited to checking the start of a string.
	+ Pros: Fast, easy to implement, suitable for simple use cases.
	+ Cons: Not suitable for finding the index of a substring in a string.
* **Regex End**: Similar to `Regex Start`, but optimized for matching the end of a string.
	+ Pros: Efficient use of regex engine, can match complex patterns.
	+ Cons: Slower than other methods for large strings, may require more memory.
* **IndexOf Start/End**: Simple and fast, with a good balance between performance and complexity.
	+ Pros: Fast, easy to implement, suitable for finding the index of a substring in a string.
	+ Cons: Not as efficient as regex-based methods for complex patterns.

**Performance**

The benchmark results show that `StartsWith` is generally the fastest method across all test cases. The `IndexOf` methods are slower than `StartsWith`, but still relatively fast. `Regex Start` and `Regex End` are slower due to the overhead of compiling regex expressions, while `StartsWith` remains the fastest option.

Keep in mind that these results may vary depending on the specific use case, string lengths, and performance characteristics of the browser or device being tested.

Related benchmarks:

JS Regex vs .startsWith vs .indexOf [Fixed] (version: 0)

fork of https://www.measurethat.net/Benchmarks/Show/975/11/regex-vs-indexof-vs-startswith-vs-substr

Comparing performance of: regex start vs startsWith vs regex end vs endsWith vs indexOf start vs indexOf end

Created: one year ago by: Guest

Jump to the latest result

regex start

startsWith

regex end

endsWith

indexOf start

indexOf end

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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