Benchmark: Object.entries VS Object.keys VS Object.keys with extra array VS Object.entries without array vs for in Object

Script Preparation code:

function makeid() {
  var text = "";
  var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

  for (var i = 0; i < 5; i++)
    text += possible.charAt(Math.floor(Math.random() * possible.length));

  return text;
}

window.parentObj = {};

for (let i = 0; i < 100; i++) {
	window.parentObj[makeid()] = makeid();
}

Tests:

Object.entries
const newObj = {}; Object.entries(window.parentObj).forEach(([k, v], i) => { if ((i % 2) === 0) { newObj[k] = v; } });
Object.keys
const newObj = {}; Object.keys(window.parentObj).forEach((k, i) => { if ((i % 2) === 0) { newObj[k] = window.parentObj[k]; } });
Object.keys with extra array
const newObj = {}; Object.keys(window.parentObj).forEach((k, i) => { const [extraK, v] = [k, window.parentObj[k]] if ((i % 2) === 0) { newObj[extraK] = v; } });
Object.entries without array
const newObj = {}; Object.entries(window.parentObj).forEach((keyAndVal, i) => { if ((i % 2) === 0) { newObj[keyAndVal[0]] = keyAndVal[1]; } });
for in Object
const newObj = {}; let j = 0; for (let i in window.parentObj) { if (window.parentObj.hasOwnProperty(i)) { if ((j % 2) === 0) { newObj[i] = window.parentObj[i]; } j++; } }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.entries
Object.keys
Object.keys with extra array
Object.entries without array
for in Object

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 25 days ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36

Browser/OS: Chrome 134 on Windows

View result in a separate tab

Test name	Executions per second
Object.entries	74387.4 Ops/sec
Object.keys	218735.0 Ops/sec
Object.keys with extra array	197111.9 Ops/sec
Object.entries without array	74380.1 Ops/sec
for in Object	129004.1 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 25 days ago):

LLMs can make mistakes. Check important info.

The benchmark displayed in the provided JSON investigates the performance of several JavaScript approaches to iterate over the entries of an object (specifically `window.parentObj`). The tests compare five different strategies for constructing a new object (`newObj`) with a subset of keys and values from `parentObj`. Each approach employs a different method to access or iterate through the properties of the object.

### Approaches Compared

1. **Object.entries**:
   - **Benchmark Definition**: 
     ```javascript
     const newObj = {};
     Object.entries(window.parentObj).forEach(([k, v], i) => {
       if ((i % 2) === 0) {
         newObj[k] = v;
       }
     });
     ```
   - **Description**: Utilizes `Object.entries()`, which returns an array of the object's own enumerable string-keyed property `[key, value]` pairs. It iterates through the pairs and adds them to `newObj` based on a condition (every second entry).
   - **Performance**: Slowest in the tests.
   - **Pros**: Clear and less error-prone syntax; direct access to both key and value.
   - **Cons**: Performance overhead due to creating the array of entries.

2. **Object.keys**:
   - **Benchmark Definition**: 
     ```javascript
     const newObj = {};
     Object.keys(window.parentObj).forEach((k, i) => {
       if ((i % 2) === 0) {
         newObj[k] = window.parentObj[k];
       }
     });
     ```
   - **Description**: Uses `Object.keys()`, which returns an array of the object's own enumerable property names. The loop uses the keys to fetch values from `parentObj` and populate `newObj`.
   - **Performance**: Fastest in the tests.
   - **Pros**: Efficient and straightforward; less memory overhead than entries due to direct key handling.
   - **Cons**: Requires manual access to the value using the key.

3. **Object.keys with extra array**:
   - **Benchmark Definition**: 
     ```javascript
     const newObj = {};
     Object.keys(window.parentObj).forEach((k, i) => {
       const [extraK, v] = [k, window.parentObj[k]];
       if ((i % 2) === 0) {
         newObj[extraK] = v;
       }
     });
     ```
   - **Description**: Similar to the previous method, but introduces an extra array destructuring step to assign the key and value.
   - **Performance**: Second fastest.
   - **Pros**: Destructuring technique may improve readability.
   - **Cons**: Additional operation introduces slight overhead.

4. **Object.entries without array**:
   - **Benchmark Definition**: 
     ```javascript
     const newObj = {};
     Object.entries(window.parentObj).forEach((keyAndVal, i) => {
       if ((i % 2) === 0) {
         newObj[keyAndVal[0]] = keyAndVal[1];
       }
     });
     ```
   - **Description**: Similar to the first test but uses the entry array format without destructuring. 
   - **Performance**: Slower than `Object.keys` approaches.
   - **Pros**: Supports straightforward key and value reference.
   - **Cons**: Not as clear as destructuring; involves performance overhead.

5. **for..in**:
   - **Benchmark Definition**: 
     ```javascript
     const newObj = {};
     let j = 0;
     for (let i in window.parentObj) {
       if (window.parentObj.hasOwnProperty(i)) {
         if ((j % 2) === 0) {
           newObj[i] = window.parentObj[i];
         }
         j++;
       }
     }
     ```
   - **Description**: This method uses a traditional `for..in` loop, which iterates over all enumerable properties, along with a check for the object's own properties using `hasOwnProperty`.
   - **Performance**: Slower than the `Object.keys` methods.
   - **Pros**: May be familiar to many developers as a standard iteration pattern.
   - **Cons**: Requires additional checks to ensure properties are from the object itself, which can decrease performance; also less readable.

### Summary of Performance Results
- **Fastest**: `Object.keys` (218,735 executions per second).
- **Second Fastest**: `Object.keys with extra array` (197,112 executions per second).
- **Third**: `for..in` (129,004 executions per second).
- **Slowest**: `Object.entries` and `Object.entries without array` (both approximately 74,000 executions per second).

### Other Alternatives
In addition to the methods tested here, other strategies to iterate over objects include:
- Using `forEach` with other collection methods such as `Map` and `Set`, which can provide unique advantages depending on the context.
- Using libraries like Lodash which have optimized methods (`_.map`, `_.pick`, etc.) for iterating over objects and arrays with potentially better performance or additional utility functions.
- If performance is critical, directly accessing properties via known keys may be optimal, especially in large objects.

In conclusion, while all methods achieve the overall goal of object construction, performance varies significantly based on the structure and semantics of each approach. Developers should choose strategies based on their specific use cases, considering both performance characteristics and code clarity.

Related benchmarks:

Object.entries VS Object.keys VS Object.keys with extra array VS Object.entries without array vs for in Object (version: 1)

Comparing performance of: Object.entries vs Object.keys vs Object.keys with extra array vs Object.entries without array vs for in Object

Created: 25 days ago by: Guest

Jump to the latest result

Object.entries

Object.keys

Object.keys with extra array

Object.entries without array

for in Object

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 25 days ago):