Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Spread operator vs apply vs normal vs destruct - V2
(version: 0)
Compare the differing ways you can call a function with arbitrary arguments dynamically
Comparing performance of:
spread vs apply vs normal vs destruct
Created:
2 years ago
by:
Guest
Jump to the latest result
Script Preparation code:
function test(a , b , c , d , e) { return a + b + c + d + e } var using = (new Array(5)).fill(null).map((e, i) => (i)); var [a , b , c , d , e] = using
Tests:
spread
test(...using);
apply
test.apply(null, using)
normal
test(using[0] , using[1] , using[2] , using[3] , using[4])
destruct
test(a , b, c , d , e)
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (4)
Previous results
Fork
Test case name
Result
spread
apply
normal
destruct
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
2 years ago
)
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36
Browser/OS:
Chrome 123 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
spread
11364941.0 Ops/sec
apply
11115246.0 Ops/sec
normal
4394981.5 Ops/sec
destruct
4463496.0 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided benchmark and explain what's being tested. **Benchmark Purpose** The main goal of this benchmark is to compare the performance differences between four ways to call a function with arbitrary arguments dynamically: 1. Using the spread operator (`...`). 2. Using the `apply()` method. 3. Using the normal function call syntax (i.e., passing each argument separately). 4. Using destructuring assignment (`[a, b, c, d, e] = using`). **Options Compared** The benchmark compares these four options by executing a simple function `test(a, b, c, d, e)` with different argument-passing methods. * **Spread Operator**: Uses the spread operator to pass an array of arguments to the function. + Pros: concise and expressive syntax. + Cons: may incur overhead due to array creation and manipulation. * **Apply Method**: Uses the `apply()` method to pass an array of arguments to the function. + Pros: can be more efficient than spread operator, as it avoids array creation. + Cons: less readable and more complex syntax. * **Normal Function Call Syntax**: Passes each argument separately when calling the function. + Pros: easy to read and understand, no additional overhead. + Cons: may not be as concise or expressive. * **Destructuring Assignment**: Uses destructuring assignment to assign values from an array to separate variables. + Pros: can be more efficient than normal function call syntax, as it avoids unnecessary variable creation. + Cons: less readable and more complex syntax. **Library Used** The benchmark uses the `Array` class and its methods (e.g., `fill()`, `map()`) which are part of the JavaScript standard library. No additional libraries are required. **Special JS Feature or Syntax** The benchmark utilizes ES6 features such as: * The spread operator (`...`) * Destructuring assignment (`[a, b, c, d, e] = using`) * Template literals (not explicitly shown in this example) * Arrow functions (not explicitly shown in this example) **Benchmark Preparation Code** The preparation code creates an array `using` with 5 null values and maps it to an array of numbers from 0 to 4. It then passes the resulting array to the function using each of the four methods being compared. **Other Alternatives** If you wanted to test alternative approaches, you could consider: * Using other spread operator variants (e.g., `...[a, b, c]`) * Using a different method for generating random arguments (e.g., using `Math.random()`) * Adding more complex function calls or argument types to the benchmark * Comparing performance with different JavaScript engines or versions Keep in mind that the specific alternatives will depend on your goals and requirements.
Related benchmarks:
ES6 spread operator vs. Array.prototype.reduce()
Spread operator vs apply
Spread operator vs apply - 2
Spread operator vs apply vs apply undefined
Spread operator vs apply - realistic
Comments
Confirm delete:
Do you really want to delete benchmark?