Web Workers API

通过使用 Web Workers,Web 应用程序可以在独立于主线程的后台线程中,运行一个脚本操作。这样做的好处是可以在独立线程中执行费时的处理任务,从而允许主线程(通常是 UI 线程)不会因此被阻塞/放慢。

Web Workers 概念与用法

使用构造函数(例如,Worker())创建一个 worker 对象,构造函数接受一个 JavaScript 文件 URL — 这个文件包含了将在 worker 线程中运行的代码。worker 将运行在与当前 window不同的另一个全局上下文中,这个上下文由一个对象表示,标准情况下为DedicatedWorkerGlobalScope (标准 workers 由单个脚本使用; 共享 workers 使用SharedWorkerGlobalScope (en-US))。

你可以在 worker 线程中运行任意的代码,但注意存在一些例外:你不能直接在 worker 线程中操纵 DOM 元素;或使用window 对象中的某些方法和属性。大部分 window 对象的方法和属性是可以使用的,包括 WebSockets (en-US),以及诸如 IndexedDB 和 FireFox OS 中独有的 Data Store API 这一类数据存储机制。更多信息请参见: Functions and classes available to workers (en-US)

主线程和 worker 线程相互之间使用 postMessage() 方法来发送信息,并且通过 onmessage 这个 event handler 来接收信息(传递的信息包含在 message 这个事件的data属性内) 。数据的交互方式为传递副本,而不是直接共享数据。

worker 可以另外生成新的 worker,这些 worker 与它们父页面的宿主相同。此外,worker 可以通过 XMLHttpRequest 来访问网络,只不过 XMLHttpRequestresponseXMLchannel 这两个属性的值将总是 null

除了专用 worker 之外,还有一些其他种类的 worker:

  • Shared Workers 可被不同的窗体的多个脚本运行,例如 IFrames 等,只要这些 workers 处于同一主域。共享 worker 比专用 worker 稍微复杂一点 — 脚本必须通过活动端口进行通讯。详情请见SharedWorker
  • Service Workers 一般作为 web 应用程序、浏览器和网络(如果可用)之间的代理服务。他们旨在(除开其他方面)创建有效的离线体验,拦截网络请求,以及根据网络是否可用采取合适的行动,更新驻留在服务器上的资源。他们还将允许访问推送通知和后台同步 API。
  • Chrome Workers 是一种仅适用于 firefox 的 worker。如果您正在开发附加组件,希望在扩展程序中使用 worker 且可以访问 js-ctypes,那么可以使用 Chrome Workers。详情请见ChromeWorker
  • 音频 Workers可以在网络 worker 上下文中直接完成脚本化音频处理。

备注: 根据网络 worker 规范,worker 错误事件不应该冒泡(参见 Firefox bug 1188141)。该规范已在 Firefox 42 中实现。

Web Worker 接口

AbstractWorker (en-US)

抽象属性和方法是所有类型的 worker 中常用的(例如WorkerSharedWorker

Worker

表示正在运行的 worker 线程,允许你将信息传递到正在运行的 worker 程序代码。

SharedWorker

表示一种可以同时被多个浏览器环境访问的特殊类型的 worker。这些浏览器环境可以是多个 window, iframes 或者甚至是多个 worker.

WorkerGlobalScope

表示任意 worker 的通用作用域(对于正常的网页类容来说与Window 有相同的作用)。不同类型的 worker 都有从接口继承作用于对象,并且可以添加更多特定功能。

DedicatedWorkerGlobalScope

表示一个专用 worker 的作用域,继承自WorkerGlobalScope,且可添加一些特有的功能。

SharedWorkerGlobalScope (en-US)

表示一个共享 worker 的作用域,继承自WorkerGlobalScope,且可添加一些特有的功能。

WorkerNavigator (en-US)

表示用户代理(客户端)的身份和状态。

示例

我们创建了几个简单的 demos 以演示基本用法:

你可以在使用 web workers中找到有关这些 demos 是如何工作的更多信息。

规范

Specification
HTML Standard
# workers

相关链接