Benchmark: JS Native vs Loadash

HTML Preparation code:

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

Tests:

Lodash
function removeNullUndefined(obj) { if (_.isArray(obj)) { return obj.map(element => (_.isObject(element) ? removeNullUndefined(element) : element)).filter(el => el !== null && el !== undefined); } else if (_.isObject(obj)) { return _(obj) .omitBy(_.isNil) .mapValues(removeNullUndefined) .value(); } return obj; } const obj = { a: 1, b: null, c: { d: 2, e: undefined, f: { g: null, h: 3 } }, i: [4, null, { j: undefined, k: 5 }] }; const cleanedObj = removeNullUndefined(obj); console.log(cleanedObj);
JS Native
function removeNullUndefined(obj) { if (typeof obj !== 'object' || obj === null) { return obj; } if (Array.isArray(obj)) { return obj.map(removeNullUndefined); } return Object.keys(obj).reduce((acc, key) => { const value = obj[key]; if (value !== null && value !== undefined) { if (typeof value === 'object') { acc[key] = removeNullUndefined(value); } else { acc[key] = value; } } return acc; }, {}); } const obj = { a: 1, b: null, c: { d: 2, e: undefined, f: { g: null, h: 3 } }, i: [4, null, { j: undefined, k: 5 }] }; const cleanedObj = removeNullUndefined(obj); console.log(cleanedObj);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash
JS Native

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 122 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Lodash	126680.2 Ops/sec
JS Native	210384.5 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the benchmark analysis.

The provided JSON represents two test cases for measuring the performance of JavaScript code. The tests are designed to compare the execution speed of two approaches:

1. **JS Native**: This approach involves writing native JavaScript code to filter out null and undefined values from an object.
2. **Lodash**: This approach uses the popular JavaScript utility library, Lodash, to perform the same operation.

**What is being tested?**

In both test cases, a sample object `obj` is created with various types of values (numbers, strings, booleans, arrays, and objects). The objective is to filter out null and undefined values from this object using two different approaches.

**Options compared:**

The primary difference between the two approaches lies in how they handle nested objects and arrays. Lodash provides a more comprehensive solution by leveraging its own data manipulation functions, whereas the native JavaScript approach requires manual iteration and recursion.

**Pros and Cons of each approach:**

**Lodash Approach:**

Pros:

* More concise and readable code
* Leverages optimized, pre-built functions for data manipulation
* Less error-prone due to built-in checks and handling

Cons:

* Additional overhead due to external library dependencies
* May incur slower execution times compared to native JavaScript solutions

**Native JavaScript Approach:**

Pros:

* Potential for better performance due to reduced overhead from external libraries
* Can be more optimized for specific use cases

Cons:

* More verbose and error-prone code due to manual iteration and recursion
* May require additional debugging effort

**Library Used (Lodash):**

Lodash is a popular JavaScript utility library that provides a set of high-quality, reusable functions for data manipulation, string processing, and more. In this test case, Lodash is used to simplify the data filtering process using its `omitBy` function.

**Special JS Feature/ Syntax:**

None mentioned in this specific benchmark definition.

**Benchmark Result Interpretation:**

The latest benchmark results show that Chrome 122 on a Mac OS X 10.15.7 device achieved:

* JS Native: approximately 210,384 executions per second
* Lodash: approximately 126,680 executions per second

This indicates that the native JavaScript approach outperforms the Lodash-based solution in this specific test case. However, it's essential to note that performance differences can vary depending on the actual use case, system configuration, and other factors.

**Alternative Approaches:**

Other alternatives for data filtering might include:

* Using a library like Ramda or Underscore.js
* Implementing manual iteration using `for` loops and recursion
* Leveraging modern JavaScript features like `Array.prototype.filter()` and `Object.keys()`
* Exploring alternative libraries or frameworks that offer optimized data manipulation functions

Related benchmarks:

JS Native vs Loadash (version: 0)

Comparing performance of: Lodash vs JS Native

Created: 2 years ago by: Registered User

Jump to the latest result

Lodash

JS Native

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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