在此页

• Worklet types
• 特性
• 方法
• 规范
• 浏览器兼容性
• 另请参阅
• 相关话题

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

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:

名称	描述	定位	规范
PaintWorklet	For programmatically generating an image where a CSS property expects a file. Access this interface 透过 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.

规范

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

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	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 ). 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 ). 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 ). 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 ). To change preferences in Firefox, visit about:config.	Opera Android 47	Safari iOS 不支持 No	Samsung Internet Android 9.0

图例

完整支持

完整支持

不支持

不支持

实验。期望将来行为有所改变。

实验。期望将来行为有所改变。

见实现注意事项。

用户必须明确启用此特征。

用户必须明确启用此特征。

另请参阅

• Houdini: Demystifying CSS on Google Developers (May 2016)
• AudioWorklet :: What, Why, and How on YouTube (November 2017)
• Enter AudioWorklet on Google Developers (December 2017)
• Animation Worklet - HTTP203 Advent on YouTube (December 2017)

元数据

• 最后修改： Apr 16, 2019

相关话题

1. Worklet
2. 方法

   1. addModule()