worker线程解码

125 次浏览 2026年 7月 15日上午11:24

## 简介
从v0.8版开始，NodePlayer.js正式支持worker线程解码。
从v1.4版开始，NodePlayer.js增加了worker线程使用WebCodecs硬解码。

我们都知道js是一个单线程的运行时，正常情况下拉流、解析、解码、渲染这些操作全部都是在主线程运行的，如果cpu单核性能足够，视频播放是流畅进行的。
但如果需要在一个页面中进行多画面直播，比如4个甚至9个，这时候单核运行就压力巨大，真的是一核有难，7核围观。

新发布的这个版本特性就是将音视频解码这种高CPU消耗在worker线程中进行，有效缓解js主线程压力，充分利用多核处理器。

适合主线程UI已经非常繁重的App，使用worker分担解码和渲染的压力。

## 使用方法
与以往版本相比，只是增加了useWorker()方法，在new之后调用。
```
  var player;
  // 0.5.28之后, 为了统一asm与wasm版本api差异,现统一采用回调格式加载.
  NodePlayer.load(() => {
	  player = new NodePlayer();
	  /**
	  * 使用worker线程解码, 适用于多画面直播, 能有效利用多核处理器
	  * 紧随 new 后调用
	  * v0.8之后可用
	  */
	  player.useWorker();
});
```
调用之后会加载NodePlayerWorker.min.js与NodePlayerWorker.min.wasm文件。如果不调用，则与v0.5版完全相同。

## 在Worker中使用WebCodecs硬解
版本更新到v1.4.0后，可以进一步在Worker中开启WebCodecs进行硬件解码，只需要加一行
```
  var player;
  // 0.5.28之后, 为了统一asm与wasm版本api差异,现统一采用回调格式加载.
  NodePlayer.load(() => {
	  player = new NodePlayer();
	  /**
	  * 使用worker线程解码, 适用于多画面直播, 能有效利用多核处理器
	  * 紧随 new 后调用
	  * v0.8之后可用
	  */
	  player.useWorker();
	  player.useWorkerWCS(); // 加这一行，v1.4之后可用
});
```

当硬件解码创建失败会自动回退软解码。

## 在线测试
http://demo.nodemedia.cn/uploads/worker/index_2x2.html

## 兼容支持
![](https://www.nodemedia.cn/doc/server/../Public/Uploads/2021-03-08/604589fddcbd0.png)
![](https://www.nodemedia.cn/doc/server/../Public/Uploads/2021-03-08/60458a0abd333.png)
WebWorker的支持度高于wasm的，因此请放心使用。

## 性能对比
### v0.8.1 不开worker播放4路720p

<video src="https://cdn.nodemedia.cn/video/QQ20210308-104205.mp4" style="width: 100%; height: 100%;" controls="controls"></video>
可以看到，当前页面cpu最大使用100%，4路画面卡顿，fps只有10-15，音视频不同步，画面滞后。

### v0.8.1 开启worker播放4路720p

<video src="https://cdn.nodemedia.cn/video/QQ20210308-103451.mp4" style="width: 100%; height: 100%;" controls="controls"></video>
可以看到，开启worker解码后，当前页面有4个worker线程，最大cpu使用400%，4路画面流畅，音视频同步，追帧时能达到60fps。

文档

worker线程解码