Benchmark: Native JS: concatenate string with + vs String.concat

Script Preparation code:

var name = "name";
var id = "id";

Tests:

using plus operator
for (let i = 0; i < 80; ++i) { let result = id + ": 1, " + name + ": someItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItem"; }
using concat function
for (let i = 0; i < 80; ++i) { let result = "".concat(id, ": 1, ", name, ": someItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItemsomeItem"); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
using plus operator
using concat function

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 years ago)

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

Browser/OS: Chrome 97 on Windows

View result in a separate tab

Test name	Executions per second
using plus operator	52274.8 Ops/sec
using concat function	44282.7 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 definition and test cases for you.

**Benchmark Definition**

The benchmark measures which approach is faster: concatenating strings using the `+` operator versus the `String.concat()` method in JavaScript.

**Options Compared**

There are two options being compared:

1. **Using the `+` operator**: This involves concatenating the strings by adding them together. For example, `id + ": 1, " + name`.
2. **Using the `String.concat()` method**: This involves calling the `concat()` function on a string object and passing another string to concatenate.

**Pros and Cons**

* Using the `+` operator:
	+ Pros: Simple and easy to understand.
	+ Cons: Can lead to unexpected results due to operator precedence, especially when dealing with nested concatenations.
* Using the `String.concat()` method:
	+ Pros: More controlled and predictable behavior.
	+ Cons: Requires explicitly calling a function and passing arguments.

**Library**

The `String` object is used in this benchmark. The `concat()` function is a part of the JavaScript standard library, allowing strings to be concatenated together.

**Special JS Feature or Syntax**

There's no special feature or syntax being tested in this benchmark. It's purely about evaluating which concatenation method is faster.

**Other Considerations**

The benchmark measures the execution speed (in executions per second) for each test case on a variety of devices and browsers, including Chrome 97 on Windows Desktop.

**Alternatives**

If you want to explore alternative approaches, here are some options:

1. **Using template literals**: Template literals provide a more concise way to concatenate strings. For example: `id : 1, ${name}someItemsomeItemsomeItemsomeItemsomeItemsomeItemsome...`
2. **Using string interpolation**: Some JavaScript engines (like V8 in Chrome) support string interpolation, which allows you to insert values into a string using `${value}`.
3. **Using a library like Lodash**: Lodash provides a `join()` function that can be used to concatenate arrays or strings.

Keep in mind that these alternatives might have different performance characteristics compared to the original benchmark.

Related benchmarks:

Native JS: concatenate string with + vs String.concat (version: 0)

find best solution for concatenate 4 strings

Comparing performance of: using plus operator vs using concat function

Created: 2 years ago by: Guest

Jump to the latest result

using plus operator

using concat function

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