Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
literal, literal spread, reuse, Object.assign
(version: 0)
Comparing performance of:
literal spread vs reuse vs literal vs assign
Created:
one year ago
by:
Guest
Go to the latest result
Script Preparation code:
arr = []; for (let i = 0; i < 10000; i++) { arr.push({ a: Math.random(), b: Math.random(), c: Math.random() }) } total = 0;
Tests:
literal spread
const k = Math.random(); total += arr.map((obj) => { return { d: obj.a + obj.b + k, ...obj, }; }).reduce((total, obj) => { return total + obj.d / obj.c; }, 0);
reuse
const k = Math.random(); const r = { a: 0, b: 0, c: 0, d: 0, }; total += arr.map((obj) => { r.a = obj.a; r.b = obj.b; r.c = obj.c; r.d = obj.a + obj.b + k; return r; }).reduce((total, obj) => { return total + obj.d / obj.c; }, 0);
literal
const k = Math.random(); total += arr.map((obj) => { return { a: obj.a, b: obj.b, c: obj.c, d: obj.a + obj.b + k, }; }).reduce((total, obj) => { return total + obj.d / obj.c; }, 0);
assign
const k = Math.random(); total += arr.map((obj) => { return Object.assign({ d: obj.a + obj.b + k, }, obj); }).reduce((total, obj) => { return total + obj.d / obj.c; }, 0);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (4)
Previous results
Fork
Test case name
Result
literal spread
reuse
literal
assign
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year ago
)
User agent:
Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36
Browser/OS:
Chrome 126 on Linux
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=541380" width="100%" height="500px"></iframe>
reuse
8K/s
literal
3K/s
literal spread
977/s
assign
314/s
View exact numbers
Test name
Executions per second
✓
reuse
7,604 Ops/sec
literal
2,954 Ops/sec
literal spread
977 Ops/sec
assign
314 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
I'll break down the benchmark definition and test cases to explain what's being tested, compared, and their pros and cons. **Benchmark Definition JSON** The benchmark defines four different approaches to compute a value from an array of objects: 1. `literal`: Simply assign the computed values directly to the object. 2. `reuse`: Reuse a single object to store multiple computed values. 3. `literal spread`: Use the spread operator (`...`) to create a new object with the computed values, while keeping the original object intact. 4. `assign`: Use `Object.assign()` to merge the computed values into an existing object. **Test Cases** Each test case has a specific benchmark definition that tests one of the above approaches. The main difference between the test cases is how they compute the value: * `literal` and `reuse` use a single variable (`r`) to store the computed value. * `literal spread` creates a new object for each iteration using the spread operator, which preserves the original object. * `assign` uses `Object.assign()` to merge the computed values into an existing object. **Pros and Cons of Each Approach** 1. **Literal**: * Pros: Simple, efficient, and easy to read. * Cons: May lead to unexpected behavior if the order of operations changes or if the computed value is reused elsewhere in the code. 2. **Reuse**: * Pros: Reduces memory allocation and garbage collection overhead compared to `literal spread`. * Cons: May lead to performance issues due to shared variable modifications, especially when dealing with complex computations. 3. **Literal Spread**: * Pros: Preserves the original object, which can be beneficial in certain scenarios (e.g., immutable data structures). * Cons: Creates a new object for each iteration, which can be slower and more memory-intensive than `reuse`. 4. **Assign**: * Pros: More explicit and readable than `literal`, with better performance due to optimized merge operations. * Cons: May lead to unexpected behavior if the order of operations changes or if the computed value is reused elsewhere in the code. **Libraries and Special JS Features** The test cases use the following libraries and features: * `Math.random()`: a built-in JavaScript function for generating random numbers. * `Array.prototype.map()` and `Array.prototype.reduce()`: built-in JavaScript methods for iterating over arrays. * `Object.assign()`: a built-in JavaScript method for merging objects. **Other Alternatives** Other alternatives to consider when optimizing performance-critical code include: * Using `const` or `let` with caution, as reassignments can lead to unexpected behavior and performance issues. * Avoiding excessive use of `Array.prototype.map()` and instead using native WebAssembly or optimized libraries for computations. * Considering the use of Just-In-Time (JIT) compilation or other optimization techniques specific to the target platform. Keep in mind that these alternatives are highly dependent on the specific use case, platform, and performance requirements.
Related benchmarks
JavaScript spread operator vs Object.assign vs for-in loop performance
JavaScript spread operator vs Object.assign vs for-in loop safe performance
JavaScript spread operator vs Object.assign vs null-checked for-in loop performance
JavaScript spread operator vs Object.assign vs only-null-checked for-in loop performance
Comments
Confirm delete:
Do you really want to delete benchmark?