SharedArrayBuffer

SharedArrayBuffer 对象用来表示一个通用的、固定长度的原始二进制数据缓冲区，类似于 ArrayBuffer 对象，它们都可以用来在共享内存（shared memory）上创建视图。与 ArrayBuffer 不同的是，SharedArrayBuffer 不能被转移。

描述

分配及共享内存

为了将一个 SharedArrayBuffer 对象从一个用户代理共享到另一个用户代理（另一个页面的主进程或者当前页面的一个 worker）从而实现共享内存，我们需要运用 postMessage 和结构化克隆算法。

结构化克隆算法接收 SharedArrayBuffers 对象，或被映射到一个新的 SharedArrayBuffers 对象上的 TypedArrays 对象。在这两种情况下，这个新的 SharedArrayBuffer 对象会被传递到目标用户代理的接收函数上，从而在目标用户代理产生一个新的私有 SharedArrayBuffer 对象（正如 ArrayBuffer 一样）。但是，这两个 SharedArrayBuffer 对象指向的共享数据块其实是同一个，所以某一代理对数据块的修改在另一个代理中可见。

js

var sab = new SharedArrayBuffer(1024);
worker.postMessage(sab);

通过原子操作更新及同步共享内存

共享内存能被同时创建和更新于 worker 线程或主线程。依赖于系统（CPU、操作系统、浏览器），变化传递给所有上下文环境需要一段时间。因此需要通过原子操作来进行同步。

接受 SharedArrayBuffer 对象的 API

安全需求

为应对幽灵漏洞，所有主流浏览器均默认于 2018 年 1 月 5 日禁用 SharedArrayBuffer。在 2020 年，一种新的、安全的方法已经标准化，以重新启用 SharedArrayBuffer。通过一些安全措施，postMessage() 将不再抛出有关 SharedArrayBuffer 对象的异常，跨线程共享内存也变得可用：

作为基准需求，你的文档需处于安全上下文中。

对于顶级文档，需要设置两个 HTTP 消息头以跨域隔离你的站点：

Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp

为检查跨域隔离是否生效，你可以检查 crossOriginIsolated 属性在窗口和 worker 上下文中是否可用：

js

if (crossOriginIsolated) {
  // Post SharedArrayBuffer
} else {
  // Do something else
}

参阅 Planned changes to shared memory (en-US)，以了解共享内存在浏览器中的变更计划（例如，Firefox 79）。

始终使用 new 运算符来构造 SharedArrayBuffer

SharedArrayBuffer 必须使用 new 运算符来构造。作为函数来调用 SharedArrayBuffer() 构造函数（如果不用 new 运算符），将会抛出 TypeError 异常。

js

var sab = SharedArrayBuffer(1024);
// TypeError: calling a builtin SharedArrayBuffer constructor
// without new is forbidden

js

var sab = new SharedArrayBuffer(1024);

构造函数

SharedArrayBuffer() (en-US)

创建一个 SharedArrayBuffer 对象。

实例属性

SharedArrayBuffer.prototype.byteLength

数组的大小（以字节为单位）。这是在构造数组时建立的，不能更改（只读）。

实例方法

SharedArrayBuffer.prototype.slice(begin, end)

返回一个新的 SharedArrayBuffer，其为源数组从 begin 字节到 end 字节（不含 end 字节）的拷贝。若 begin 或 end 为负数，则表示从数组末尾开始的索引。

示例

创建一个新的 SharedArrayBuffer

js

var sab = new SharedArrayBuffer(1024);

截取 SharedArrayBuffer

js

sab.slice(); // SharedArrayBuffer { byteLength: 1024 }
sab.slice(2); // SharedArrayBuffer { byteLength: 1022 }
sab.slice(-2); // SharedArrayBuffer { byteLength: 2 }
sab.slice(0, 1); // SharedArrayBuffer { byteLength: 1 }

在 WebGL buffer 中使用

js

const canvas = document.querySelector("canvas");
const gl = canvas.getContext("webgl");
const buffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
gl.bufferData(gl.ARRAY_BUFFER, sab, gl.STATIC_DRAW);

规范

Specification
ECMAScript Language Specification
# sec-sharedarraybuffer-objects

浏览器兼容性

BCD tables only load in the browser

参见