无插件H5播放器EasyPlayer.js创建多个以上播放实例会卡顿且页面黑屏如何处理?
随着互联网技术的不断进步,HTML5逐渐取代了传统的HTML4,成为现代网站开发不可或缺的一部分。HTML5不仅简化了标记语言的复杂度,还引入了许多新的API和元素,极大地丰富了网页的表现力。特别是在多媒体领域,HTML5提供了原生支持音频和视频播放的功能,使得开发者无需依赖第三方插件如Flash,就可以轻松创建出功能强大的媒体播放器。
用户反馈播放器创建多个以上播放实例会非常卡顿,还会导致页面黑屏。
例如H.265,1280*720,wasm肯定会卡顿的,建议降低分辨率。还需要增大videoBuffer的大小。
1、可能存在的问题
- 分辨率过高。
- 带宽是否跟得上。
- 是否是H265编码。
2、自查
监听下stats事件,查看fps是否达到了预期的值。
3、H.265优化方案
-
降低分辨率。
-
增大videoBuffer大小,一般1s,2s,3s都是可以的。
-
设置hasAudio为false,不demux和decode音频数据。
-
如果是https情况下设置useWCS为true。
-
如果是http情况下设置useMSE为true。
-
某些显卡在支持OffscreenCanvas上面会存在问题,所以谨慎使用。
EasyPlayer.js H5播放器,是一款能够同时支持HTTP、HTTP-FLV、HLS(m3u8)、WS、WEBRTC、FMP4视频直播与视频点播等多种协议,支持H.264、H.265、AAC、G711A、Mp3等多种音视频编码格式,支持MSE、WASM、WebCodec等多种解码方式,支持Windows、Linux、Android、iOS全平台终端的H5播放器,使用简单,功能强大。