The paper

ES8 introduces two parts: a new constructor, SharedArrayBuffer, and Atomics, a namespace object with helper functions. Shared memory means that multiple threads concurrently read and write data. The atom can control the concurrency and ensure the smooth execution of multiple competing threads

Shared memory and atoms, also known as shared array buffers, are the basic building blocks for higher-level concurrent abstractions. It allows the bytes of a SharedArrayBuffer object to be shared between multiple workers and the main thread (buffers are shared to access the bytes, wrapped in typed arrays). This sharing has two benefits: faster sharing of data between Web workers makes coordination between Web workers simpler and faster

SharedArrayBuffer

A SharedArrayBuffer, as its name implies, provides A buffer of memory for shared memory between threads. You can send thread A’s SAB to thread B via postMessage, and both threads can access this buffer.

Note that SharedarayBuffer was disabled by default on 5 January 2018 by all major browsers in response to Spectre. Chrome has resurrected it on V67 platforms, where its site-isolation feature prevents spooky exploits.

The Spectre vulnerability is a vulnerability that can force other programs on a user’s operating system to access arbitrary locations in the program computer’s memory space

const worker = new Worker('worker.js'//worker.js for another thread var sab = new SharedArrayBuffer(1024) worker.postmessage ('sab')
Copy the code

Google Chrome does not support local workers. The solution is to use other browsers or http-server to start a service locally

  • SharedArrayBuffer can’t be read or written. In order to write to SharedArrayBuffer, you create views
Const intArrBuffer = new Int32Array(sab)for (let i = 0; i < intArrBuffer.length; i++) {
  intArrBuffer[i] = i
}
Copy the code
  • IntArrBuffer is modified in worker.js and the main thread is returned
----worker.js------
onmessage = function (e) {
  let arrBuffer = e.data
  arrBuffer[22] = 88
  postMessage(arrBuffer)
}

--- main.js----
worker.onmessage = function (e) {
  console.log('Changed data', intArrBuffer[22]) // It is also not desirable to fetch the value directly, if other threads are manipulating the data, there will be a conflict}Copy the code

It is not advisable to modify the arrBuffer directly in worker.js and to obtain intArrBuffer[22] directly in main.js. If intArrBuffer[22] is operated by other threads at the same time, it will cause a conflict. And that’s where the Atomics come in

Atomics

Atomics objects provide a set of static methods to perform atomic operations on SharedArrayBuffer objects. Unlike normal global objects, Atomics is not a constructor and therefore cannot be called with the new operator or directly as a function. All properties and methods of Atomics are static (just like Math objects).

I’m going to remodel it with Atomics

----worker.js------
onmessage = function (e) {
  letArrBuffer = e.ata atomics. store(arrBuffer,20,90)// modify by atom. Atomics.store returns the modified value 90 atomics. exchange(arrBuffer,20,100)// also by atomic modification, Return the replacement value 90 postMessage(arrBuffer)} -- main.js---- worker.onmessage =function (e) {
  console.log('Changed data', atomics.load (intArrBuffer, 22))Copy the code

Other approaches to Atomics

  • Atomics.add() adds the array element at the specified location to the given value and returns the value of the element before the addition.

  • Atomics.wait() tests whether the value at a specified location in the array is still the given value, and if so, suspends until awakened or timed out.

ArrBuffer [11]==11. Wait (arrBuffer,11,11)//Copy the code

  • Atomics.wake() wakes up the threads in the wait queue that are waiting on the element at the specified position in the array. The return value is the number of threads successfully awakened.

  • Atomics.sub() subtracts the array element at the specified location from the given value and returns the value of the element before subtraction

reference

Developer.mozilla.org/zh-CN/docs/… Developer.mozilla.org/zh-CN/docs/…