Benchmark: Object.key vs Object.value vs Object.entries

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()] = {
        innerVal: makeid()
    };
}

Tests:

entries
const newObj = {}; Object.entries(window.parentObj).forEach(([k, v], i) => { if ((i % 2) === 0) { newObj[k] = v; } });
keys
const newObj = {}; Object.keys(window.parentObj).forEach((k, i) => { if ((i % 2) === 0) { newObj[k] = window.parentObj[k]; } });
values
const newObj = {}; Object.values(window.parentObj).forEach((k, i) => { if ((i % 2) === 0) { newObj[k] = window.parentObj[k]; } });

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
entries
keys
values

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 months ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/144.0.0.0 Safari/537.36

Browser/OS: Chrome 144 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
entries	157164.5 Ops/sec
keys	491061.1 Ops/sec
values	123343.7 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested, compared options, pros and cons, and other considerations.

**Benchmark Definition**

The benchmark is testing three different approaches to accessing object properties: `Object.key` (i.e., `window.parentObj[k]`), `Object.value` (i.e., `window.parentObj[v]`), and `Object.entries` (i.e., iterating over the object's key-value pairs).

**Script Preparation Code**

The script preparation code creates an object `window.parentObj` with 100 properties, each containing another object with a random inner property value. This object is used to test the different approaches to accessing its properties.

**Html Preparation Code**

There is no HTML preparation code provided, which suggests that this benchmark is focused on JavaScript performance and not concerned with DOM manipulation or rendering.

**Individual Test Cases**

Each test case consists of a single line of JavaScript code that defines a new object `newObj` using one of the three approaches:

1. `entries`: Iterates over the object's key-value pairs using `Object.entries`, assigning values to `newObj` only when the index is even.
2. `keys`: Iterates over the object's keys using `Object.keys`, assigning values to `newObj` only when the index is even.
3. `values`: Iterates over the object's values using `Object.values`, assigning values to `newObj` only when the index is even.

**Library Used**

There is no explicit library used in this benchmark, but it relies on the built-in JavaScript `Object` methods: `Object.entries`, `Object.keys`, and `Object.values`.

**Special JS Features or Syntax**

None of the test cases use any special JavaScript features or syntax beyond what's required to demonstrate the different approaches.

**Pros and Cons of Each Approach**

Here's a brief summary:

1. **Object.entries**:
	* Pros: More concise and expressive way to iterate over an object's key-value pairs.
	* Cons: May incur additional overhead due to the iteration process, which can affect performance in certain scenarios.
2. **Object.keys**:
	* Pros: Familiar and widely supported approach for iterating over keys.
	* Cons: Less concise than `Object.entries` and may not be as expressive.
3. **Object.value** (not actually used in this benchmark):
	* Pros: Would allow accessing values directly, but it's not part of the original benchmark.

**Other Considerations**

The benchmark is likely designed to:

1. Compare performance: By running each test case repeatedly, the benchmark can compare the execution times and determine which approach is faster.
2. Isolate specific use cases: This benchmark focuses on a single object with many properties, allowing for an unbiased comparison of the different approaches.

**Alternatives**

If you're interested in exploring similar benchmarks or alternatives, here are some suggestions:

1. Benchmarking libraries like Benchmark.js or jsperf can provide more advanced features and customization options.
2. Browser-specific benchmarking tools, such as Mozilla's Autobench or Google's Chrome DevTools' benchmarking features, may offer additional performance comparison capabilities.
3. Other JavaScript benchmarks, like the ones provided by JSPerf or Benchmarkr, might cover broader topics or provide more in-depth analysis.

Keep in mind that each benchmark has its strengths and weaknesses, and it's essential to choose the right tool for your specific use case and requirements.

Related benchmarks:

Object.key vs Object.value vs Object.entries (version: 0)

Comparing performance of: entries vs keys vs values

Created: 5 years ago by: Guest

Jump to the latest result

entries

keys

values

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):