Benchmark: Convert Array to Object - Compare all possible4

Script Preparation code:

var data = Array.from(Array(10000).keys()).map(i => ({id: i, value: `val_${i}`}));

AخA
 
var data = Array.from(Array(10000).keys()).map(i => ({id: i, value: `val_${i}`}));

Tests:

Object.fromEntries
Object.fromEntries(data.map(obj => [obj.id, obj]));
Object.fromEntries(data.map(obj => [obj.id, obj]));
Reduce (reuse object)
data.reduce((acc, obj) => { acc[obj.id] = obj; return acc; }, {});
data.reduce((acc, obj) => {
acc[obj.id] = obj;
return acc;
}, {});
Reduce (creating temporary objects)
data.reduce((acc, obj) => ({ ...acc, [obj.id]: obj }), {});
data.reduce((acc, obj) => ({
...acc,
[obj.id]: obj
}), {});

Map

new Map(data.map(obj => [obj.id, obj]));

 
new Map(data.map(obj => [obj.id, obj]));

forEach

const res = {};
data.forEach(obj => {
	res[obj.id] = obj; 
});

 
const res = {};data.forEach(obj => {    res[obj.id] = obj; });  

for of

const res = {};
for (const obj of data) {
	res[obj.id] = obj; 
}

 
const res = {};for (const obj of data) {    res[obj.id] = obj; }  

for i

const res = {};
for (let i = 0; i < data.length; i++) {
  	const obj = data[i];
	res[obj.id] = obj; 
}

 
const res = {};for (let i = 0; i < data.length; i++) {    const obj = data[i];    res[obj.id] = obj; }  

for i saved length variable

