{{APIRef("Web Workers API")}}
The Worker
interface of the Web Workers API represents a background task that can be easily created and can send messages back to its creator. Creating a worker is as simple as calling the Worker()
constructor and specifying a script to be run in the worker thread.
Workers may in turn spawn new workers as long as those workers are hosted within the same origin as the parent page. In addition workers may use XMLHttpRequest
for network I/O, with the stipulation that the responseXML
and channel
attributes on XMLHttpRequest
always return null
.
Not all interfaces and functions are available to the script associated with a Worker
.
In Firefox, if you want to use workers in extensions and would like to have access to js-ctypes, you should use the {{ domxref("ChromeWorker") }} object instead.
Properties
Inherits properties from its parent, {{domxref("EventTarget")}}, and implements properties from {{domxref("AbstractWorker")}}.
Event handlers
- {{domxref("AbstractWorker.onerror")}}
- An {{ domxref("EventListener") }} called whenever an {{domxref("ErrorEvent")}} of type
error
bubbles through to the worker. This is inherited from {{domxref("AbstractWorker")}}. - {{domxref("Worker.onmessage")}}
- An {{ domxref("EventListener") }} called whenever a {{domxref("MessageEvent")}} of type
message
bubbles through the worker — i.e. when a message is sent to the parent document from the worker via {{domxref("DedicatedWorkerGlobalScope.postMessage")}}. The message is stored in the event's {{domxref("MessageEvent.data", "data")}} property.
Constructors
- {{domxref("Worker.Worker", "Worker()")}}
- Creates a dedicated web worker that executes the script at the specified URL. Workers can also be constructed using Blobs.
Methods
Inherits methods from its parent, {{domxref("EventTarget")}}, and implements properties from {{domxref("AbstractWorker")}}.
- {{domxref("Worker.postMessage()")}}
- Sends a message — which can consist of
any
JavaScript object — to the worker's inner scope. - {{domxref("Worker.terminate()")}}
- Immediately terminates the worker. This does not offer the worker an opportunity to finish its operations; it is simply stopped at once. ServiceWorker instances do not support this method.
Example
The following code snippet shows creation of a {{domxref("Worker")}} object using the {{domxref("Worker.Worker", "Worker()")}} constructor and usage of the object:
var myWorker = new Worker("worker.js"); first.onchange = function() { myWorker.postMessage([first.value,second.value]); console.log('Message posted to worker'); }
For a full example, see ourBasic dedicated worker example (run dedicated worker).
Specifications
Specification | Status | Comment |
---|---|---|
{{SpecName('HTML WHATWG', "#worker", "Worker")}} | {{Spec2('HTML WHATWG')}} | No change from {{SpecName("Web Workers")}}. |
{{SpecName('Web Workers', "#worker", "Worker")}} | {{Spec2('Web Workers')}} | Initial definition. |
Browser compatibility
Support varies for different types of workers. See each worker type's pages for specifics.
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | 4 | 3.5 | 10.0 | 10.6 | 4 |
Feature | Android | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Phone | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|
Basic support | 4.4 | 3.5 | 1.0.1 | 10.0 | 11.5 | 5.1 | {{CompatUnknown}} |
See also
- Using web workers
- Functions available to workers
- Other kind of workers: {{ domxref("SharedWorker") }} and ServiceWorker.
- Non-standard, Gecko-specific workers: {{ domxref("ChromeWorker") }}, used by extensions.