Benchmark: Vanilla vs Lodash

HTML Preparation code:

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

Tests:

Vanilla
const offerGameIds = [ { GameId: '4208' }, { GameId: '4017' }, { GameId: '4070' }, { GameId: '4035' }, { GameId: '4110' }, { GameId: '4218' }, { GameId: '4114' }, { GameId: '4193' }, { GameId: '4219' }, { GameId: '4184' }, { GameId: '4216' }, { GameId: '4142' } ]; const cmsGameIds = [4222, 4253, 4215, 4141, 4178, 4182, 4135, 4217, 4200, 4194, 4114, 4193, 4219, 4184, 4216, 4142, 4079, 4070, 4035, 4110]; const commonIds = offerGameIds.map(item => +item.GameId).filter(id => cmsGameIds.includes(id)); const remainingIds = cmsGameIds.filter(id => !commonIds.includes(id)); const finalArray = commonIds.concat(remainingIds);
Lodash
const offerGameIds = [ { GameId: '4208' }, { GameId: '4017' }, { GameId: '4070' }, { GameId: '4035' }, { GameId: '4110' }, { GameId: '4218' }, { GameId: '4114' }, { GameId: '4193' }, { GameId: '4219' }, { GameId: '4184' }, { GameId: '4216' }, { GameId: '4142' } ]; const cmsGameIds = [4222, 4253, 4215, 4141, 4178, 4182, 4135, 4217, 4200, 4194, 4114, 4193, 4219, 4184, 4216, 4142, 4079, 4070, 4035, 4110]; const infoOfferGameIds = offerGameIds.map(item => +item.GameId); const intersection = _.intersection(infoOfferGameIds, cmsGameIds); const finalArray = _.union(intersection, _.without(cmsGameIds, ...intersection));

Historical Performance Data aggregated from 15 community runs

Desktop Results:

Chrome 15 runs

Vanilla

1.2M/s

Lodash

644K/s

Fastest: Vanilla (1.9x faster)

View exact numbers

✓ Vanilla: 1,240,535 ops/sec
• Lodash: 643,867 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
Vanilla
Lodash

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/605.1.15 (KHTML, like Gecko) Version/18.4 Safari/605.1.15

Browser/OS: Safari 18 on Mac OS X 10.15.7

View result in a separate tab

Vanilla

1.3M/s

Lodash

709K/s

View exact numbers

Test name	Executions per second
✓ Vanilla	1,308,695 Ops/sec
Lodash	708,878 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 benchmark and explain what is being tested.

**Benchmark Overview**

The benchmark measures the performance difference between two approaches: Vanilla JavaScript (without any libraries) and Lodash (a popular utility library for JavaScript).

**Options Compared**

The two options being compared are:

1. **Vanilla JavaScript**: This option uses only native JavaScript features to perform the calculation.
2. **Lodash**: This option uses the Lodash library to perform the same calculation.

**Pros and Cons of Each Approach**

* **Vanilla JavaScript**:
	+ Pros: Native performance, no dependencies on external libraries.
	+ Cons: More verbose code, requires manual handling of data types (e.g., converting strings to numbers).
* **Lodash**:
	+ Pros: Concise code, built-in utility functions for common tasks.
	+ Cons: External library dependency, potential overhead due to loading the library.

**Library Used**

In this benchmark, Lodash is used to perform array operations. Specifically, the `_intersection` and `_union` functions from Lodash are used to find the intersection and union of two arrays, respectively.

**Special JavaScript Features/Syntax**

None mentioned in this specific benchmark.

**Other Considerations**

When writing benchmarks, it's essential to consider factors like:

* Input data size and distribution
* System configuration (e.g., CPU, memory, disk)
* Browser/interpreter version and platform

In this case, the input data is relatively small, and the system configuration is not explicitly mentioned.

**Alternatives**

Other approaches or libraries that could be used for similar calculations include:

* Other utility libraries like jQuery UI, Ramda, or Lodash alternatives
* Built-in array methods in JavaScript (e.g., `Array.prototype.filter`, `Array.prototype.reduce`)
* External libraries like NumJS or MathJS

Keep in mind that the choice of approach depends on the specific requirements and constraints of the project.

Vanilla vs Lodash (version: 3) Benchmark.js

Comparing performance of: `Vanilla vs Lodash`

Created: 6 years ago by: Registered User

Go to the latest result

Vanilla

Lodash

Historical Performance Data aggregated from 15 community runs

Desktop Results:

Chrome 15 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Vanilla vs Lodash (version: 3) Benchmark.js

Comparing performance of: Vanilla vs Lodash

Created: 6 years ago by: Registered User

Go to the latest result

Vanilla

Lodash

Historical Performance Data aggregated from 15 community runs

Desktop Results:

Chrome 15 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: `Vanilla vs Lodash`