我正在使用video js HLS创建视频播放器来播放HLS Live视频。我正在创建16个视频播放器,并同时连接16个不同的HLS实时url。下面是创建视频元素的java脚本部分。
var video = document.getElementById("video_id");
var player = videojs(video,{hls:{ bandwidth: 102400,enableLowInitialPlaylist:true}});
player.src({
src: videoURL,
type: 'application/x-mpegURL',
withCredentials: false
});
代码运行良好,RAM使用量约为33-400MB,但问题是,随着时间的推移,内存使用量(RAM(逐渐增加,大约2-3小时后,RAM达到2GB以上,浏览器因内存问题而崩溃。
我尝试了一种方法来减少这个问题,比如在15分钟内摧毁所有玩家,创建新玩家并重新连接直播。当执行步骤时,这对代码有一定的影响——它们的RAM使用量正在减少,但大约为400-500 MB,这意味着每15分钟的周期内存使用量仍在增加,5-6小时后达到2GB,浏览器崩溃。
这是删除视频播放的代码
var videoElement = document.getElementById(video_id);
if (typeof(videoElement) != 'undefined' && videoElement != null){
var player = videojs(video_id);
player.dispose();
}
可能是什么原因,是任何缓存存储在现场播放,如果是这样,我可以如何清除内存。
为了防止其他人在这里搜索修复程序,以下是对我的帮助。运行2小时后,当直播单个hls视频时,videojs的内存占用在200MB
到250MB
之间波动。
看起来有很多参数需要探索和配置。默认值设置不正确。
window.addEventListener("offline", (e) => window.location.reload());
this.instanceId = new Date().getTime();
videojs.registerPlugin("hlsQualitySelector", qualitySelector);
this.player = videojs(
this.videoNode,
{
techOrder: ["html5", "flash", "other supported tech"],
liveui: true,
autoPlay: "muted",
controls: true,
html5: {
hlsjsConfig: {
enableWorker: true,
liveBackBufferLength: 15,
backBufferLength: 15,
liveMaxBackBufferLength: 15,
maxBufferSize: 0,
maxBufferLength: 10,
liveSyncDurationCount: 1,
},
},
},
function onPlayerReady() {
this.play();
},
);
this.player.hlsQualitySelector({ displayCurrentQuality: true });