Benchmark: react shallowEqual vs Ramda equals

HTML Preparation code:

<script src="https://cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.min.js"></script>

Script Preparation code:

function is(x, y) {
  return (
    (x === y && (x !== 0 || 1 / x === 1 / y)) || (x !== x && y !== y) // eslint-disable-line no-self-compare
  );
}

const hasOwnProperty = Object.prototype.hasOwnProperty;

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;
    }

    // Test for A's keys different from B.
    for (let i = 0; i < keysA.length; i++) {
        const currentKey = keysA[i];
        if (
            !hasOwnProperty.call(objB, currentKey) ||
            !is(objA[currentKey], objB[currentKey])
        ) {
            return false;
        }
    }

    return true;
}

var data = [{
    foo: {
        bar: {
            foo: {
                bar: ''
            }
        }
    }
}, {}, {}];

Tests:

Ramda equals
var result = R.equals(data, [{foo: {bar: {foo: {bar: ''}}}}, {}, {}]);
React shallowEqual
var result = shallowEqual(data, [{foo: {bar: {foo: {bar: ''}}}}, {}, {}]);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Ramda equals
React shallowEqual

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what is tested.

**Benchmark Definition**

The benchmark defines two functions: `shallowEqual` and `is`. The former function checks if two objects are shallowly equal, while the latter function checks if two values are equal using a custom logic that takes into account NaN (Not a Number) values.

**Options Compared**

In this benchmark, we have two options compared:

1. **ShallowEqual**: This is the implementation of `shallowEqual` from React. It recursively checks if two objects have the same keys and values.
2. **Ramda equals**: This is the implementation of `equals` from Ramda, a popular functional programming library for JavaScript.

**Pros and Cons**

**ShallowEqual**

Pros:

* Optimized for performance: ShallowEqual is likely optimized for performance by using a custom logic that avoids unnecessary checks.
* React-specific features: As part of React, ShallowEqual may utilize React's internal data structures and optimizations.

Cons:

* Limited functionality: ShallowEqual only checks if two objects are shallowly equal, which may not cover all possible cases (e.g., checking for cyclic references).
* Propagation of NaN values: ShallowEqual uses a custom logic to handle NaN values, which might not be immediately clear to users.

**Ramda equals**

Pros:

* Comprehensive equality check: Ramda's `equals` function checks for deep equality, including cyclic references and NaN values.
* Robust testing: Ramda's implementation is well-tested and widely used in the JavaScript community.

Cons:

* Potential performance overhead: Due to its comprehensive nature, Ramda's `equals` function might have a higher execution time compared to ShallowEqual.

**Other Considerations**

Both functions assume that the input data is an array of objects with string keys. If this assumption is not met, either function may fail or produce unexpected results.

**Library: Ramda**

Ramda is a functional programming library for JavaScript that provides various utilities for working with arrays, objects, and functions. The `equals` function is part of Ramda's `ramda.util` module, which provides a set of high-order functions for comparing values.

In this benchmark, Ramda's `equals` function is used to check if two data structures are equal.

**Special JS Feature/Syntax**

There doesn't appear to be any special JavaScript features or syntax being tested in this benchmark. Both ShallowEqual and Ramda's `equals` function operate on standard JavaScript objects and arrays.

Latest run results:

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

User agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:108.0) Gecko/20100101 Firefox/108.0

Browser/OS: Firefox 108 on Ubuntu

View result in a separate tab

Test name	Executions per second
Ramda equals	97953.2 Ops/sec
React shallowEqual	2929315.8 Ops/sec

Related benchmarks:

react shallowEqual vs Ramda equals (version: 0)

Comparing performance of: Ramda equals vs React shallowEqual

Created: 2 years ago by: Guest

Jump to the latest result

Ramda equals

React shallowEqual

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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