背景

Web Workers是一个API，允许在浏览器中运行后台处理任务，而不影响用户界面（UI）线程的稳定性。

Web Workers 可用于消除阻止 UI 的耗时任务，如图表生成，物理模拟或数据分析等：

使用 Web Workers

启动和终止

一个web worker 由一个文件创建，它正常情况下位于主线程之外。可以使用 JavsScript 的Worker()构造函数来创建并启动 Worker：

const worker = new Worker('worker.js');

要终止 Worker，请使用terminate()方法：

worker.terminate();

通信

Web workers 使用消息传输机制 (message-passing mechanism) 来与主线程进行通信：

• 主线程可以通过postMessage()方法将消息发送给 Worker:

worker.postMessage('Hello World!');

• Worker 可以使用onmessage处理函数来接受主线程发送的消息：

worker.onmessage = function(event) {  console.log(event.data); // Prints 'Hello Worker!'});

示例

以下代码演示了如何使用 web workers 运行一个耗时任务：

主文件（main.js）

var worker = new Worker('worker.js');// Send a message to the workerworker.postMessage('start');// Handle messages sent by the workerworker.onmessage = function(event) {  console.log('Received message from worker', event.data);};

工作者文件（worker.js）

// Receive messages from the main scriptonmessage = function(event) {  if (event.data == 'start') {    // Run expensive task    var result = doExpensiveTask();        // Send message to main script     postMessage(result);  }};