Benchmark: array vs object access

Script Preparation code:

var arr = new Array(1000).fill(0);

Tests:

test object accessor
for(const key in arr);
test array indexer
for(const idx of arr);
test object accessor + gets after
for(const key in arr); let i = 1000; while(arr[--i]);
test array indexer + gets after
for(const idx of arr); let i = 1000; while(arr[--i]);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
test object accessor
test array indexer
test object accessor + gets after
test array indexer + gets after

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) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.110 Safari/537.36

Browser/OS: Chrome 96 on Windows

View result in a separate tab

Test name	Executions per second
test object accessor	34637.1 Ops/sec
test array indexer	1028673.1 Ops/sec
test object accessor + gets after	35443.5 Ops/sec
test array indexer + gets after	914748.7 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks.

**What is tested on the provided JSON?**

The JSON represents a benchmark test case that compares the performance of accessing elements in arrays versus objects using JavaScript. The script preparation code initializes an array with 1000 elements filled with zeros, and there are four test cases:

1. **Object accessor**: Iterates over the array using `for(const key in arr);`.
2. **Array indexer**: Uses a for-of loop to iterate over the array (`for(const idx of arr);`).
3. **Object accessor + gets after**: A variation of the object accessor test case with an additional line of code that performs a "gets after" operation.
4. **Array indexer + gets after**: Similar to the previous two test cases, but uses an array indexer instead.

**Options compared**

The benchmark compares the performance of using `for...in` (object accessor) versus `for...of` (array indexer). The latter is a more modern and efficient way to iterate over arrays in JavaScript.

**Pros and cons**

* **for...in**: This approach can be useful when you need to iterate over an object's properties, but it has some drawbacks:
	+ It iterates over the object's property names, not its values.
	+ It may include inherited properties if the object inherits from another object.
	+ Performance is generally slower than `for...of`.
* **for...of**: This approach is more suitable for iterating over arrays because:
	+ It only iterates over the array's elements.
	+ It provides better performance and is more efficient.

**Library and purpose**

None are mentioned in this specific benchmark.

**Special JS feature or syntax**

The `for...in` and `for...of` loops use a built-in JavaScript feature called "iteration protocols" (ECMAScript 2015). This allows for more expressive and efficient ways to iterate over data structures like objects and arrays.

**Other alternatives**

If you need to optimize array iteration, consider using:

* **Array.prototype.forEach()**: A more modern and efficient way to iterate over an array.
* **Array.prototype.map(), filter(), reduce()**: These methods are designed for iterating and transforming arrays in a functional programming style.

For object iteration, consider using:

* **Object.keys()**, `Object.values()`, or `Object.entries()`: These methods provide a more controlled way to iterate over an object's properties.
* **Object.prototype.hasOwnProperty()` or `in operator` with caution: As mentioned earlier, these can be less efficient and less readable than other options.

By understanding the nuances of array iteration in JavaScript, you'll be better equipped to optimize your code for performance.

Related benchmarks:

array vs object access (version: 0)

test how v8 optimized arrays

Comparing performance of: test object accessor vs test array indexer vs test object accessor + gets after vs test array indexer + gets after

Created: 4 years ago by: Guest

Jump to the latest result

test object accessor

test array indexer

test object accessor + gets after

test array indexer + gets after

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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