Benchmark: localStorage vs sessionStorage vs Reading a Hardcoded Array Speedtest

Script Preparation code:

localStorage.setItem('foo', 'bar')
sessionStorage.setItem('foo', 'bar')
var ARR = ['bar'];

Tests:

Control
var FOO = 'bar';
localStorage
var FOO = localStorage.getItem('foo');
sessionStorage
var FOO = sessionStorage.getItem('foo');
Read Array
var FOO = ARR[Math.floor(Math.random() * ARR.length)]

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Control
localStorage
sessionStorage
Read Array

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 6 months ago)

User agent: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/141.0.0.0 Mobile Safari/537.36

Browser/OS: Chrome Mobile 141 on Android

View result in a separate tab

Test name	Executions per second
Control	54826064.0 Ops/sec
localStorage	1702286.9 Ops/sec
sessionStorage	1699220.4 Ops/sec
Read Array	26760460.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark and explain what is being tested.

**Benchmark Definition**

The website measures JavaScript performance in various scenarios, including comparing different storage options (localStorage, sessionStorage) and accessing an array of values.

**Options Compared**

Three main options are compared:

1. **Reading from a hardcoded array**: This option tests how fast the browser can access a fixed array of values.
2. **Reading from localStorage**: This option tests how fast the browser can read data stored in local storage.
3. **Reading from sessionStorage**: This option tests how fast the browser can read data stored in session storage.

**Pros and Cons**

* **Hardcoded Array Read**: This approach provides a baseline for comparison, as it doesn't rely on external data stores. However, it might not reflect real-world scenarios where data is constantly changing.
* **localStorage Read**: Using local storage allows for storing and retrieving data locally, which can be useful in applications that need to store small amounts of data. However, accessing local storage can be slower due to the need to parse and serialize data.
* **sessionStorage Read**: Similar to localStorage, using session storage allows for storing and retrieving data locally. However, it has a shorter lifetime than local storage (session storage is tied to the session) and might not be suitable for applications that need to store data across multiple sessions.

**Library Usage**

The test cases use two libraries:

1. **localStorage**: This is a built-in JavaScript API for storing small amounts of data locally on the client-side.
2. **sessionStorage**: This is also a built-in JavaScript API for storing small amounts of data locally on the client-side, but it has a shorter lifetime than localStorage.

**Special JS Features or Syntax**

The test cases use some special syntax:

1. **Template literals**: The hardcoded array read option uses template literals (`var ARR = ['bar'];`) to define an array of values.
2. **Math.random()**: The hardcoded array read option uses `Math.random()` to generate a random index for accessing the array.

**Other Considerations**

When using local storage or session storage, it's essential to consider data sizes and types, as they can impact performance. Additionally, some browsers might have specific settings or configurations that affect local storage and session storage performance.

**Alternatives**

If you need to compare different storage options or accessing arrays, here are some alternative approaches:

1. **Use a caching layer**: Instead of using local storage or session storage, consider implementing a caching layer (e.g., Redis, Memcached) to store data.
2. **Choose a database**: If you need to store larger amounts of data, consider using a database like SQLite or IndexedDB.
3. **Optimize array access**: Instead of accessing an array randomly, consider optimizing your code to use a more efficient algorithm for accessing arrays (e.g., binary search).

Related benchmarks:

localStorage vs sessionStorage vs Reading a Hardcoded Array Speedtest (version: 0)

Comparing performance of: Control vs localStorage vs sessionStorage vs Read Array

Created: 6 years ago by: Guest

Jump to the latest result

Control

localStorage

sessionStorage

Read Array

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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