Benchmark: lodash.each vs Object.forEach vs jQuery each vs layui each

HTML Preparation code:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/layui/2.6.8/layui.min.js"></script>

Script Preparation code:


// Populate the base array
var arr = [];
for (var i = 0; i < 1000; i++) {
  arr[i] = i;
}

function fn(a) {
  return a * 2 * 5;
}

Tests:

lodash.each
_.forEach(arr,fn)
native
arr.forEach(fn)
for loop
for(i=0;i<arr.length;i++) fn(arr[i]);
jQuery each
$.each(arr,fn);
layui each
layui.each(arr,function(i,e){fn(e)})

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
lodash.each
native
for loop
jQuery each
layui each

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; rv:124.0) Gecko/20100101 Firefox/124.0

Browser/OS: Firefox 124 on Windows

View result in a separate tab

jQuery each

296K/s

lodash.each

236K/s

native

158K/s

layui each

61K/s

for loop

25K/s

View exact numbers

Test name	Executions per second
✓ jQuery each	296,077 Ops/sec
lodash.each	235,880 Ops/sec
native	157,620 Ops/sec
layui each	60,721 Ops/sec
for loop	24,915 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 benchmarking test.

**Benchmark Overview**

The test compares the performance of four different methods to iterate over an array: `lodash.each`, `Object.forEach`, `jQuery each`, and `layui each`. Each method is compared to three other methods: native JavaScript `forEach` loop, native JavaScript for loop with a function callback, and `lodash.each`.

**Options Compared**

The test compares the following options:

1. **Native JavaScript**: Uses the built-in `forEach` method provided by JavaScript engines.
2. **Lodash `.forEach`**: Uses the `forEach` method from the Lodash library.
3. **jQuery `.each`**: Uses the `each` method from the jQuery library.
4. **Layui `.each`**: Uses the `each` method from the Layui framework.

**Pros and Cons of Each Approach**

1. **Native JavaScript`**
	* Pros:
		+ Fastest execution time due to native implementation.
		+ Most efficient use of resources.
	* Cons:
		+ Limited flexibility compared to other methods.
2. **Lodash `.forEach`**
	* Pros:
		+ Easy to use and integrate into existing codebases.
		+ Provides additional utility functions and features.
	* Cons:
		+ Requires an external library (Lodash).
3. **jQuery `.each`**
	* Pros:
		+ Wide adoption and support in web development projects.
		+ Convenient for iterating over elements in jQuery-based applications.
	* Cons:
		+ Requires an additional library (jQuery).
4. **Layui `.each`**
	* Pros:
		+ Provides a convenient and easy-to-use API.
		+ Offers some additional features and utility functions.
	* Cons:
		+ Less widely adopted than jQuery or Lodash.

**Library Descriptions**

1. **Lodash**: A popular JavaScript library providing a wide range of utility functions, including `forEach`.
2. **jQuery**: A widely used JavaScript library for DOM manipulation, event handling, and AJAX requests. Its `each` method is commonly used for iterating over elements.
3. **Layui**: A lightweight JavaScript framework offering various widgets, layouts, and utilities. Its `.each` method provides a convenient way to iterate over arrays.

**Special JS Features or Syntax**

None mentioned in this benchmark test.

**Alternatives**

For iterative array processing, developers can consider using other libraries or frameworks, such as:

1. **Ramda**: A functional programming library providing `forEach` and other utility functions.
2. **Underscore.js**: Another popular JavaScript library offering various utility functions, including `forEach`.
3. **Array.prototype.forEach.call()`: This method allows iterating over an array using a callback function, similar to native JavaScript's for loop.

Keep in mind that the choice of iteration method ultimately depends on the specific requirements and constraints of your project, such as performance, code readability, and maintainability.

lodash.each vs Object.forEach vs jQuery each vs layui each (version: 2) Benchmark.js

Comparing performance of: `lodash.each vs native vs for loop vs jQuery each vs layui each`

Created: 4 years ago by: Registered User

Go to the latest result

lodash.each

native

for loop

jQuery each

layui each

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

lodash.each vs Object.forEach vs jQuery each vs layui each (version: 2) Benchmark.js

Comparing performance of: lodash.each vs native vs for loop vs jQuery each vs layui each

Created: 4 years ago by: Registered User

Go to the latest result

lodash.each

native

for loop

jQuery each

layui each

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: `lodash.each vs native vs for loop vs jQuery each vs layui each`