加载/卸载HTML5 <video>时，iOS Safari存在内存泄漏问题

Question

我开发了一个iPad应用，其中包含多个UIWebView，并使用以下HTML和JavaScript。由于iPad一次只能播放一个视频，因此我在特定的web视图获得焦点之前不加载视频。

这是通过在UIWebView上调用stringByEvaluatingJavaScriptFromString方法来实现的，将调用JS方法getFocus()发送到该方法中。同样，在不再需要Web视图时，我调用lostFocus()以卸载视频。这使得另一个UIWebView可以播放另一个视频。

到目前为止，一切都很好。一切都运行完美。除了一件事： 这会导致内存泄漏。每当查看时发生。

我尝试重新加载UIWebView（而不是使用JS卸载视频），但那并没有起作用。我也尝试了无数种不同的JavaScript变体、标签变体等。

<div id="videoDiv"></div>

<script type="text/javascript">
    var movieDiv = document.getElementById('videoDiv'),
        movieHtml = '<video id="video" src="../Documents/<%= VideoFileName %>" width="768" height="911"></video>';

    var gotFocus = function () {
        movieDiv.innerHTML = movieHtml;
        var movie = document.getElementById('video');
        movie.play();
        movie.addEventListener('pause', function () {
            movie.currentTime = 0;
            movie.play();
        }, false);
    };
    var lostFocus = function () {
        movieDiv.innerHTML = '';
    };
</script>

- Simeon

Answer 1

我终于解决了这个问题！解决方案是清空src并“加载”一个不存在的视频。这不会导致内存泄漏。看一下：

<div id="videoDiv"></div>

<script type="text/javascript">
    var movieDiv = document.getElementById('videoDiv'),
        movieHtml = '<video id="video" src="" width="768" height="911"></video>';

    movieDiv.innerHTML = movieHtml;
    var movie = document.getElementById('video');

    var gotFocus = function () {
        movie.src = '../Documents/<%= VideoFileName %>';
        movie.load();
        movie.play();
        movie.addEventListener('pause', function () {
            movie.currentTime = 0;
            movie.play();
        }, false);
    };
    var lostFocus = function () {
        movie.src = '';
        movie.load(); // This line may be removed, see comments
    };
</script>

- Simeon

---

我遇到了完全相同的问题，内存泄漏非常严重，Chrome不喜欢放弃资源。 浏览器确实不喜欢被视为无状态应用程序。 感谢你发现了这个问题并回答了自己的问题。 +1 - Bodman

简单而有效。值得注意的是，在我的测试中，我没有看到仅设置src=''和设置src然后调用.load()之间的任何区别。因此，您可能可以将该行删除。 - Jason Kester

这似乎对<audio>标签也适用（而且也不需要调用.load() - 尽管我不知道这是否适用于<audio>, 但仍然适用）。 - Woodgnome

我有一个应用程序，在iOS6中运行良好，但在iO7一段时间后停止播放视频。使用这个技巧已经解决了问题！ - Ben Clayton

这在我的桌面版Chrome上似乎也有效！想要看它工作的人可以访问：http://jsfiddle.net/GhS2Z/3/当该行被注释掉时，您可以在任务管理器中看到选项卡的内存增加。 - Matt Derrick