Benchmark: Array vs Object vs Map vs WeakMap access 01920122

HTML Preparation code:

<script>
const map = new Map();
const weakMap = new WeakMap()
const array = [];
const object = {};
</script>

Script Preparation code:

const map = new Map();
const weakMap = new WeakMap()
const array = [];
const object = {};

Tests:

Map.get
map.get("0");
WeakMap.get
weakMap.get("0")
array[0]
array[0]
object.a
object.a

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Map.get
WeakMap.get
array[0]
object.a

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

Browser/OS: Chrome 112 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Map.get	13196350.0 Ops/sec
WeakMap.get	12554261.0 Ops/sec
array[0]	12984753.0 Ops/sec
object.a	12916944.0 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 details of the MeasureThat.net benchmark.

**Benchmark Definition and Preparation Code**

The benchmark is designed to test the performance of accessing elements from different data structures: arrays, objects, maps, and weakmaps. The preparation code creates instances of these data structures:

*   `map`: a new Map object
*   `weakMap`: a new WeakMap object
*   `array`: an empty array
*   `object`: an empty object

The preparation code is executed in both the script tag provided by MeasureThat.net and in the user's browser.

**Individual Test Cases**

Each test case consists of a single benchmark definition, which is a JavaScript expression that accesses an element from one of the data structures. The expressions are:

1.  `map.get("0")`: accessing the first key-value pair of the map
2.  `weakMap.get("0")`: accessing the first key-value pair of the weak map
3.  `array[0]`: accessing the first element of the array
4.  `object.a`: accessing a property named "a" on the object

**Library and Purpose**

In this benchmark, two libraries are used:

1.  **Map**: The Map data structure is a built-in JavaScript object that stores key-value pairs. It's used to test the performance of accessing elements by their keys.
2.  **WeakMap**: The WeakMap data structure is also a built-in JavaScript object that stores key-value pairs, but it's designed for use cases where the map doesn't need to be persisted across garbage collection cycles.

**Special JS Feature or Syntax**

None of the expressions in this benchmark rely on any special JavaScript features or syntax. They are straightforward access operations using the dot notation for arrays and objects, and the `get` method for maps.

**Pros and Cons of Different Approaches**

Here's a brief analysis of the pros and cons of each approach:

1.  **Arrays**:
    *   Pros: arrays are lightweight, fast, and widely supported.
    *   Cons: accessing elements by index can be slower than using other data structures, especially for large datasets.

2.  **Objects**:
    *   Pros: objects provide fast access to properties using the dot notation.
    *   Cons: accessing properties requires a string or symbol (for non-enumerable properties).

3.  **Maps**:
    *   Pros: maps provide fast access to key-value pairs using the `get` method, which is generally faster than array indexing.
    *   Cons: maps require more memory and have slower insertion/deletion performance compared to arrays.

4.  **WeakMaps**:
    *   Pros: weakmaps provide a lightweight alternative to maps, especially for use cases where the map doesn't need to be persisted across garbage collection cycles.
    *   Cons: weakmaps are only available in modern browsers and may not work in older environments.

**Other Alternatives**

If you're looking for alternatives to this benchmark, consider the following options:

1.  **Array.prototype.forEach()**: Instead of using `map.get("0")`, you could use `array.forEach()` to test the performance of iterating over an array.
2.  **Object.entries() and Object.values()**: To test the performance of accessing properties on an object, you could use `object.entries()` or `object.values()`.
3.  **Array.prototype.indexOf() or Array.prototype.includes()**: Instead of using `array[0]`, you could use `array.indexOf("value")` or `array.includes("value")` to test the performance of searching for a value in an array.

Keep in mind that these alternatives might not provide the same level of insight as this benchmark, but they can be useful for testing different aspects of JavaScript's performance.

Related benchmarks:

Array vs Object vs Map vs WeakMap access 01920122 (version: 0)

Comparing performance of: Map.get vs WeakMap.get vs array[0] vs object.a

Created: one year ago by: Guest

Jump to the latest result

Map.get

WeakMap.get

array[0]

object.a

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):