function test() { console.log(arguments[arguments.length - 1]); }
var using = (new Array(5000)).fill(null).map((e, i) => ( {
"_id": "6756f95de1bf2a3657bf2262",
"index": 0,
"guid": "bdc23f10-a1ac-47ad-a423-1c498f5d7857",
"isActive": true,
"balance": "$2,288.04",
"picture": "http://placehold.it/32x32",
"age": i,
"eyeColor": "brown",
"name": "Reid Holden",
"gender": "male",
"company": "KAGGLE",
"email": "reidholden@kaggle.com",
"phone": "+1 (844) 427-3173",
"address": "923 Dewitt Avenue, Macdona, Florida, 2333",
"about": "Eu quis amet ipsum id occaecat reprehenderit cillum cupidatat ullamco ad duis. Lorem tempor incididunt culpa dolor labore et officia nulla aliqua et incididunt amet dolor reprehenderit. Ut voluptate est elit quis fugiat ex magna irure eiusmod esse duis sint qui. Exercitation duis duis ullamco est eiusmod sunt eiusmod velit laboris ex elit.\r\n",
"registered": "2017-07-12T07:52:14 -02:00",
"latitude": 49.456753,
"longitude": -37.824429,
"tags": [
"est",
"laborum",
"laborum",
"incididunt",
"adipisicing",
"anim",
"sit"
],
"friends": [
{
"id": 0,
"name": "Gutierrez Collins"
},
{
"id": 1,
"name": "Lisa Richardson"
},
{
"id": 2,
"name": "Wilson Kane"
}
],
"greeting": "Hello, Reid Holden! You have 4 unread messages.",
"favoriteFruit": "strawberry"
}));
test(using);
test.apply(test, using)
--enable-precise-memory-info
flag.
Test case name | Result |
---|---|
spread | |
apply |
Test name | Executions per second |
---|---|
spread | 80541.6 Ops/sec |
apply | 77283.1 Ops/sec |
The benchmark in question is designed to compare the performance of two different JavaScript methods for invoking a function with a variable number of arguments: the spread operator and the apply
method. Let's delve into the specifics.
Benchmark Definition:
test(...using);
- This represents the spread operator, which takes an iterable (in this case, the using
array of JSON objects) and expands it into individual arguments for the test
function.test.apply(test, using)
- This uses the apply
method of a function, where you invoke test
with a specific this
context (which can be set to test
itself, in this case) and an array of arguments, which are provided via the using
array.Data Used:
_id
, index
, guid
, balance
, etc. The main purpose here is to ensure that enough data is supplied to effectively test the performance of the function call method.Spread Operator:
Apply Method:
From the results, the spread operator outperforms the apply method in terms of executions per second.
Pros:
Cons:
Pros:
this
context explicitly; helpful in certain scenarios where context matters.Cons:
Browser Support: The spread operator is well-supported in modern browsers, making it a go-to choice when dealing with function arguments in ES6 and newer code. However, older environments that do not support ES6 will necessitate the use of methods like apply
.
Use Cases: In practice, choosing between these two methods may depend on your codebase, developer familiarity, and concerns over performance or readability. When handling a fixed number of arguments or dealing with legacy code, apply
might still be relevant.
Arguments Object: JavaScript functions can access the arguments
object – an array-like object that holds all provided arguments. This allows for a flexible function signature but lacks the benefit of modern syntax and array methods.
Rest Parameters: A modern equivalent to handling variable arguments, this syntax (function test(...args)
) is considered to be a friendlier and more powerful alternative in contexts where you need to handle multiple parameters.
In summary, the benchmark effectively tests the performance differences between these two methods of function invocation, showcasing the efficiency of the spread operator in modern JS programming, while also providing insights into the pros and cons of each approach for different use cases.