近期在做H5项目时,用户反映用H5页面查看视频时,多打开几次或切换多次就出现内存奔溃,视频区域直接显白的情况。
(我自己的电脑测试多轮都没有这个现象,后面才发现是性能和操作系统比较好才不会,一般的电脑还是会的。)
通过侦测进程的内存占用,多点击几次视频播放,内存占用一直在逐步上升,由开始的100M左右上升到600M左右,没有减少的趋势。
在查看w3school.网站的video对象、标签的各项属性后,使用了removeAttribute方法也没有用。后面还是简单粗暴,将video的src属性=null,再让父级清空自己,这样内存得到了释放。圆满的解决了多次打开视频导致内存飙升的问题。
具体的代码是:
$('#videoplayer')[0].pause();
$('#videoplayer')[0].src=null;
$('#videoplayer').parent().empty();