This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The Worklet
interface is a lightweight version of Web Workers
and gives developers access to low-level parts of the rendering pipeline. With Worklets, you can run JavaScript and WebAssembly code to do graphics rendering or audio processing where high performance is required.
Worklets are restricted to specific use cases; they cannot be used for arbitrary computations like Web Workers. The Worklet
interface abstracts properties and methods common to all kind of worklets, and cannot be created directly. Instead, you can use one of the following classes:
Name | Description | Location | Specification |
---|---|---|---|
PaintWorklet | for defining how custom CSS properties are being rendered, accessible through CSS.paintWorklet
|
Chrome: Main thread Gecko: Paint thread | CSS Painting API |
AudioWorklet | for audio processing with custom AudioNodes | Web Audio render thread | Web Audio API |
AnimationWorklet | for creating scroll-linked and other high performance procedural animations | Compositor thread | CSS Animation Worklet API |
LayoutWorklet | for defining the positioning and dimensions of custom elements | CSS Layout API |
For 3D rendering with WebGL, you don't use Worklets. Instead, you write Vertex Shaders and Fragment Shaders using GLSL code, and those shaders will then run on the graphics card.
The Worklet interface does not define any properties.
Worklet.addModule()
Specification | Status | Comment |
---|---|---|
Worklets Level 1 The definition of 'Worklet' in that specification. | Working Draft |
Desktop | ||||||
---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | |
Basic support | 65 | No | Yes | No | 52 | No |
addModule
|
65 | No | 63 | No | 52 | No |
Mobile | |||||||
---|---|---|---|---|---|---|---|
Android webview | Chrome for Android | Edge Mobile | Firefox for Android | Opera for Android | iOS Safari | Samsung Internet | |
Basic support | 65 | 65 | No | Yes | 52 | No | Yes |
addModule
|
65 | 65 | No | 63 | 52 | No | Yes |
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Worklet