SharedArrayBuffer和Atomics

ECMAScript 8（ES2017）引入了SharedArrayBuffer和Atomics对象，为JavaScript的多线程编程提供了底层支持。这两个特性使得开发者能够在Web Worker之间共享内存，并通过原子操作实现线程安全的同步机制。

SharedArrayBuffer的基本概念

SharedArrayBuffer是一种特殊的ArrayBuffer，它可以在多个Web Worker之间共享内存。与普通的ArrayBuffer不同，SharedArrayBuffer允许不同的线程同时访问同一块内存区域。

// 在主线程中创建SharedArrayBuffer
const sharedBuffer = new SharedArrayBuffer(16);

这个16字节的缓冲区可以被传递给任意数量的Web Worker，每个Worker都能直接读写这块内存。

Atomics对象的作用

由于多线程同时访问共享内存可能导致竞争条件，Atomics对象提供了一组原子操作方法，确保这些操作在执行时不会被其他线程中断：

// 在Worker中操作共享内存
const sharedArray = new Int32Array(sharedBuffer);

// 原子地增加数组第一个元素的值
Atomics.add(sharedArray, 0, 1);

实际应用场景

计数器同步

多个Worker需要共同维护一个计数器时：

// Worker 1
Atomics.add(sharedArray, 0, 1);

// Worker 2
const currentValue = Atomics.load(sharedArray, 0);

线程间通信

实现Worker之间的通知机制：

// Worker 1等待通知
Atomics.wait(sharedArray, 0, 0);

// Worker 2发送通知
Atomics.store(sharedArray, 0, 1);
Atomics.notify(sharedArray, 0, 1);

内存模型与顺序一致性

JavaScript采用顺序一致的内存模型，Atomics操作保证了内存访问的顺序性。考虑以下代码：

// 线程A
sharedArray[0] = 1;
Atomics.store(sharedArray, 1, 2);

// 线程B
const a = Atomics.load(sharedArray, 1);
const b = sharedArray[0];

在这个例子中，如果线程B读取到a的值为2，那么它一定能读取到b的值为1。

安全考虑与浏览器限制

由于Spectre等安全漏洞，现代浏览器对SharedArrayBuffer的使用有严格限制：

1. 需要启用跨域隔离
2. 必须设置COOP和COEP响应头
3. 在非安全上下文中不可用

服务器配置示例：

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

性能优化技巧

使用SharedArrayBuffer时应注意：

1. 尽量减少原子操作频率
2. 合理设计数据结构避免假共享
3. 使用适当的等待策略

// 优化后的等待循环
while (Atomics.load(sharedArray, 0) === 0) {
  Atomics.wait(sharedArray, 0, 0, 100);
}

与其他API的交互

SharedArrayBuffer可以与大多数TypedArray一起使用：

const floatBuffer = new SharedArrayBuffer(32);
const floatArray = new Float64Array(floatBuffer);

但要注意不同视图之间的对齐要求。

调试与错误处理

调试多线程程序时，Atomics提供了一些有用的方法：

// 检查是否支持Atomics
if (typeof Atomics === 'undefined') {
  throw new Error('Atomics not supported');
}

// 验证操作是否成功
const oldValue = Atomics.compareExchange(
  sharedArray, 
  0, 
  expectedValue, 
  newValue
);
if (oldValue !== expectedValue) {
  // 处理竞争条件
}

浏览器兼容性现状

截至2023年，主要浏览器的支持情况：

• Chrome: 完全支持
• Firefox: 完全支持
• Safari: 部分支持
• Edge: 完全支持

需要检测特性支持：

if (typeof SharedArrayBuffer !== 'undefined' && 
    typeof Atomics !== 'undefined') {
  // 安全使用特性
}

实际项目中的最佳实践

1. 限制共享内存的大小
2. 为每个共享缓冲区建立清晰的协议
3. 实现超时机制防止死锁

// 带超时的等待
const status = Atomics.wait(sharedArray, 0, 0, 1000);
if (status === 'timed-out') {
  // 处理超时
}

与WebAssembly的配合使用

SharedArrayBuffer特别适合与WebAssembly的多线程功能配合：

// 将共享内存传递给Wasm模块
const wasmMemory = new WebAssembly.Memory({
  initial: 10,
  maximum: 100,
  shared: true
});

const sharedBuffer = wasmMemory.buffer;

常见问题解决方案

虚假唤醒问题

Atomics.wait可能会在没有通知的情况下返回，需要循环检查：

while (conditionIsFalse()) {
  Atomics.wait(sharedArray, index, expectedValue);
}

字节序问题

在不同架构的处理器之间共享数据时：

// 使用DataView处理字节序
const view = new DataView(sharedBuffer);
const value = view.getInt32(0, true); // 小端模式

高级使用模式

实现信号量

class Semaphore {
  constructor(sharedBuffer, index, initialValue) {
    this.sab = sharedBuffer;
    this.index = index;
    Atomics.store(new Int32Array(this.sab), this.index, initialValue);
  }

  acquire() {
    while (true) {
      const oldValue = Atomics.load(new Int32Array(this.sab), this.index);
      if (oldValue > 0 && 
          Atomics.compareExchange(
            new Int32Array(this.sab), 
            this.index, 
            oldValue, 
            oldValue - 1
          ) === oldValue) {
        return;
      }
      Atomics.wait(new Int32Array(this.sab), this.index, oldValue);
    }
  }

  release() {
    const oldValue = Atomics.add(new Int32Array(this.sab), this.index, 1);
    Atomics.notify(new Int32Array(this.sab), this.index, 1);
  }
}

性能基准测试

比较普通操作与原子操作的性能差异：

// 测试原子加法性能
const iterations = 1000000;
let start = performance.now();
for (let i = 0; i < iterations; i++) {
  Atomics.add(sharedArray, 0, 1);
}
const atomicTime = performance.now() - start;

// 测试普通加法性能
start = performance.now();
for (let i = 0; i < iterations; i++) {
  sharedArray[0]++;
}
const normalTime = performance.now() - start;

console.log(`原子操作耗时: ${atomicTime}ms`);
console.log(`普通操作耗时: ${normalTime}ms`);

与其他语言的互操作性

C++和Rust等语言可以通过WebAssembly与JavaScript共享内存：

// Rust示例
#[wasm_bindgen]
pub fn increment_counter(shared_memory: &mut [i32]) {
    shared_memory[0] += 1;
}

内存分配策略

对于大型共享内存区域，考虑分块管理：

class SharedMemoryPool {
  constructor(totalSize, chunkSize) {
    this.buffer = new SharedArrayBuffer(totalSize);
    this.chunkSize = chunkSize;
    this.lock = new Int32Array(new SharedArrayBuffer(4));
  }

  allocate() {
    // 实现线程安全的分配逻辑
  }

  free(offset) {
    // 实现线程安全的释放逻辑
  }
}

实时系统中的应用

在需要高精度时序控制的系统中：

// 高精度定时器Worker
function timerWorker() {
  const sharedArray = new Int32Array(sharedBuffer);
  let lastTime = Atomics.load(sharedArray, 0);
  
  while (true) {
    const currentTime = performance.now();
    if (currentTime - lastTime >= interval) {
      Atomics.store(sharedArray, 0, currentTime);
      Atomics.notify(sharedArray, 0);
      lastTime = currentTime;
    }
  }
}