如何通过javascript更改html5视频的src而不会崩溃铬或泄漏内存？

Question

我正在开发仅在Chrome上运行的应用程序.

我需要能够从播放视频切换源.

我用javascript(和jQuery)来改变src属性:

$fullscreenVideo.get(0).src = '/video/' + name + '.mp4'; // crash here
$fullscreenVideo.get(0).load();
$fullscreenVideo.get(0).play();

它工作了几次,但我的chrome(尝试测试版和开发频道)最终崩溃(页面变得无法响应).

如果我尝试创建一个新元素,在前面的代码块前面加上:

$fullscreenVideo.remove();
$fullscreenVideo = $('<video id="video-fullscreen" width="800" height="600" loop="loop"></video>').appendTo("#page-fullscreen > div.fullscreen");

每个视频开关都可以将RAM增加20Mo,而不会退缩.

有没有办法跟踪/防止Chrome崩溃和src更新？有没有办法强制释放内存？

Answer 1

我也遇到过同样的问题。
我在一些论坛上读到这是 chrome 的内存泄漏错误（有人说这只是在 chrome 8 中发生，在 chrome 6 中工作正常，但我没有测试它）。

我还读到，睡眠有帮助。我尝试过，确实如此，如果我在更改 url 属性之前进行睡眠并调用 load() ，则崩溃次数会减少。但在多次更改后仍然继续崩溃。

然后，我尝试使用 setTimeout （与睡眠不同，它不会占用 CPU，从而可以自由地进行 chrome 的工作）。

现在它正在发挥作用。尝试看看我的代码是否有帮助。

var videoChangingPending = false;
function changeMovieSource(url, title){

        var $video = $('#video');
        try {
            document.getElementById('video').src = url;
        }
        catch (e) {
            alert(e);
        }     

        $video.attr('autoplay', 'true');
        $video.data('currentTitle', title);

        document.getElementById('video').load();

        videoChangingPending = false;
}    

function startPlayer(url, title) {

        if(videoChangingPending == true) 
            return;



        document.getElementById('video').pause();


        videoChangingPending = true;
        var changeMovieCallback = function(){ changeMovieSource(url, title);}
        var t = setTimeout(changeMovieCallback, 800);

}