Benchmark: native slice vs native reduce vs lodash chunk

HTML Preparation code:

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

Script Preparation code:

var test = Array.from({
    length: 100000
}, () => Math.random())

Tests:

native slice
const chunkSize = 80; const chunks = []; for (let i = 0; i <= test.length; i += chunkSize) { chunks.push(test.slice(i, i + chunkSize)); }
native reduce
const chunkSize = 80; test.reduce((accu, element, idx) => { if (idx % chunkSize === 0) { accu.push([]); } const chunk = accu[accu.length - 1]; chunk.push(element); return accu; }, []);
lodash chunk
_.chunk(test,80)

Historical Performance Data aggregated from 7 community runs

Desktop Results:

Chrome 7 runs

native slice

8K/s

lodash chunk

5K/s

native reduce

815/s

Fastest: native slice (9.9x faster)

View exact numbers

✓ native slice: 8,068 ops/sec
• lodash chunk: 5,452 ops/sec
• native reduce: 815 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
native slice
native reduce
lodash chunk

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

Browser/OS: Chrome 138 on Mac OS X 10.15.7

View result in a separate tab

native slice

32K/s

lodash chunk

8K/s

native reduce

1K/s

View exact numbers

Test name	Executions per second
✓ native slice	32,156 Ops/sec
lodash chunk	7,692 Ops/sec
native reduce	1,200 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 provided benchmark and explain what's being tested.

**Benchmark Definition**

The benchmark is comparing three approaches to chunking an array:

1. **Native Slice**: Using the `slice()` method to extract chunks from the original array.
2. **Native Reduce**: Using the `reduce()` method with a custom callback function to create chunks.
3. **Lodash Chunk**: Using the `chunk()` method from the Lodash library to create chunks.

**Options Compared**

The three approaches are compared in terms of their performance, specifically:

* The number of executions per second
* The number of iterations required to complete each test case

**Pros and Cons**

Here's a brief overview of the pros and cons of each approach:

1. **Native Slice**:
	* Pros: Fast, lightweight, and doesn't require any additional library.
	* Cons: May not be as efficient for large arrays or complex chunking scenarios.
2. **Native Reduce**:
	* Pros: Can handle complex chunking scenarios and is often more efficient than native slice.
	* Cons: Requires a custom callback function, which can add overhead.
3. **Lodash Chunk**:
	* Pros: Easy to use, efficient, and provides a flexible way to chunk arrays.
	* Cons: Requires including the Lodash library, which adds extra size.

**Library Used**

In this benchmark, the `lodash` library is used for its `chunk()` method. Lodash is a popular utility library that provides various functions for tasks like array manipulation, string processing, and more.

**Special JS Feature/Syntax**

There are no special JavaScript features or syntaxes being tested in this benchmark. However, it's worth noting that the use of `reduce()` as a chunking approach might be considered an advanced JavaScript concept.

**Other Alternatives**

If you're looking for alternative approaches to chunking arrays, here are some options:

* **Array.prototype.slice()**: Similar to native slice, but may not be as efficient.
* **Array.prototype.reduce()**: Similar to native reduce, but requires a custom callback function.
* **Underscore.js**: Another popular utility library that provides a `chunk()` method similar to Lodash.
* **Native implementation**: Depending on the specific use case, you might be able to implement chunking using only native JavaScript methods, such as looping and array manipulation.

native slice vs native reduce vs lodash chunk (version: 0)

native slice vs lodash chunk

Comparing performance of: `native slice vs native reduce vs lodash chunk`

Created: 3 years ago by: Guest

Go to the latest result

native slice

native reduce

lodash chunk

Historical Performance Data aggregated from 7 community runs

Desktop Results:

Chrome 7 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

native slice vs native reduce vs lodash chunk (version: 0)

native slice vs lodash chunk

Comparing performance of: native slice vs native reduce vs lodash chunk

Created: 3 years ago by: Guest

Go to the latest result

native slice

native reduce

lodash chunk

Historical Performance Data aggregated from 7 community runs

Desktop Results:

Chrome 7 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: `native slice vs native reduce vs lodash chunk`