Benchmark: Lodash sumBy vs reduce vs for loop

HTML Preparation code:


<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Script Preparation code:

function getRandomInt(max) {
  return Math.floor(Math.random() * Math.floor(max));
}

var arr = [];
for(var i = 0; i < 100000; i++){
  arr.push({value:getRandomInt(100)});
}

Tests:

_.sumBy value
_.sumBy(arr, "value");
map and reduce
arr.reduce((prev, next) => prev + next.value, 0);
_.sumBy with map
_.sumBy(arr, x => x.value);
sum with for of loop
let result = 0; for(const x of arr) { result += x.value; }
sum with for loop
let result = 0; for(let i = 0; i < arr.length; i++) { result += arr[i].value; }

Historical Performance Data aggregated from 14 community runs

Desktop Results:

Chrome 14 runs

sum with for of loop

12K/s

sum with for loop

3K/s

map and reduce

2K/s

_.sumBy value

2K/s

_.sumBy with map

1K/s

Fastest: sum with for of loop (8.7x faster)

View exact numbers

✓ sum with for of loop: 12,195 ops/sec
• sum with for loop: 3,152 ops/sec
• map and reduce: 2,064 ops/sec
• _.sumBy value: 1,754 ops/sec
• _.sumBy with map: 1,405 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
_.sumBy value
map and reduce
_.sumBy with map
sum with for of loop
sum with for loop

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 143 on Mac OS X 10.15.7

View result in a separate tab

sum with for of loop

8K/s

sum with for loop

4K/s

_.sumBy value

2K/s

_.sumBy with map

1K/s

map and reduce

1K/s

View exact numbers

Test name	Executions per second
✓ sum with for of loop	7,607 Ops/sec
sum with for loop	3,662 Ops/sec
_.sumBy value	2,282 Ops/sec
_.sumBy with map	1,404 Ops/sec
map and reduce	1,372 Ops/sec

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

LLMs can make mistakes. Check important info.

Measuring the performance of different JavaScript methods can be quite fascinating, especially when it comes to summing values in an array.

In this benchmark, we have four test cases that compare three different approaches:

1. **Lodash `sumBy`**: A utility function provided by the popular Lodash library, which allows you to sum a property of each element in an array.
2. **Reduce with map**: This approach uses the `reduce` method along with `map` to achieve the same result as `sumBy`.
3. **For loop (using `for of`)**: A simple, imperative approach using a for loop to iterate over the array and sum up the values.

Let's dive into each option:

**Lodash `sumBy`**

Pros:

* Concise and readable code
* Easy to understand and maintain

Cons:

* Requires an additional library (Lodash) to be included in the test environment
* May have overhead due to the need to load the library

The `sumBy` function takes two arguments: the array to sum, and a callback function that extracts the value from each element. The callback function is called for each element in the array, and its return value is added together.

```javascript
_.sumBy(arr, "value");
```

**Reduce with map**

Pros:

* No additional library required
* Can be seen as a more "native" JavaScript approach

Cons:

* Code can be slightly more verbose than `sumBy`
* May require more mental effort to understand and maintain

The reduce method takes an initial value (in this case, 0), and applies a callback function to each element in the array. The callback function sums up the values as it iterates through the array.

```javascript
arr.reduce((prev, next) => prev + next.value, 0);
```

**For loop (using `for of`)**

Pros:

* Simple, intuitive code
* No additional libraries required

Cons:

* May be less readable or maintainable than other approaches
* Can be slower due to the overhead of the for loop iteration

This approach uses a for loop with the `of` keyword to iterate over the array and sum up the values.

```javascript
for (const x of arr) {
  result += x.value;
}
```

Now, let's talk about the latest benchmark results:

The top-performing test case is **"sum with for of loop"**, which executes approximately 160 executions per second. This suggests that the for loop approach is relatively fast and efficient.

In contrast, the other three approaches are slower:

* **Lodash `sumBy`**: Executes around 140-150 executions per second
* **Reduce with map**: Executes around 925-950 executions per second (slower than the for loop)
* **_.sumBy with map**: Executes around 140-150 executions per second

Other alternatives to consider:

* Using a more efficient array method, such as `Array.prototype.reduce()` without using the `map` function
* Optimizing the code further by reducing unnecessary computations or avoiding unnecessary iterations
* Considering alternative libraries or frameworks that provide optimized implementations of these methods (e.g., native WebAssembly implementations)

Keep in mind that benchmarking results can vary depending on the specific test environment, hardware, and version of JavaScript being used.

Lodash sumBy vs reduce vs for loop (version: 0)

Comparing performance of: `_.sumBy value vs map and reduce vs _.sumBy with map vs sum with for of loop vs sum with for loop`

Created: 2 years ago by: Guest

Go to the latest result

_.sumBy value

map and reduce

_.sumBy with map

sum with for of loop

sum with for loop

Historical Performance Data aggregated from 14 community runs

Desktop Results:

Chrome 14 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Lodash sumBy vs reduce vs for loop (version: 0)

Comparing performance of: _.sumBy value vs map and reduce vs _.sumBy with map vs sum with for of loop vs sum with for loop

Created: 2 years ago by: Guest

Go to the latest result

_.sumBy value

map and reduce

_.sumBy with map

sum with for of loop

sum with for loop

Historical Performance Data aggregated from 14 community runs

Desktop Results:

Chrome 14 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `_.sumBy value vs map and reduce vs _.sumBy with map vs sum with for of loop vs sum with for loop`