Benchmark: .startsWith vs .charAt vs .charCodeAt for single character

HTML Preparation code:

<div></div>

Script Preparation code:

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:

startsWith
var x = 0; var y = 0; var TOTAL_STRINGS = window.TOTAL_STRINGS; var data = window.data; var regex = window.regex; while (x < TOTAL_STRINGS) { const str = data[x]; if (str.startsWith("A")) y += x; x += 1; }
.charAt
var x = 0; var y = 0; var TOTAL_STRINGS = window.TOTAL_STRINGS; var data = window.data; var match = window.match; while (x < TOTAL_STRINGS) { const str = data[x]; if (str.charAt(0) === 'A') y += x; x += 1; }
charCodeAt
var x = 0; var y = 0; var TOTAL_STRINGS = window.TOTAL_STRINGS; var data = window.data; var match = window.match; while (x < TOTAL_STRINGS) { const str = data[x]; if (str.charCodeAt(0) === 65) y += x; x += 1; }
string[]
var x = 0; var y = 0; var TOTAL_STRINGS = window.TOTAL_STRINGS; var data = window.data; var match = window.match; while (x < TOTAL_STRINGS) { const str = data[x]; if (str[0] === 'A') y += x; x += 1; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
startsWith
.charAt
charCodeAt
string[]

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36

Browser/OS: Chrome 130 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
startsWith	2718.7 Ops/sec
.charAt	1347.6 Ops/sec
charCodeAt	1462.9 Ops/sec
string[]	1385.1 Ops/sec

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

LLMs can make mistakes. Check important info.

I'll dive into the explanation.

**Benchmark Definition JSON**

The provided benchmark definition JSON represents a JavaScript microbenchmarking test. The test aims to compare the performance of three different approaches: `startsWith`, `.charAt`, and `charCodeAt` (or `string[]`), for a single character 'A'.

**Approach 1: `startsWith`**

`startsWith` is a method that checks if a string starts with a specified value. In this test, it's used to check if the first character of each generated random string is 'A'. This approach uses the `String.prototype.startsWith()` method, which returns a boolean indicating whether the string starts with the given value.

Pros:

* Easy to understand and implement.
* Efficient for strings that start with 'A'.

Cons:

* May be slower for non-'A' starting strings due to unnecessary checks.
* May not be as efficient as other approaches for very large strings.

**Approach 2: `.charAt`**

`.charAt(0)` is a method that returns the character at the specified index (in this case, index 0) of a string. In this test, it's used to check if the first character of each generated random string is 'A'.

Pros:

* Can be faster than `startsWith` for non-'A' starting strings.
* More flexible than `charCodeAt`, as it doesn't require an ASCII code.

Cons:

* May be slower for very large strings due to indexing operations.
* Less intuitive than `startsWith`.

**Approach 3: `charCodeAt`**

`charCodeAt(0)` is a method that returns the Unicode code point at the specified index (in this case, index 0) of a string. In this test, it's used to check if the first character of each generated random string is 'A'.

Pros:

* Can be faster than `.charAt` for very large strings.
* More efficient for Unicode characters.

Cons:

* Less intuitive than `startsWith`.
* May not work correctly for non-ASCII characters.

**Approach 4: `string[]`**

This approach uses array indexing to access the first character of each string. It's essentially equivalent to `.charAt(0)` but using arrays instead of strings.

Pros:

* More flexible than `.charAt`, as it allows for any type of array.
* Can be faster than other approaches for very large arrays.

Cons:

* Less intuitive than `startsWith`.
* May not work correctly for non-numeric indices.

**Library: `window.match`**

The `window.match` property is a regular expression testing API provided by the browser. It's used in one of the test cases to match the first character 'A' against a specified value.

**Other Considerations**

* The benchmark uses a fixed-size string generator to create random strings for each test.
* The number of iterations (`TOTAL_STRINGS`) is set to 100,000, which should provide sufficient data for accurate performance measurements.
* The benchmark runs on Firefox 124, but the results are intended to be representative for other browsers as well.

**Alternatives**

If you want to compare these approaches with other methods, consider adding test cases for:

* `indexOf` or `String.prototype.indexOf()` (similar to `startsWith`, but with an offset)
* `substr` or `String.prototype.substr()` (slice the string from index 0 to a specified length)
* Regular expressions using `RegExp.test()` or `String.prototype.test()`

Related benchmarks:

.startsWith vs .charAt vs .charCodeAt for single character (version: 0)

Testing some things

Comparing performance of: startsWith vs .charAt vs charCodeAt vs string[]

Created: 2 years ago by: Guest

Jump to the latest result

startsWith

.charAt

charCodeAt

string[]

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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