欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

H265网页视频播放器播放H265编码录像视频文件如何减缓卡顿情况?

程序员文章站 2022-07-07 11:58:54
...

视频播放延时卡顿的问题从视频服务诞生以来就一直存在,即便是在技术发达的今天,延时卡顿问题仍然是不能完全解决的(不同视频流延时说明)。

TSINGSEE青犀视频研发团队开发的H265播放器播放录像文件时,偶尔也会出现卡顿情况。

分析问题

播放器是通过地址获取数据,然后解码再编码给浏览器渲染,排查发现再编码后的数据片段缓存较少,有时会导致录像不流畅。调试发现数据片段缓存稍大些,播放就相对流畅很多。

原始缓存:

H265网页视频播放器播放H265编码录像视频文件如何减缓卡顿情况?

调大缓存:

H265网页视频播放器播放H265编码录像视频文件如何减缓卡顿情况?

解决问题

找到H265播放器项目中DecodeWorker.js 并把缓存大小调整到160

                if (!self.pause) {
                    var frame = null;
                    let ret = -1;
                    if (!self.isFlvStream) {
                        if (self.findKeyFrame) {
                            while (self.videoQueue.length > 0) {
                                frame = self.videoQueue[0];
                                if (frame.frameType && self.videoQueue.length < 160) {
                                    self.findKeyFrame = false;
                                    break;
                                }
                                self.videoQueue.shift();
                            }
                        }
                        else {
                            if (self.videoQueue.length > 160) {
                                self.findKeyFrame = true;
                            }
                        }
                        if (self.videoQueue.length > 0) {

                            if (frame == null) {
                                frame = self.videoQueue[0];
                            }
                            ret = onProcStreamData(frame.mediaType, frame.codecId, frame.frameType,
                                frame.playTimeSec,
                                frame.samplerate, frame.channelNum, frame.bitPerSample,
                                frame.dat, frame.dat.length);
                        }
                    }
                    else {
                        frame = self.videoQueue[0];
                        ret = onProcStreamData(frame.mediaType, frame.codecId, frame.frameType,
                            frame.playTimeSec,
                            frame.samplerate, frame.channelNum, frame.bitPerSample,
                            frame.dat, frame.dat.length);
                    }
                    if (ret >= 0) {
                        self.videoQueue.shift();
                    }
                }

EasyPlayer播放器

EasyPlayer播放器是TSINGSEE青犀视频研发的H265播放器,如果有用户想将EasyPlayer播放器集成进自己的流媒体平台,也是可以的,我们提供了非常简单易用的SDK及API接口,用户通过API调用就可以非常快速地开发出属于自己的应用程序,进行第二次开发。

H265网页视频播放器播放H265编码录像视频文件如何减缓卡顿情况?