Benchmark: Object.entries VS Object.keys VS Object.keys with extra array VS Object.entries without array SG

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 = new Map(); const po = window.parentObj; let i = 0; for (const [k,v] of Object.entries(po)) { if (!(1 & i++)) newObj.set(k,v); }
Object.keys
const newObj = new Map(); const po = window.parentObj; let i = 0; for (const k of Object.keys(po)) { if (!(1 & i++)) newObj.set(k, po[k]); }
for in object.hasown
const newObj = new Map(); const po = window.parentObj; let i = 0; for (const k in po) { if (!(1 & i++) && Object.hasOwn(po, k)) newObj.set(k, po[k]); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.entries
Object.keys
for in object.hasown

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; rv:108.0) Gecko/20100101 Firefox/108.0

Browser/OS: Firefox 108 on Windows

View result in a separate tab

Test name	Executions per second
Object.entries	90294.4 Ops/sec
Object.keys	139391.3 Ops/sec
for in object.hasown	157912.2 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 6 months ago):

LLMs can make mistakes. Check important info.

Let's dive into the benchmark and explain what's being tested.

**Benchmark Overview**

The benchmark compares the performance of three ways to iterate over an object in JavaScript:

1. `Object.keys()`
2. `Object.entries()`
3. A custom loop using the `for...in` statement with a check for property existence (`Object.hasOwn()`)

These methods are used to set values in a `Map` object, which is populated from a large dataset of key-value pairs stored in the `window.parentObj` object.

**Options Compared**

The benchmark compares the performance of these three options:

* **Option 1: `Object.keys()`**: Iterates over an array of keys using `Object.keys()`, and then uses those keys to set values in the `Map`.
* **Option 2: `Object.entries()`**: Directly iterates over key-value pairs using `Object.entries()`, and sets the value in the `Map` for each pair.
* **Option 3: Custom loop with `for...in` and `Object.hasOwn()`**: Uses a custom loop that checks if the property exists before setting its value in the `Map`.

**Pros and Cons of Each Option**

1. **`Object.keys()`**:
	* Pros: Easy to implement, works well for arrays.
	* Cons: Can be slower due to the need to create an array of keys, which can lead to additional memory allocation and garbage collection overhead.
2. **`Object.entries()`**:
	* Pros: Directly iterates over key-value pairs, avoids creating an array of keys.
	* Cons: May not work well with non-objects (e.g., arrays, functions), and may be slower for very large datasets due to the need to parse each property.
3. **Custom loop with `for...in` and `Object.hasOwn()`**:
	* Pros: Works well with objects, allows for early exit if a property is skipped.
	* Cons: Can be slower due to the need to check for property existence using `Object.hasOwn()`, and may not be as efficient as the other two options.

**Library and Special Features**

In this benchmark, the following libraries or special features are used:

* `Map`: A built-in JavaScript object that stores key-value pairs.
* `Object.keys()`**: A built-in JavaScript method for getting an array of a given object's own enumerable property names.
* `Object.entries()`: A built-in JavaScript method for getting an array of a given object's own enumerable key-value pairs.
* `for...in` statement**: A JavaScript loop that iterates over the properties of an object.

**Other Alternatives**

If you need to iterate over an object in JavaScript, other alternatives include:

* Using `forEach()` or `for...of` loops with a callback function
* Using `Object.assign()` to create a new object and then iterating over its keys
* Using a library like Lodash's `iteratee()` function

Keep in mind that the choice of iteration method depends on the specific requirements of your use case, such as performance, readability, or compatibility with older browsers.

Related benchmarks:

Object.entries VS Object.keys VS Object.keys with extra array VS Object.entries without array SG (version: 0)

Comparing performance of: Object.entries vs Object.keys vs for in object.hasown

Created: 2 years ago by: Guest

Jump to the latest result

Object.entries

Object.keys

for in object.hasown

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 6 months ago):