Benchmark: Deep merge - MeasureThat.net

HTML Preparation code:


<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/seamless-immutable/7.1.3/seamless-immutable.production.min.js'></script>

Script Preparation code:

var state = {
    flag: false,
    text: 'Default state',
    nested1: {
      flag: false,
      value: 1,
      text: 'Nested1',
      deep1: {
        flag: false,
        value: 1,
        text: 'Deep1',
      },
      deep2: {
        flag: false,
        value: 1,
        text: 'Deep2',
        deeper: {
          text: 'Very deep',
          value: 1
        }
      },
    },
    nested2: {
      flag: false,
      value: 2,
      text: 'Nested2',
	  deep1: {
        flag: false,
        value: 1,
        text: 'Deep1',
      },
      deep2: {
        flag: false,
        value: 1,
        text: 'Deep2',
        deeper: {
          text: 'Very deep',
          value: 1
        }
      },      
    },
  	nested3: {
      flag: false,
      value: 3,
      text: 'Nested3',
	  deep1: {
        flag: false,
        value: 1,
        text: 'Deep1',
      },
      deep2: {
        flag: false,
        value: 1,
        text: 'Deep2',
        deeper: {
          text: 'Very deep',
          value: 1,
          flag: false
        }
      },
    },
};

var patch = {
  flag: true,
  nested1: {
    flag: true
  },
  nested2: {
    deep1: {
      flag: true
    }
  },
  nested3: {
    deep2: {
      deeper: {
        flag: true
      }
    }
  }
}

function reassign(obj, src) {
    return _.isObjectLike(obj) ? _.assignWith(_.clone(obj), src, reassign) : _.cloneDeep(src);
}

var immutableState = Immutable(state);

function spreadMerge(state, patch) {
  return {
    ...state,
    flag: true,
    nested1: {
      ...state.nested1,
      flag: true
    },
    nested2: {
      ...state.nested2,
      deep1: {
        ...state.nested2.deep1,
        flag: true
      }
    },
    nested3: {
      ...state.nested3,
      deep2: {
        ...state.nested3.deep2,
        deeper: {
          ...state.nested3.deep2.deeper,
          flag: true
        }
      }
    }

  }
}

Tests:

Lodash simple merge
_.merge({}, state, patch)
Lodash smart merge
reassign(state, patch)
seamless-immutable merge
Immutable.merge(immutableState, patch, {deep: true})
Spread merge
spreadMerge(state, patch)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash simple merge
Lodash smart merge
seamless-immutable merge
Spread merge

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down what's being tested in this benchmark.

**Benchmark Overview**

The testbench measures the performance of three different approaches to merge two objects: `lodash` (with `merge` and `assignWith` functions), `seamless-immutable` (using `Immutable.merge` function), and a custom implementation called "Spread merge".

**What are we testing?**

We're comparing the execution time of each approach when merging two objects. Specifically, we have:

1. Two source objects: `state` and `patch`.
2. A target object that will receive the merged result.

The goal is to determine which approach performs better in terms of speed.

**Options Compared**

Here are the options being compared:

1. **Lodash simple merge**: Using `_.merge({}, state, patch)` to merge the objects.
	* Pros: Simple and easy to understand. Lodash is a well-known and widely used library.
	* Cons: May have performance overhead due to its complexity.
2. **Lodash smart merge**: Using `reassign(state, patch)`, which is a more optimized version of the `merge` function provided by Lodash.
	* Pros: Optimized for performance, using `_.cloneDeep` and `_.assignWith` functions to reduce unnecessary work.
	* Cons: May be harder to understand due to its internal workings.
3. **Seamless-immutable merge**: Using `Immutable.merge(immutableState, patch, {deep: true})`.
	* Pros: Optimized for immutability, which can lead to better performance and scalability in certain scenarios.
	* Cons: Requires using the Seamless Immutable library, which may have a higher overhead due to its additional dependencies.

**Custom Implementation (Spread merge)**

The custom implementation uses a spread operator (`...`) to merge the objects:
```javascript
function spreadMerge(state, patch) {
  return {...state, ...patch};
}
```
This approach is simpler and easier to understand but may not be as efficient as the other two options.

**Benchmark Results**

The latest benchmark results show that:

1. **Spread merge**: Performs relatively well with an execution time of approximately 67152.15625 executions per second.
2. **Seamless-immutable merge**: Has a slightly lower performance with around 138308.546875 executions per second.
3. **Lodash smart merge**: Outperforms both previous options, with around 206024.6875 executions per second.
4. **Lodash simple merge**: Has the lowest performance among all four options.

Based on these results, it appears that the Lodash smart merge approach performs best in terms of speed, followed closely by the Seamless Immutable merge approach.

Latest run results:

Run details: (Test run date: 6 days ago)

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

Browser/OS: Chrome 130 on Windows

View result in a separate tab

Test name	Executions per second
Lodash simple merge	80839.6 Ops/sec
Lodash smart merge	200641.6 Ops/sec
seamless-immutable merge	40469.6 Ops/sec
Spread merge	2570569.8 Ops/sec

Related benchmarks:

Deep merge (version: 0)

Spread vs lodash vs seamless-immutable

Comparing performance of: Lodash simple merge vs Lodash smart merge vs seamless-immutable merge vs Spread merge

Created: 6 years ago by: Guest

Jump to the latest result

Lodash simple merge

Lodash smart merge

seamless-immutable merge

Spread merge

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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