Benchmark: Converting array to object using Array.reduce(), Object.fromEntries(), Object.assign(), for loop, ...spread

Script Preparation code:

let array = Array.from({length:4096},(_,i)=>i).sort(() => Math.random() - 0.5)

Tests:

Array.reduce()
let object = array.reduce((pool, item, nth) => { pool[nth] = item; return pool; }, {});
For loop
let object = {}; let length = array.length; for(let i = 0; i < length; i++) { object[i] = array[i]; }
Object.fromEntries() + Object.entries()
let object = Object.fromEntries(Object.entries(array))
Object.assign()
let object = Object.assign({},array)
Object ...spread
let object = {...array}

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.reduce()
For loop
Object.fromEntries() + Object.entries()
Object.assign()
Object ...spread

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 131 on Windows

View result in a separate tab

Test name	Executions per second
Array.reduce()	29225.2 Ops/sec
For loop	24355.0 Ops/sec
Object.fromEntries() + Object.entries()	2106.2 Ops/sec
Object.assign()	1285.9 Ops/sec
Object ...spread	1519.3 Ops/sec

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

LLMs can make mistakes. Check important info.

The benchmark conducted tests various methods of converting an array to an object in JavaScript, focusing on performance comparisons among different approaches. Here's a breakdown of the options compared, their pros and cons, and other relevant considerations.

### Methods Tested
1. **Array.reduce()**
   - **Benchmark Definition:** Uses the `reduce` method to iterate over the array and construct an object.
   - **Pros:** 
     - Functional approach, promotes immutability.
     - More concise and expressive when handling transformations.
   - **Cons:**
     - May be slower due to additional function calls and the inherent overhead of managing a closure.
  
2. **For Loop**
   - **Benchmark Definition:** A traditional loop that iterates through the array and assigns values to object properties.
   - **Pros:** 
     - Often the fastest because it is straightforward and doesn't suffer from the overhead associated with higher-order functions.
     - Very clear and easy to understand.
   - **Cons:**
     - More verbose and less elegant, especially for complex transformations.
  
3. **Object.fromEntries() + Object.entries()**
   - **Benchmark Definition:** Converts the array to entries (key-value pairs) and then uses `Object.fromEntries` to create the object.
   - **Pros:** 
     - Clean and modern approach, leveraging built-in methods that could make the code more readable.
   - **Cons:**
     - Requires creating intermediate representations (entries), which may incur performance penalties.
  
4. **Object.assign()**
   - **Benchmark Definition:** Uses `Object.assign()` to create a new object from the array.
   - **Pros:** 
     - A straightforward approach that uses a standard utility function widely recognized in JavaScript.
   - **Cons:**
     - Similar to Object.fromEntries(), it may not be the most efficient for this particular task, as it merges properties but doesn't handle nested structures directly.
  
5. **Object ...spread (spread operator)**
   - **Benchmark Definition:** Uses the spread operator to unpack the array into a new object.
   - **Pros:** 
     - Modern and succinct syntax; very easy to read.
   - **Cons:** 
     - This method can be slower than traditional loops due to the mechanism of spreading and not particularly intended for object creation.

### Benchmark Results
The latest benchmark results show a clear performance hierarchy among the methods tested:

- **Fastest:** `Array.reduce()` at approximately 29,225 executions per second.
- **Second Fastest:** `For loop` at 24,355 executions per second.
- **Slower Approaches:** `Object.fromEntries() + Object.entries()`, `Object ...spread`, and `Object.assign()` perform significantly worse, with execution speeds decreasing to about 2,106, 1,519, and 1,286 executions per second, respectively.

### Other Considerations
- **Readability vs Performance:** While `Array.reduce()` is not as performant as a regular for loop, its readability may make it preferable in certain contexts, especially in functional programming paradigms.
- **Use Case Relevance:** If the conversion of the array to an object is trivial in terms of performance (e.g., in scenarios where the converted object is not used frequently or the data is small), the choice may be influenced more by code clarity than raw performance.
- **Browser Compatibility:** All methods should be compatible across modern browsers, although older browsers may not support newer features like the spread operator.

### Alternatives
- **Map**: If the array comprises unique keys and values, using the `Map` object could be viable, as it allows for simpler key-value pair management.
- **Lazy Evaluation**: For extremely large arrays or where performance is critical, consider using optimization techniques such as iterative processing or streaming data, particularly in server-side applications.
   
In conclusion, the choice between these methods relies on individual use cases, balancing the trade-offs of performance, readability, and maintainability.

Related benchmarks:

Converting array to object using Array.reduce(), Object.fromEntries(), Object.assign(), for loop, ...spread (version: 1)

Comparing performance of: Array.reduce() vs For loop vs Object.fromEntries() + Object.entries() vs Object.assign() vs Object ...spread

Created: 23 days ago by: Guest

Jump to the latest result

Array.reduce()

For loop

Object.fromEntries() + Object.entries()

Object.assign()

Object ...spread

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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