Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
JavaScript spread operator vs Object.assign with 3 args performance
(version: 0)
Comparing performance of:
Using the spread operator vs Using Object.assign
Created:
5 years ago
by:
Guest
Jump to the latest result
Tests:
Using the spread operator
const firstObject = { sampleData: 'Hello world' } const secondObject = { moreData: 'foo bar' } const finalObject = { ...firstObject, ...secondObject };
Using Object.assign
const firstObject = { sampleData: 'Hello world' } const secondObject = { moreData: 'foo bar' } const finalObject = Object.assign({}, firstObject, secondObject);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Using the spread operator
Using Object.assign
Fastest:
N/A
Slowest:
N/A
Latest run results:
No previous run results
This benchmark does not have any results yet. Be the first one
to run it!
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down what's being tested in this JavaScript benchmark. **Benchmark Definition** The benchmark is comparing the performance of two approaches: using the JavaScript spread operator (`...`) and `Object.assign()` with three arguments. **Options Compared** Two options are compared: 1. **Using the spread operator**: The syntax `{ ...firstObject, ...secondObject }` creates a new object by spreading the properties of `firstObject` and `secondObject`. 2. **Using Object.assign() with three arguments**: `const finalObject = Object.assign({}, firstObject, secondObject);` **Pros and Cons** **Using the spread operator:** Pros: * More concise and readable syntax * Creates a new object without mutating the original objects * Can be more efficient since it only creates a single new object reference Cons: * May not work in older browsers or environments that don't support the spread operator * Can lead to unexpected behavior if the spread operator is used with functions, classes, or other complex data structures **Using Object.assign() with three arguments:** Pros: * Works in all browsers and environments that support `Object.assign()` * Can be more efficient since it only creates a single new object reference Cons: * Less concise and readable syntax * Mutates the original objects (if they are assigned back to a variable) * May lead to unexpected behavior if not used carefully **Library Used** In this benchmark, there is no explicit library being used. However, `Object.assign()` is a built-in JavaScript method. **Special JS Feature or Syntax** The spread operator (`...`) is a relatively recent feature introduced in ECMAScript 2018 (ES2018). It allows you to create new objects by spreading the properties of existing objects. This syntax is not supported in older browsers or environments that don't support ES2018. **Other Alternatives** If the spread operator is not available, other alternatives for creating a new object with merged properties include: * Using `Object.create()` and assigning properties using bracket notation (`obj = Object.create({}); obj['prop1'] = 'value';`) * Using `JSON.parse(JSON.stringify())` (though this can lead to unexpected behavior if the objects being merged have functions or other non-primitive properties) **Benchmark Preparation Code** The benchmark preparation code is not explicitly provided in the JSON, but it's likely that a simple script is executed before running the benchmark. This script might include: * Defining the `firstObject` and `secondObject` variables with sample data * Creating an empty object using `const finalObject = {};` * Using either the spread operator or `Object.assign()` to merge the properties of `firstObject` and `secondObject` into `finalObject` **Benchmark Result** The benchmark result shows two runs with different results: * Using `Object.assign()`: 1261343.125 executions per second * Using the spread operator: 740392.8125 executions per second This suggests that using `Object.assign()` is slightly faster than using the spread operator in this specific benchmark. However, it's essential to note that benchmark results can vary depending on various factors, such as browser version, platform, and other system resources.
Related benchmarks:
object assign vs object spread on growing objects
object.assign vs spread operator for shallow copying large objects 2
object spread vs Object.assign
JavaScript spread operator vs Object.assign performance - Kien Nguyen
Object.assign() vs spread operator (New object)
Comments
Confirm delete:
Do you really want to delete benchmark?