Benchmark: charAt vs at vs slice

Script Preparation code:

var str = 'foo bar baz';
var noop = Function.prototype;

Tests:

character index
if (str[10] == 'z') noop();
charAt()
if (str.charAt(10) == 'z') noop();
slice()
if (str.slice(-1) == 'z') noop();
at()
if (str.at(-1) == 'z') noop();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
character index
charAt()
slice()
at()

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

Browser/OS: Chrome 113 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
character index	13769183.0 Ops/sec
charAt()	13605231.0 Ops/sec
slice()	13633396.0 Ops/sec
at()	13121858.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Measuring the performance of different approaches to accessing characters in a string is an interesting benchmark.

The provided JSON represents four test cases that compare the following methods:

1.  **charAt()**: This method returns the character at a specified index in the string. It's a widely supported method across most browsers.
2.  **at()**: This is a relatively new method introduced in ECMAScript 2020 (ES2020) for accessing characters in strings. It's similar to `charAt()` but offers some performance improvements due to its native implementation.
3.  **slice()**: This method returns a new string containing the specified number of characters from the beginning of the original string. Although not designed specifically for accessing individual characters, it can be used to extract a substring starting at a certain index.

**Pros and Cons:**

*   **charAt()**: Pros:

*   Widely supported across most browsers.
    *   Simple to implement.
    *
    *   Cons:

*   May incur performance overhead due to its dynamic nature and potential string concatenation inside the browser engine.
*   **at()**: Pros:

*   Native implementation, which can lead to better performance compared to `charAt()`.
    *   Supports more recent browsers that have adopted it.
*
*   **slice()**: Pros:

*   Flexible for substring extraction, not limited to accessing individual characters.
    *   Can be used with various string methods (e.g., concatenation).

Cons:

*   Inefficient for character access due to creating a new string.
*   May incur additional overhead compared to `charAt()` and `at()`.
*

The choice of method depends on the specific use case, browser support, and performance requirements.

**Library Description:**

None mentioned in the provided benchmark.

**Special JS Features or Syntax:**

The benchmark makes use of ECMAScript 2020 (ES2020) features:

*   The `at()` method is a part of ES2020.
*

**Alternative Approaches:**

Other methods to access characters in a string include:

1.  **Indexing**: Directly accessing the character at a specific index using square brackets \[index\].

```javascript
str[index];
```

2.  **Substring Extraction with indexing**: Similar to `slice()`, but manually extracts a substring starting from an index.

```javascript
let substr = str.slice(index);
substr[index];
```

3.  **String methods like `indexOf()`** and `includes()`**, which return the first occurrence of a character or string, respectively.

These alternatives might be more suitable for specific scenarios or provide different trade-offs in terms of performance, readability, and browser support.

Related benchmarks:

charAt vs at vs slice (version: 0)

Comparing performance of: character index vs charAt() vs slice() vs at()

Created: one year ago by: Guest

Jump to the latest result

character index

charAt()

slice()

at()

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