Benchmark: lodash isEqual vs redux shallowEqual

HTML Preparation code:

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.20/lodash.min.js"></script>

Script Preparation code:

function equal(a, b) {
  if (a === b) return true;

  if (a && b && typeof a == 'object' && typeof b == 'object') {
    if (a.constructor !== b.constructor) return false;

    var length, i, keys;
    if (Array.isArray(a)) {
      length = a.length;
      if (length != b.length) return false;
      for (i = length; i-- !== 0;)
        if (!equal(a[i], b[i])) return false;
      return true;
    }



    if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;
    if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();
    if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();

    keys = Object.keys(a);
    length = keys.length;
    if (length !== Object.keys(b).length) return false;

    for (i = length; i-- !== 0;)
      if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;

    for (i = length; i-- !== 0;) {
      var key = keys[i];

      if (!equal(a[key], b[key])) return false;
    }

    return true;
  }

  // true if both NaN, false otherwise
  return a!==a && b!==b;
};

function is(x, y) {
  if (x === y) {
    return x !== 0 || y !== 0 || 1 / x === 1 / y
  } else {
    return x !== x && y !== y
  }
}

function shallowEqual(objA, objB) {
  if (is(objA, objB)) return true

  if (
    typeof objA !== 'object' ||
    objA === null ||
    typeof objB !== 'object' ||
    objB === null
  ) {
    return false
  }

  const keysA = Object.keys(objA)
  const keysB = Object.keys(objB)

  if (keysA.length !== keysB.length) return false

  for (let i = 0; i < keysA.length; i++) {
    if (
      !Object.prototype.hasOwnProperty.call(objB, keysA[i]) ||
      !is(objA[keysA[i]], objB[keysA[i]])
    ) {
      return false
    }
  }

  return true
}

// 1 level deep
var data = [
                    {
                        description: 'equal numbers',
                        value1: 1,
                        value2: 1,
                        equal: true,
                    },
                    {
                        description: 'not equal numbers',
                        value1: 1,
                        value2: 2,
                        equal: false,
                    },
                    {
                        description: 'number and array are not equal',
                        value1: 1,
                        value2: [],
                        equal: false,
                    },
                    {
                        description: '0 and object are not equal',
                        value1: 0,
                        value2: {},
                        equal: false,
                    },
                    {
                        description: 'equal strings',
                        value1: 'a',
                        value2: 'a',
                        equal: true,
                    },
                    {
                        description: 'big object',
                        value1: {
                            prop1: 'value1',
                            prop2: 'value2',
                            prop3: 'value3',
                            prop4: {
                                subProp1: 'sub value1',
                                subProp2: {
                                    subSubProp1: 'sub sub value1',
                                    subSubProp2: [
                                        1,
                                        2,
                                        { prop2: 1, prop: 2 },
                                        4,
                                        5,
                                    ],
                                },
                            },
                            prop5: 1000,
                            prop6: new Date(2016, 2, 10),
                        },
                        value2: {
                            prop5: 1000,
                            prop3: 'value3',
                            prop1: 'value1',
                            prop2: 'value2',
                            prop6: new Date('2016/03/10'),
                            prop4: {
                                subProp2: {
                                    subSubProp1: 'sub sub value1',
                                    subSubProp2: [
                                        1,
                                        2,
                                        { prop2: 1, prop: 2 },
                                        4,
                                        5,
                                    ],
                                },
                                subProp1: 'sub value1',
                            },
                        },
                        equal: true,
                    },
                ];

Tests:

lodash
data.forEach((item) => { _.isEqual(item.value1, item.value2); });
shallowEqual
data.forEach((item) => { shallowEqual(item.value1, item.value2); });

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
lodash
shallowEqual

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Browser/OS: Chrome 131 on Windows

View result in a separate tab

Test name	Executions per second
lodash	257826.3 Ops/sec
shallowEqual	4526633.5 Ops/sec

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

LLMs can make mistakes. Check important info.

**Benchmark Overview**

The provided JSON represents a benchmarking test between two JavaScript functions: `lodash isEqual` and `redux shallowEqual`. The test is designed to compare the performance of these two functions in equalizing two objects or arrays.

**Script Preparation Code**

The script preparation code defines two custom functions:

1. `equal(a, b)`: This function is a custom implementation of object equality checking. It recursively checks if two objects are equal by comparing their properties and values.
2. `is(x, y)`: This function is a helper function used in the `shallowEqual` function to check if two values are equal, considering NaN (Not a Number) and infinity as different.

**ShallowEqual Function**

The `shallowEqual` function is a function from the Lodash library that checks if two objects or arrays are shallowly equal. It recursively compares the properties of two objects or arrays and returns true if they have the same keys and values, but does not check for deep equality (i.e., checking if nested objects are equal).

**Individual Test Cases**

The test cases define two individual tests:

1. `lodash`: This test calls the `_isEqual` function from Lodash on each element of an array, comparing its first and second elements.
2. `shallowEqual`: This test calls the `shallowEqual` function from Lodash on each element of an array, comparing its first and second elements.

**Latest Benchmark Result**

The latest benchmark result shows the performance data for both tests:

* `lodash`: 440305.53125 executions per second (executions/sec)
* `shallowEqual`: 959156.0 executions/sec

**Comparison**

Based on the benchmark results, `shallowEqual` is significantly faster than `lodash`, indicating that Lodash's shallow equality checking is more efficient.

**Why the Performance Difference?**

There are several reasons for this performance difference:

1. **Overhead**: Lodash's implementation of `isEqual` includes additional overhead, such as error handling and edge case checks, which can slow it down.
2. **Recursion**: The `isEqual` function uses recursive function calls to compare nested objects, which can lead to increased overhead due to stack size limits.
3. **Function Call Overhead**: In JavaScript, each function call incurs a certain amount of overhead, including setting up the stack frame and executing the function body. Since `shallowEqual` is an internal Lodash function, it may be optimized for performance.

In summary, while both functions achieve their purpose, `shallowEqual` appears to be more efficient due to its implementation details and optimizations.

Related benchmarks:

lodash isEqual vs redux shallowEqual (version: 0)

Comparing performance of: lodash vs shallowEqual

Created: 3 years ago by: Guest

Jump to the latest result

lodash

shallowEqual

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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