Benchmark: Chunk - lodash vs javascript vs for loop vs reduce

HTML Preparation code:

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

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

Script Preparation code:

var values = new Array(200 * 200 * 4)

 
var values = new Array(200 * 200 * 4)

Tests:

lodash
var chunks = _.chunk(values, 4)
var chunks = _.chunk(values, 4)

native new

const chunk = (input, size) => {
  return input.reduce((arr, item, idx) => {
    if (idx % size === 0) {
      arr.push([item]);
    }
    else {
      arr[arr.length - 1].push(item);
    }

    return arr;
  }, []);
}

var chunks = chunk(values, 4)

​x
 
const chunk = (input, size) => {  return input.reduce((arr, item, idx) => {    if (idx % size === 0) {      arr.push([item]);    }    else {      arr[arr.length - 1].push(item);    }​    return arr;  }, []);}​var chunks = chunk(values, 4)

native old

const chunk = (input, size) => {
  return input.reduce((arr, item, idx) => {
    return idx % size === 0
      ? [...arr, [item]]
    : [...arr.slice(0, -1), [...arr.slice(-1)[0], item]];
  }, []);
}

var chunks = chunk(values, 4)

 
const chunk = (input, size) => {  return input.reduce((arr, item, idx) => {    return idx % size === 0      ? [...arr, [item]]    : [...arr.slice(0, -1), [...arr.slice(-1)[0], item]];  }, []);}​var chunks = chunk(values, 4)

native for loop

const chunk = (input, size) => {
  const arr = [];
  for (let i = 0; i < input.length; i += size) {
    arr.push(input.slice(i, i + size));
  }
  return arr;
};

var chunks = chunk(values, 4)

 
const chunk = (input, size) => {  const arr = [];  for (let i = 0; i < input.length; i += size) {    arr.push(input.slice(i, i + size));  }  return arr;};​var chunks = chunk(values, 4)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
lodash
native new
native old
native for loop

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 131 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
lodash	2241.1 Ops/sec
native new	6778.1 Ops/sec
native old	7381.5 Ops/sec
native for loop	1640.2 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 4 months ago):

Let's break down the benchmark and its test cases.

Benchmark Overview

The benchmark measures the performance of three different approaches to chunking an array: using Lodash (lodash), a custom native new function, and a custom native for loop function. The benchmark tests how fast each approach can divide an array of 200x200 elements into chunks of size 4.

Test Cases

Lodash: The test case uses the Lodash library to chunk the array. Lodash is a utility library that provides a lot of helper functions for common tasks, such as string manipulation, array manipulation, and more.
Native New: This test case defines a custom function chunk that takes an input array and a size as arguments. It uses the reduce method to create chunks of the specified size. The native new approach is likely optimized for performance, but its implementation details are not shown in the benchmark.
Native Old: This test case defines another custom function chunk that takes an input array and a size as arguments. However, this implementation uses a different logic to create chunks, which may be less efficient than the native new approach.

Options Compared

The three test cases compare different approaches to chunking an array:

Lodash: Uses Lodash's built-in chunk function, which is likely optimized for performance.
Native New: A custom implementation that uses the reduce method to create chunks. This approach may be more efficient than using a library function.
Native Old: Another custom implementation that uses a different logic to create chunks.

Pros and Cons

Here are some pros and cons of each approach:

Lodash: Pros: Easy to use, optimized for performance. Cons: Additional dependency on Lodash.
Native New: Pros: Customizable, potentially more efficient than using a library function. Cons: Requires manual implementation of chunking logic.
Native Old: Pros: Another custom implementation option. Cons: Less efficient than native new, likely less efficient than Lodash.

Other Considerations

When choosing an approach to chunking an array, consider the following factors:

Performance: How fast do you need to process the data?
Complexity: How complex is your application? If you're working with large datasets or performance-critical code, a custom implementation may be necessary.
Maintenance: How easy is it to maintain and update your code?

Alternatives

If you don't want to use Lodash or implement your own chunking logic, consider the following alternatives:

Use a different library or framework that provides an efficient chunking function, such as chunk in React.
Use a streaming or parallel processing approach to process large datasets.
Optimize your code for performance using techniques like caching, memoization, or just-in-time (JIT) compilation.

Keep in mind that the best approach depends on your specific use case and requirements.

LLMs can make mistakes. Check important info.

Let's break down the benchmark and its test cases.

**Benchmark Overview**

The benchmark measures the performance of three different approaches to chunking an array: using Lodash (`lodash`), a custom `native new` function, and a custom `native for loop` function. The benchmark tests how fast each approach can divide an array of 200x200 elements into chunks of size 4.

**Test Cases**

1. **Lodash**: The test case uses the Lodash library to chunk the array. Lodash is a utility library that provides a lot of helper functions for common tasks, such as string manipulation, array manipulation, and more.
2. **Native New**: This test case defines a custom function `chunk` that takes an input array and a size as arguments. It uses the `reduce` method to create chunks of the specified size. The `native new` approach is likely optimized for performance, but its implementation details are not shown in the benchmark.
3. **Native Old**: This test case defines another custom function `chunk` that takes an input array and a size as arguments. However, this implementation uses a different logic to create chunks, which may be less efficient than the `native new` approach.

**Options Compared**

The three test cases compare different approaches to chunking an array:

* **Lodash**: Uses Lodash's built-in `chunk` function, which is likely optimized for performance.
* **Native New**: A custom implementation that uses the `reduce` method to create chunks. This approach may be more efficient than using a library function.
* **Native Old**: Another custom implementation that uses a different logic to create chunks.

**Pros and Cons**

Here are some pros and cons of each approach:

* **Lodash**: Pros: Easy to use, optimized for performance. Cons: Additional dependency on Lodash.
* **Native New**: Pros: Customizable, potentially more efficient than using a library function. Cons: Requires manual implementation of chunking logic.
* **Native Old**: Pros: Another custom implementation option. Cons: Less efficient than `native new`, likely less efficient than Lodash.

**Other Considerations**

When choosing an approach to chunking an array, consider the following factors:

* Performance: How fast do you need to process the data?
* Complexity: How complex is your application? If you're working with large datasets or performance-critical code, a custom implementation may be necessary.
* Maintenance: How easy is it to maintain and update your code?

**Alternatives**

If you don't want to use Lodash or implement your own chunking logic, consider the following alternatives:

* Use a different library or framework that provides an efficient chunking function, such as `chunk` in React.
* Use a streaming or parallel processing approach to process large datasets.
* Optimize your code for performance using techniques like caching, memoization, or just-in-time (JIT) compilation.

Keep in mind that the best approach depends on your specific use case and requirements.

Related benchmarks:

Chunk - lodash vs javascript vs for loop vs reduce (version: 0)

Comparing performance of: lodash vs native new vs native old vs native for loop

Created: one year ago by: Guest

Jump to the latest result

lodash