Benchmark: Lodash vs ES6: core functions

HTML Preparation code:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.core.js"></script>

Script Preparation code:

// Imports
_.noConflict();

// Define functions to create data
const generateRandomStr = function(len){
 	return [...Array(len)].map(i=>(~~(Math.random()*36)).toString(36)).join('');
}

// Define ES6 Equivalents
var groupBy = function(xs, key) {
  return xs.reduce(function(rv, x) {
    (rv[x[key]] = rv[x[key]] || []).push(x);
    return rv;
  }, {});
};

// Create dataset to be operated on
const DATASET_LENGTH = 1000000;
var dataset = [...Array(DATASET_LENGTH)].map(_=>Math.ceil(Math.random()*40));

dataset = dataset.map(v => {
	return generateRandomStr(v);
});

Tests:

Lodash GroupBy
_.groupBy(dataset, 'length')
ES6 GroupBy
groupBy(dataset, 'length')

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash GroupBy
ES6 GroupBy

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 8 days 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 GroupBy	85.8 Ops/sec
ES6 GroupBy	64.6 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark.

**Benchmark Definition**

The benchmark compares two approaches: using Lodash (a popular JavaScript utility library) and implementing the same functionality in pure ES6 (ECMAScript 6). The specific functions being compared are `groupBy`. This test aims to measure performance differences between these two approaches, specifically for data processing tasks like grouping.

**Options Compared**

1. **Lodash (`_.groupBy(dataset, 'length')`)**: Lodash provides a pre-built function for groupBy, which wraps the implementation in a reusable and efficient way.
2. **Pure ES6 (`groupBy(dataset, 'length')`)**: This is the plain JavaScript implementation of the groupBy function.

**Pros and Cons**

* **Lodash (_.groupBy(dataset, 'length'))**:
	+ Pros:
		- Reusable utility functions simplify code and reduce boilerplate.
		- Efficient implementation with built-in optimizations.
	+ Cons:
		- Dependency on an external library, which may not be suitable for all projects or environments.
		- Potential performance overhead due to the need to import and initialize the Lodash library.
* **Pure ES6 (groupBy(dataset, 'length'))**:
	+ Pros:
		- No dependencies or external libraries, making it easier to run in isolated environments.
		- No potential performance overhead from importing a library.
	+ Cons:
		- Requires manual implementation and optimization of the groupBy function.
		- May lead to more verbose code with less reuse.

**Library: Lodash**

Lodash is a popular JavaScript utility library providing a wide range of functions for common tasks, such as data manipulation, string utilities, and functional programming. It's widely adopted in industry and open-source projects due to its flexibility and performance benefits.

In the benchmark, Lodash's `_.groupBy` function is used to group an array by a specific key, in this case, the 'length' property of each element.

**Special JS Feature/Syntax**

There isn't any special JavaScript feature or syntax being explicitly tested or compared between the two approaches. However, it's worth noting that Lodash uses various ES6 features like arrow functions and template literals to implement its functions.

**Other Alternatives**

For implementing a groupBy function without using a library like Lodash, you can use alternative approaches like:

1. **Using `Array.prototype.reduce()`**: This method can be used to accumulate values in an array while iterating over the input data.
2. **Using `Array.prototype.forEach()` and object iteration**: Combining `forEach` with object iteration (e.g., using `for...in`) can create a basic groupBy implementation.

Keep in mind that these alternatives might not provide the same level of performance or elegance as the Lodash implementation.

Related benchmarks:

Lodash vs ES6: core functions (version: 0)

Common Lodash functions compared to their ES6 equivalent code.

Comparing performance of: Lodash GroupBy vs ES6 GroupBy

Created: 3 years ago by: Registered User

Jump to the latest result

Lodash GroupBy

ES6 GroupBy

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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