Benchmark: replace vs substring vs slice from beginning (+ brackets, substr, compiled vs inline regex) rulez

replace vs substring vs slice from beginning (+ brackets, substr, compiled vs inline regex) rulez (version: 0)

Test the performance of replace() vs substring() vs slice() when replacing a char at the beginning of a (in this case uri query-)string that may or may not be there. Added the combined brackets[ ] + substr() method, since it's always the first char we wan't to pop off. Inspired by https://jsperf.com/replace-or-substr. Note: could not get 'let' and 'const' to work. Well, too bad...

Comparing performance of: substring vs replace inline regex vs replace compiled regex var vs slice vs brackets and substr (legacy)

Created: 5 years ago by: Guest

Jump to the latest result

Script Preparation code:

var strIn = 'https://www.data-xata.com/all-servers.html';
var strOut = '';
var regex = /\.html$/;

Tests:

substring
strOut = strIn.substring(0,strIn.length-5)
replace inline regex
strOut = strIn.replace(/\.html$/, '');
replace compiled regex var
strOut = strIn.replace(regex, '');
slice
strOut = strIn.slice(0,-5)
brackets and substr (legacy)
strOut = strIn.substr(0,strIn.length-5)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
substring
replace inline regex
replace compiled regex var
slice
brackets and substr (legacy)

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 10 months ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:139.0) Gecko/20100101 Firefox/139.0

Browser/OS: Firefox 139 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
substring	154350160.0 Ops/sec
replace inline regex	40665680.0 Ops/sec
replace compiled regex var	37706572.0 Ops/sec
slice	137379504.0 Ops/sec
brackets and substr (legacy)	154601744.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark and explain what's being tested.

**Benchmark Overview**

The benchmark compares the performance of three methods for replacing a character at the beginning of a string:

1. `replace()` with inline regular expression
2. `replace()` with compiled regular expression variable
3. `substring()` without any modifications
4. `slice()` (in this case, `slice()` is being used to remove characters from the beginning of the string)
5. `substr()` with brackets and legacy syntax

**Options Being Compared**

Each test case compares the performance of one specific method against the others.

* The first three methods (`replace()`, `replace()`, and `substr()` with brackets) are compared directly to each other.
* The last two methods (`substring()` and `slice()`) are compared to each other, but not directly to the previous methods.

**Pros and Cons of Each Approach**

Here's a brief analysis of each approach:

1. **`replace()`**: This method is generally fast because it only needs to iterate over the string once. However, using inline regular expressions can lead to slower performance due to the overhead of parsing the regex.
2. **`replace()` with compiled regular expression variable**: This approach compiles the regex pattern beforehand and stores it in a variable. This can improve performance by avoiding the overhead of regex parsing each time `replace()` is called. However, compiling the regex may also introduce additional memory usage.
3. **`substring()```**: This method is generally slow because it creates a new string object by copying the substring. It's not optimized for this specific use case.
4. **`slice()```**: In modern JavaScript, `slice()` is an efficient way to extract a subset of characters from a string. However, in this benchmark, `slice()` is being used to remove characters from the beginning of the string, which may be slower than the other methods.
5. **`substr()` with brackets**: This approach is legacy syntax and may be less efficient than using modern JavaScript features like template literals or spread operators.

**Library Used**

There is no specific library mentioned in the benchmark definition or test cases. However, some browsers (e.g., Chrome) use their own regex engine for `replace()`, which can affect performance.

**Special JS Features/Syntax**

The benchmark uses some legacy syntax, such as `substr()` with brackets and older JavaScript features like `let` and `const`, but these are not explicitly mentioned as a focus of the benchmark.

Related benchmarks: