Worklet

这是 实验性技术
检查 浏览器兼容性表格 在生产中使用这之前。

Worklet interface is a lightweight version of Web 工作者 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.

Worklet types

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 描述 Location 规范
PaintWorklet

For programmatically generating an image where a CSS property expects a file. Access this interface through CSS.paintWorklet .

Chrome: Main thread
Gecko: Paint thread
CSS Painting API
AudioWorklet For audio processing with custom AudioNodes. Web Audio render thread Web 音频 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()
Adds the script module at the given URL to the current worklet.

规范

规范 状态 Comment
Worklets Level 1
The definition of 'Worklet' in that specification.
工作草案

浏览器兼容性

更新 GitHub 上的兼容性数据
Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
Worklet
Chrome 65 Edge 79 Firefox 不支持 No
注意事项 Disabled
No
注意事项 Disabled
Available only in Firefox Nightly.
Disabled This feature is behind the dom.worklet.enabled preference (needs to be set to true ). To change preferences in Firefox, visit about:config.
IE 不支持 No Opera 52 Safari 不支持 No WebView Android 65 Chrome Android 65 Firefox Android 不支持 No
注意事项 Disabled
No
注意事项 Disabled
Available only in Firefox Nightly.
Disabled This feature is behind the dom.worklet.enabled preference (needs to be set to true ). To change preferences in Firefox, visit about:config.
Opera Android 47 Safari iOS 不支持 No Samsung Internet Android 9.0
addModule
Chrome 65 Edge 79 Firefox 不支持 No
注意事项 Disabled
No
注意事项 Disabled
Available only in Firefox Nightly.
Disabled This feature is behind the dom.worklet.enabled preference (needs to be set to true ). To change preferences in Firefox, visit about:config.
IE 不支持 No Opera 52 Safari 不支持 No WebView Android 65 Chrome Android 65 Firefox Android 不支持 No
注意事项 Disabled
No
注意事项 Disabled
Available only in Firefox Nightly.
Disabled This feature is behind the dom.worklet.enabled preference (needs to be set to true ). To change preferences in Firefox, visit about:config.
Opera Android 47 Safari iOS 不支持 No Samsung Internet Android 9.0

图例

完整支持
完整支持
不支持
不支持
实验。期望将来行为有所改变。
实验。期望将来行为有所改变。
见实现注意事项。
用户必须明确启用此特征。
用户必须明确启用此特征。

另请参阅

  1. Worklet
  2. 方法
    1. addModule()