SharedArrayBuffer and Atomics | Frontend Practical Guide

Overview

SharedArrayBuffer and Atomics allow multiple threads to coordinate over shared memory. They enable low-level synchronization patterns for high-performance browser applications.

Browser support

Feature	Desktop				Mobile
Feature	Chrome	Edge	Firefox	Safari	Chrome Android	Safari iOS
`Atomics`	68	79	78	15.2	89	15.2
`Atomics.Atomic operations on non shared buffers` Atomic operations on non-shared `ArrayBuffer` objects			79
`Atomics.add` The Atomics.add() static method adds a given value at a given position in the array, and returns the old value at that position. This atomic operation guarantees that no other write happens until the modified value is written back.	68	79	78	15.2	89	15.2
`Atomics.and` The Atomics.and() static method computes a bitwise AND with a given value at a given position in the array, and returns the old value at that position. This atomic operation guarantees that no other write happens until the modified value is written back.	68	79	78	15.2	89	15.2
`Atomics.compareExchange` The Atomics.compareExchange() static method exchanges a given replacement value at a given position in the array, if a given expected value equals the old value. It returns the old value at that position whether it was equal to the expected value or not. This atomic operation guarantees that no other write happens until the modified value is written back.	68	79	78	15.2	89	15.2
`Atomics.exchange` The Atomics.exchange() static method exchanges a given value at a given position in the array, and returns the old value at that position. This atomic operation guarantees that no other write happens between the read of the old value and the write of the new value.	68	79	78	15.2	89	15.2
`Atomics.isLockFree` The Atomics.isLockFree() static method is used to determine whether the Atomics methods use locks or atomic hardware operations when applied to typed arrays with the given element byte size. It is intended as an optimization primitive, so that high-performance algorithms can determine whether to use locks or atomic operations in critical sections. If an…	68	79	78	15.2	89	15.2
`Atomics.load` The Atomics.load() static method returns a value at a given position in the array. This atomic operation guarantees that the read is tear-free, and that all atomic reads are sequentially consistent.	68	79	78	15.2	89	15.2
`Atomics.notify` The Atomics.notify() static method notifies up some agents that are sleeping in the wait queue.	68	79	78	15.2	89	15.2
`Atomics.or` The Atomics.or() static method computes a bitwise OR with a given value at a given position in the array, and returns the old value at that position. This atomic operation guarantees that no other write happens until the modified value is written back.	68	79	78	15.2	89	15.2
`Atomics.store` The Atomics.store() static method stores a given value at a given position in the array and returns that value. This atomic operation guarantees that the write is tear-free, and that all atomic writes are sequentially consistent.	68	79	78	15.2	89	15.2
`Atomics.sub` The Atomics.sub() static method subtracts a given value at a given position in the array, and returns the old value at that position. This atomic operation guarantees that no other write happens until the modified value is written back.	68	79	78	15.2	89	15.2
`Atomics.wait` The Atomics.wait() static method verifies that a shared memory location contains a given value and if so sleeps, awaiting a wake-up notification or a time out. It returns a string which is "not-equal" if the memory location does not match the given value, "ok" if woken by Atomics.notify(), or "timed-out" if the timeout expires.	68	79	78	15.2	89	15.2
`Atomics.xor` The Atomics.xor() static method computes a bitwise XOR with a given value at a given position in the array, and returns the old value at that position. This atomic operation guarantees that no other write happens until the modified value is written back.	68	79	78	15.2	89	15.2
`DataView.DataView.sharedarraybuffer support` `SharedArrayBuffer` accepted as buffer	68	79	79	15.2	89	15.2
Other
`javascript.builtins.SharedArrayBuffer` The SharedArrayBuffer object is used to represent a generic raw binary data buffer, similar to the ArrayBuffer object, but in a way that they can be used to create views on shared memory. A SharedArrayBuffer is not a Transferable Object, unlike an ArrayBuffer which is transferable.	68	79	79	15.2	89	15.2
Built-in object
`SharedArrayBuffer.@@species` The SharedArrayBuffer[Symbol.species] static accessor property returns the constructor used to construct return values from SharedArrayBuffer methods.	68	79	79	15.2	89	15.2
`SharedArrayBuffer.SharedArrayBuffer` The SharedArrayBuffer() constructor creates SharedArrayBuffer objects.	68	79	79	15.2	89	15.2
`SharedArrayBuffer.byteLength` The byteLength accessor property of SharedArrayBuffer instances returns the length (in bytes) of this SharedArrayBuffer.	68	79	79	15.2	89	15.2
`SharedArrayBuffer.slice` The slice() method of SharedArrayBuffer instances returns a new SharedArrayBuffer whose contents are a copy of this SharedArrayBuffer's bytes from start, inclusive, up to end, exclusive. If either start or end is negative, it refers to an index from the end of the array, as opposed to from the beginning.	68	79	79	15.2	89	15.2

1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)

Syntax

JAVASCRIPT

const sab = new SharedArrayBuffer(1024);
const int32 = new Int32Array(sab);

// Share among workers
worker.postMessage(sab);

// Atomic operations
Atomics.add(int32, 0, 5);
Atomics.load(int32, 0); // 5

Live demo

Create a SharedArrayBuffer

Allocate shared memory and inspect it through typed array views.

JavaScript

Output

Press the Run button

Share one buffer across views

Read the same shared memory through two typed arrays.

JavaScript

Output

Press the Run button

Use Atomics with shared memory

Apply an atomic add operation on a shared typed array.

JavaScript

Output

Press the Run button

Use cases

Compute-heavy coordination
Use shared buffers when multiple workers need tight coordination over numeric data.
Realtime engines
Game loops, media pipelines, and simulations may benefit when copying large data would be too expensive.

Cautions

Concurrency bugs are hard to reason about, and low-level memory coordination raises the maintenance cost quickly.
Cross-origin isolation requirements can affect deployment and hosting decisions.

Overview

Browser support

Syntax

Live demo

Create a SharedArrayBuffer

Share one buffer across views

Use Atomics with shared memory

Use cases

Compute-heavy coordination

Realtime engines

Cautions

Accessibility

Related links