跳到主要内容

共享工作者线程

共享工作者线程与专用线程有什么区别？​

  • 语义: 专用工作者线程的扩展, 可被多个同源上下文 (不同窗口、不同标签页) 同时访问;
  • 复用: 相同 URL 默认共享同一实例, 可用 name 强制区分;
new SharedWorker("./sharedWorker.js");
new SharedWorker("./sharedWorker.js", { name: "foo" }); // 与上面不是同一实例

共享工作者线程提供哪些 API？​

成员作用
new SharedWorker(url, options?)创建或连接共享线程
worker.port用于通信的 MessagePort
worker.onerror错误事件
self.name线程标识符
self.importScripts(...urls)导入外部脚本
self.close()终止线程
self.onconnect新上下文连接时触发, 参数含 ports

生命周期与终止规则是什么？​

  • 阶段: 初始化 → 活动 → 终止;
  • 无 terminate(): SharedWorker 对象没有 terminate() 方法;
  • close() 语义: 只断开当前页面的连接, 其他页面仍可用;
  • 存活条件: 只要还有一个端口连接, 共享工作者线程就不会终止;

新上下文如何连接到共享线程？​

  • 触发: 每次 new SharedWorker() 都会让线程触发 connect 事件;
  • 端口: 引擎隐式创建 MessageChannel, 端口保存在 connect 事件的 ports 数组中;
// sharedWorker.js
const connectedPorts = new Set();
self.onconnect = ({ ports }) => {
  connectedPorts.add(ports[0]);
  console.log(`${connectedPorts.size} unique connected ports`);
};

// main.js
for (let i = 0; i < 5; ++i) new SharedWorker("./sharedWorker.js"); // 依次输出 1..5
  • 通信: 拿到端口后用 port.postMessage 与 port.onmessage 收发消息, 见 线程间通信;