Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
rest parameters vs arguments (no extra args) actual test
(version: 1)
Comparing performance of:
arguments vs rest parameter
Created:
one year ago
by:
Guest
Go to the latest result
Script Preparation code:
window.els = []; function t1() { window.els.push(...arguments); } function t2(...args) { window.els.push(...args); }
Tests:
arguments
window.els.length = 0; for (let i = 0; i < 2000; i++) { t1('div', {class: 'foo'}, i, i + 1, i + 2); }
rest parameter
window.els.length = 0; for (let i = 0; i < 2000; i++) { t2('div', {class: 'foo'}, i, i + 1, i + 2); }
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
arguments
rest parameter
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
6 months ago
)
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:147.0) Gecko/20100101 Firefox/147.0
Browser/OS:
Firefox 147 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=624693" width="100%" height="500px"></iframe>
rest parameter
9K/s
arguments
5K/s
View exact numbers
Test name
Executions per second
✓
rest parameter
9,363 Ops/sec
arguments
5,085 Ops/sec
Autogenerated LLM Summary
(model
gpt-4o-mini
, generated one year ago):
The benchmark compares two different methods of handling function parameters in JavaScript: using the `arguments` object and using rest parameters (`...args`). Both methods are designed to handle variable numbers of arguments in a function, but they do so in different ways. ### Comparison of Options 1. **Using the `arguments` object (Function `t1`)**: - **Definition**: The `arguments` object is an array-like object available inside functions that contains the values of the arguments passed to that function. - **Test Case**: The benchmark runs a loop 2000 times, invoking the function `t1` and using `arguments` to gather the function parameters before pushing them into the `window.els` array. - **Pros**: - Available in all non-arrow functions. - Does not require any special syntax. - **Cons**: - Not an actual array; it has limited functionality and must be converted to an array before using array methods (like `slice`). - Can be less performant due to its nature as an array-like object, depending on the JavaScript engine's optimizations. 2. **Using rest parameters (Function `t2`)**: - **Definition**: Introduced in ES6, rest parameters allow you to represent an indefinite number of arguments as an actual array, making it easy to work with them. - **Test Case**: The benchmark runs the same loop 2000 times but calls the function `t2` with rest parameters, which collects the arguments in an array (`args`) before pushing. - **Pros**: - More modern and syntactically clean. - Allows direct use of real array methods without needing conversion. - Easier to read and maintain. - **Cons**: - Slightly less supported in very old browsers (though this is minimal today). ### Benchmark Results From the benchmark results: - The `rest parameters` (function `t2`) executed approximately 40,304 times per second. - The `arguments` (function `t1`) executed approximately 14,473 times per second. This shows a significant performance advantage for the rest parameters approach. The results indicate that modern JavaScript engines have optimized rest parameters better compared to the traditional `arguments` object. ### Key Considerations - **Performance**: The benchmark indicates a clear performance difference favoring rest parameters. For performance-sensitive code, especially in iterative loops or frequently called functions, rest parameters may be preferable. - **Code Readability**: Beyond performance, code readability and maintainability should consider. The syntax for rest parameters is clearer to someone unfamiliar with JavaScript function argument handling. ### Alternatives Other alternatives for handling function parameters include: - Traditional method overloading (using multiple function definitions) — but JavaScript does not support this natively. - ES6 destructuring can be used in conjunction with rest parameters for structured data and parameter handling. - Function closures or binding contexts (with `bind`) can also alter how parameters are handled but shouldn’t be confused with variadic parameter approaches. In summary, this benchmark effectively highlights the differences between legacy and modern approaches to handling variable-length arguments in JavaScript functions, revealing significant differences in performance and code quality.
Related benchmarks
Arguments vs Objects
function vs class
Function vs Eval vs Getter
rest parameters vs arguments (no extra args)
Comments
Confirm delete:
Do you really want to delete benchmark?