const res = {};
const length = data.length;
for (let i = 0; i < length; i++) {
  	const obj = data[i];
	res[obj.id] = obj; 
}

 
const res = {};const length = data.length;for (let i = 0; i < length; i++) {    const obj = data[i];    res[obj.id] = obj; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
Object.fromEntries
Reduce (reuse object)
Reduce (creating temporary objects)
Map
forEach
for of
for i
for i saved length variable

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

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

Browser/OS: Chrome 121 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Object.fromEntries	2715.7 Ops/sec
Reduce (reuse object)	18107.6 Ops/sec
Reduce (creating temporary objects)	121.1 Ops/sec
Map	2077.8 Ops/sec
forEach	18834.5 Ops/sec
for of	18485.0 Ops/sec
for i	1461.3 Ops/sec
for i saved length variable	2625.2 Ops/sec

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

Overview

MeasureThat.net is a website that allows users to create and run JavaScript microbenchmarks. The provided benchmark measures the performance of different approaches for converting an array to an object.

Benchmark Definition

The benchmark definition consists of a JSON object with several properties:

Name: The name of the benchmark, which is "Convert Array to Object - Compare all possible".
Description: An empty string indicating that there is no description provided.
Script Preparation Code: A JavaScript code snippet that prepares an array of 10,000 objects, each with an id and a value.
Html Preparation Code: An empty string indicating that no HTML preparation code is required.

Individual Test Cases

The benchmark consists of six individual test cases, each representing a different approach for converting the array to an object:

Object.fromEntries: Uses the Object.fromEntries method to create an object from an array of key-value pairs.
Reduce (reuse object): Uses the reduce method with an accumulator object and pushes new properties onto it, overwriting existing ones.
Reduce (creating temporary objects): Similar to the previous approach, but creates a new object for each iteration instead of reusing an accumulator object.
Map: Uses the Map constructor to create a map from the array of key-value pairs.
forEach: Iterates over the array using forEach and assigns each element to a property on an empty object.
for of: Iterates over the array using for...of and assigns each element to a property on an empty object.
for i: Iterates over the array using for with an index variable and assigns each element to a property on an empty object, saving the length of the array as a variable.
for i saved length variable: Similar to the previous approach, but saves the length of the array as a variable before iterating.

Library and Special Features

The benchmark uses the following libraries:

Array.from(): Creates an array from an iterable.
Object.fromEntries(): A modern method for creating an object from key-value pairs.
Map(): Creates a map from key-value pairs.

There are no special features used in this benchmark beyond the standard JavaScript APIs.

Performance Results

The performance results show the execution time for each test case on a Chrome 121 browser running on a Mac with an Intel processor. The results are:

Object.fromEntries: ~271ms
Reduce (reuse object): ~15ms
Reduce (creating temporary objects): ~122ms
Map: ~262ms
forEach: ~2077ms
for of: ~1461ms
for i: ~121ms
for i saved length variable: ~15ms

The results indicate that the Reduce (reuse object) approach is the fastest, followed closely by the Object.fromEntries method. The other approaches are significantly slower, with the forEach and for of iterations being the slowest.

In conclusion, this benchmark demonstrates the performance differences between various approaches for converting an array to an object in JavaScript.

LLMs can make mistakes. Check important info.

**Overview**

**Benchmark Definition**

The benchmark definition consists of a JSON object with several properties:

* `Name`: The name of the benchmark, which is "Convert Array to Object - Compare all possible".
* `Description`: An empty string indicating that there is no description provided.
* `Script Preparation Code`: A JavaScript code snippet that prepares an array of 10,000 objects, each with an `id` and a `value`.
* `Html Preparation Code`: An empty string indicating that no HTML preparation code is required.

**Individual Test Cases**

The benchmark consists of six individual test cases, each representing a different approach for converting the array to an object:

1. **Object.fromEntries**: Uses the `Object.fromEntries` method to create an object from an array of key-value pairs.
2. **Reduce (reuse object)**: Uses the `reduce` method with an accumulator object and pushes new properties onto it, overwriting existing ones.
3. **Reduce (creating temporary objects)**: Similar to the previous approach, but creates a new object for each iteration instead of reusing an accumulator object.
4. **Map**: Uses the `Map` constructor to create a map from the array of key-value pairs.
5. **forEach**: Iterates over the array using `forEach` and assigns each element to a property on an empty object.
6. **for of**: Iterates over the array using `for...of` and assigns each element to a property on an empty object.
7. **for i**: Iterates over the array using `for` with an index variable and assigns each element to a property on an empty object, saving the length of the array as a variable.
8. **for i saved length variable**: Similar to the previous approach, but saves the length of the array as a variable before iterating.

**Library and Special Features**

The benchmark uses the following libraries:

* `Array.from()`: Creates an array from an iterable.
* `Object.fromEntries()`: A modern method for creating an object from key-value pairs.
* `Map()`: Creates a map from key-value pairs.

There are no special features used in this benchmark beyond the standard JavaScript APIs.

**Performance Results**

The performance results show the execution time for each test case on a Chrome 121 browser running on a Mac with an Intel processor. The results are:

1. **Object.fromEntries**: ~271ms
2. **Reduce (reuse object)**: ~15ms
3. **Reduce (creating temporary objects)**: ~122ms
4. **Map**: ~262ms
5. **forEach**: ~2077ms
6. **for of**: ~1461ms
7. **for i**: ~121ms
8. **for i saved length variable**: ~15ms

The results indicate that the `Reduce (reuse object)` approach is the fastest, followed closely by the `Object.fromEntries` method. The other approaches are significantly slower, with the `forEach` and `for of` iterations being the slowest.

In conclusion, this benchmark demonstrates the performance differences between various approaches for converting an array to an object in JavaScript.

Related benchmarks:

Convert Array to Object - Compare all possible4 (version: 0)

Comparing performance of: Object.fromEntries vs Reduce (reuse object) vs Reduce (creating temporary objects) vs Map vs forEach vs for of vs for i vs for i saved length variable

Created: 2 years ago by: Guest

Jump to the latest result

Object.fromEntries

Reduce (reuse object)

Reduce (creating temporary objects)

Map