Benchmark: Object vs Array speed (contiguous)

Script Preparation code:

let objLiteral = {
  0x0:()=>{console.log('A');},
  0x1:()=>{console.log('A');},
  0x2:()=>{console.log('A');},
  0x3:()=>{console.log('A');},
  0x4:()=>{console.log('A');},
  0x5:()=>{console.log('A');},
  0x6:()=>{console.log('A');},
  0x7:()=>{console.log('A');},
  0x8:()=>{console.log('A');},
  0x9:()=>{console.log('A');},
  0xA:()=>{console.log('A');},
  0xB:()=>{console.log('A');},
  0xC:()=>{console.log('A');},
  0xD:()=>{console.log('A');},
  0xE:()=>{console.log('A');},
  0xF:()=>{console.log('A');}
}

var arrayLiteral = [
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');},
  ()=>{console.log('A');}
];

Tests:

Object Literal
objLiteral[Math.floor(Math.random() * 0x10)]();
Array Literal
arrayLiteral[Math.floor(Math.random() * 0x10)]();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object Literal
Array Literal

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/131.0.0.0 Safari/537.36

Browser/OS: Chrome 131 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Object Literal	403941.5 Ops/sec
Array Literal	393256.8 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):

LLMs can make mistakes. Check important info.

The benchmark titled "Object vs Array speed (contiguous)" evaluates the performance of calling functions stored in two different types of data structures in JavaScript: an object literal and an array literal. The main purpose of this benchmark is to understand the differences in execution speed when using an object versus an array for a similar use case.

### Options Compared
1. **Object Literal** (`objLiteral`):
   - The object consists of keys that are hexadecimal integers (0x0 to 0xF), each mapped to a function that logs the letter "A" to the console. 
   - The benchmark runs the expression `objLiteral[Math.floor(Math.random() * 0x10)]();`, which randomly selects one of the 16 functions stored in the object to execute.

2. **Array Literal** (`arrayLiteral`):
   - The array contains the same 16 functions that log the letter "A" to the console.
   - The benchmark executes `arrayLiteral[Math.floor(Math.random() * 0x10)]();`, similarly randomly selecting a function from the array.

### Pros and Cons of Each Approach

#### Object Literal
- **Pros**:
  - Key-value pair structure can be faster for certain operations and can provide O(1) access in many scenarios since object properties can be used like hash maps.
  - Can provide better semantic clarity depending on how keys are structured, as keys can be more descriptive than array indices.
  
- **Cons**:
  - Objects can have performance overhead due to prototype chaining, which may slow down property access in some cases.
  - Less intuitive organization compared to arrays when it comes to ordered data or iterations.

#### Array Literal
- **Pros**:
  - Arrays are specifically designed for ordered collections and function well with built-in array methods (e.g., `.map()`, `.forEach()`, etc.).
  - Generally optimized for quick, sequential access of elements.
  
- **Cons**:
  - Can be less performant for random access in large arrays due to potential memory management differences.
  - Overhead of maintaining the array structure can be slightly higher if many indices are not used.

### Alternative Considerations
- **Maps or Sets**: JavaScript `Map` or `Set` can be used for similar cases where key-value pairs or unique items are required. Maps can have better performance for frequent additions and deletions.
  
- **Typed Arrays**: For numerical data, typed arrays can provide significant speed improvements and lower memory usage compared to regular arrays. However, they are not suitable for functions or complex objects.

- **Function binding**: If the functions need to retain `this` context, using `.bind()` on the function references might introduce performance overhead, which isn't covered in this benchmark.

### Benchmark Results
The results show that the **Object Literal** achieved **403,941.53** executions per second while the **Array Literal** achieved **393,256.75** executions per second. Thus, the object literal performed better in this specific benchmark case, albeit the differences in this context may not be significant across all use cases, as performance can vary based on the JavaScript engine and the context in which these structures are used.

In conclusion, while the object approach appears faster in this benchmark, the choice between using an object or an array will depend heavily on the specific use case, data organization needs, and overall design considerations within the broader application. Each data structure has its own merits that can benefit different scenarios in JavaScript programming.

Related benchmarks:

Object vs Array speed (contiguous) (version: 1)

Comparing performance of: Object Literal vs Array Literal

Created: one year ago by: Guest

Jump to the latest result

Object Literal

Array Literal

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):