H.265 软解选型实录：CCPlayer 为什么用 WASM + Canvas，而不是 WebCodecs
在线演示：https://player.ccnvr.com
源码仓库：https://github.com/ccnvr/ccplayer
H265
H.265 在安防、教育、广电这几个圈子里基本已经是默认编码。摄像头出厂就是 H.265，同画质下码率比 H.264 省将近一半。
方案选择
1、MSE 硬解
最优方案，使用浏览器默认支持（Media Source Extensions）,目前Chrome支持h265。这种方案会调用系统GPU硬件。效果，性能最优。
2、WebCodecs
新方案，使用VideoDecoder
把系统 / 浏览器已有的解码能力封装成可调用的 API。底层实际干活的是操作系统的解码模块：
- Windows → DXVA（硬解，取决于有没有装对应扩展）
- Linux → VAAPI / VDPAU
- macOS → VideoToolbox
decode 进去的是压缩流，出来的是能画的原始帧，中间那步不在 JS 里
缺点是强制HTTPS
3、WASM + Canvas
兼容最佳方案
WebAssembly 本身不受 secure context 限制。HTTP 页面照样可以 fetch 一个.wasm、编译、执行。这是我们最终选它的直接原因，没有更复杂的理由。
画面则画在一块覆盖在 video 上方的 canvas 上。video 只负责出声和走时间，画面由 canvas 出。
CCPlayer
CCPlayer 集成了 ws-flv、http-flv、mp4、hls 的软解能力，统一天下解决h265播放问题。应该是市面上兼容性最强的播放了。
这是使用方法，非常简单：
import Player from 'ccplayer' import 'ccplayer-flv' import 'ccplayer-soft-decode' // import 即注册，之后 softDecode 默认为 'auto' new Player({ id: 'mse', url: 'http://192.168.1.10:8080/live/stream.flv', isLive: true, softDecode: 'auto', softDecodeOptions: { wasmBaseUrl: '/wasm', // 内网自托管，指向包含 decode/ 的那一层 openLog: true }, onSoftDecodeFallback (info) { console.log('已回退软解', info.reason) } })基于西瓜播放器（xgplayer）二次封装。 API 完全一致，ui完全一致。无感切换。比jessibuca和easyplayer 更加稳定可靠。api更简洁。
这里真的要吐槽一下 easyplayer和jessibuca。easyplayer API 文档乱七八糟非常不完善，还有公司logo，没人维护，样式还丑。jessibuca 收费，支持直播。免费版软解只支持到720p，api太多，太乱，都不知道怎么配置。