Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Destructuring test
(version: 0)
Comparing performance of:
A vs B vs C
Created:
6 years ago
by:
Guest
Jump to the latest result
Script Preparation code:
var a = {bla: 1, heyo: 2, afdsda: 3, innerRef: 4, ad: 5}; var b = {hasFocusPriority: 1, heyo: 2, afdsda: 3, innerRef: 4, ad: 5}; var c = {hasFocusPriority: 1, ref: 2, onFocus: 3, innerRef: 4, onNativeBlur: 5}; function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; } function _altGenerated(target, source, excluded) { for (var key in source) { if (!excluded(key)) target[key] = source[key]; } return target; } function destructure(props) { return Object.assign( {ref: 1, onFocus: 2, onBlur: 3}, _objectWithoutPropertiesLoose(props, [ 'innerRef', 'hasFocusPriority', 'ref', 'onFocus', 'onBlur', 'onNativeFocus', 'onNativeBlur', ]) ); } function destructureAlt(props) { return _altGenerated( {ref: 1, onFocus: 2, onBlur: 3}, props, key => key === 'innerRef' || key === 'hasFocusPriority' || key === 'ref' || key === 'onFocus' || key === 'onBlur' || key === 'onNativeFocus' || key === 'onNativeBlur' ); } function manual(props) { var childProps = { ref: 1, onFocus: 2, onBlur: 3, }; for (let key in props) { switch (key) { case 'innerRef': case 'hasFocusPriority': case 'ref': // I do not know if this one could happen case 'onFocus': case 'onBlur': case 'onNativeFocus': case 'onNativeBlur': break; default: childProps[key] = props[key]; } } return childProps; } function manual2(props) { var childProps = { ref: 1, onFocus: 2, onBlur: 3, }; let keys = Object.keys(props); for (let i = 0; i < keys.length; i++) { let key = keys[i]; switch (key) { case 'innerRef': case 'hasFocusPriority': case 'ref': // I do not know if this one could happen case 'onFocus': case 'onBlur': case 'onNativeFocus': case 'onNativeBlur': break; default: childProps[key] = props[key]; } } return childProps; }
Tests:
A
destructureAlt(a); destructureAlt(b); destructureAlt(c);
B
manual(a); manual(b); manual(c);
C
manual2(a); manual2(b); manual2(c);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
A
B
C
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):
Measuring the performance of JavaScript destructuring methods is an interesting task, and I'm happy to break it down for you. **What is being tested?** The benchmark measures the execution time of three different approaches to destructure objects in JavaScript: 1. `destructureAlt(props)`: This function uses a library called `_altGenerated` (not a standard library) to generate a new object with only the desired properties. 2. `manual(props)`: This function iterates through the input object's properties and adds them to a new object, excluding certain properties. 3. `manual2(props)`: Similar to `manual`, but uses `Object.keys` to get an array of property names. **Options compared:** The benchmark compares the execution time of these three approaches for different input objects (`a`, `b`, and `c`). The goal is to determine which approach is the fastest, most efficient, or most reliable. **Pros and Cons of each approach:** 1. **`destructureAlt(props)`**: * Pros: Using a library can reduce the implementation complexity and make it easier to maintain. * Cons: It requires an additional dependency (the `_altGenerated` library) and might not be compatible with older browsers or environments. 2. **`manual(props)`**: * Pros: It's a straightforward, simple approach that doesn't require any external libraries. * Cons: The implementation can become complex and error-prone if the number of properties to exclude increases. 3. **`manual2(props)`**: * Pros: Similar to `manual`, but uses `Object.keys` which is more concise and efficient for iterating through object properties. * Cons: It's still a simple, iterative approach that might not be as efficient or scalable as `destructureAlt`. **Library usage:** The `_altGenerated` library is used in the `destructureAlt` function. This library is not a standard JavaScript library; it seems to be a custom implementation designed for this specific use case. **Special JS feature/syntax:** There are no special features or syntaxes being tested here. The benchmark focuses on comparing different approaches to destructure objects, which is a fundamental aspect of JavaScript programming. **Other alternatives:** To provide an alternative perspective, other approaches to destructuring objects in JavaScript could include: * Using `Object.assign` and slicing the input object's properties * Utilizing spread operators (`...`) or rest parameters (`...props`) * Implementing a custom destructure function using recursion or iteration However, these alternatives might not be as efficient or scalable as the approaches being compared in this benchmark. In conclusion, the benchmark provides valuable insights into the performance of different destructure methods in JavaScript. While `destructureAlt` uses an external library for simplicity, `manual2` is a concise and efficient alternative using `Object.keys`. The choice of approach ultimately depends on the specific requirements and constraints of your project.
Related benchmarks:
Destructuring test!
Destructuring test 2
withoutObjectKeys again
withoutObjectKeys again and again
Comments
Confirm delete:
Do you really want to delete benchmark?