SharedArrayBuffer与Atomics是前端多线程图像处理的关键组合，通过共享内存和原子操作实现零拷贝并发处理，但需COOP/COEP跨域隔离策略支持且Safari暂不兼容。
SharedArrayBuffer 配合 Atomics 是前端实现高性能多线程图像处理的关键组合。它绕过主线程阻塞，避免 postMessage 序列化开销，让多个 Worker 直接并发读写同一块像素内存，适合卷积、灰度转换、直方图均衡等计算密集型算子。
图像数据准备：共享内存布局设计
图像数据需以 TypedArray 形式映射到 SharedArrayBuffer，推荐使用 Uint8ClampedArray（兼容 Canvas 像素格式）或 Uint32Array（RGBA 打包）。
- 创建足够容纳整张图像的共享缓冲区：例如 1920×1080 RGBA 图像需 1920 × 1080 × 4 = 8,294,400 字节，即
new SharedArrayBuffer(8294400) - 主线程中构建视图：
const pixels = new Uint8ClampedArray(sharedBuffer)，并用 canvas 或 ImageData 初始化数据 - 将
sharedBuffer通过postMessage(buffer, [buffer])传给 Worker —— 注意必须带转移列表，否则无效
分块并行处理：避免竞争与负载不均
不要让所有 Worker 同时操作整个数组；应划分图像区域（如按行、按块），每个 Worker 负责独立内存段，减少 Atomics 同步压力。
- 例如将图像分为 4 个水平条带，Worker 0 处理第 0–269 行，Worker 1 处理 270–539 行……每行像素起始偏移可计算为
row * width * 4 - 若需跨区域操作（如 3×3 卷积），预留边缘缓冲区或采用“重叠分块 + 原子标志位协调”策略
- 可用
Atomics.store(pixelsView, offset, value)安全写入，但仅在真正需要跨 Worker 协作写入时才用（如全局最大值统计）
原子同步场景：计数器、信号量与等待唤醒
当算子涉及聚合结果（如均值、阈值统计）、资源协调（如双缓冲切换）或条件等待时，必须使用 Atomics 提供的原子原语。
- 计数器累加（如非零像素计数）：
Atomics.add(counterView, 0, 1)—— 不可拆成 load + if + store - 设置完成标志：
Atomics.or(flagView, 0, 1)置位，主线程用Atomics.wait(flagView, 0, 0)阻塞等待 - Worker 处理完后调用
Atomics.notify(flagView, 0, 1)唤醒主线程，避免轮询 - 注意：wait/notify 必须配合
Atomics.load()检查当前值，且被等待位置初始值不能为 NaN 或非整数
安全与兼容性强制前提
SharedArrayBuffer 在现代浏览器中默认禁用，未启用跨域隔离（COOP/COEP）将直接报错 SharedArrayBuffer is not defined。
- 服务端必须返回两个响应头：
Cross-Origin-Opener-Policy: same-originCross-Origin-Embedder-Policy: require-corp - 本地开发时可用
npx serve -l 8080 --cors或配置 webpack devServer 的 headers - Safari 当前（截至 iOS 17.6 / macOS 14.6）仍不支持 SharedArrayBuffer，需降级为 postMessage + Transferable 或提示用户换浏览器
