如何正确卸载/销毁VIDEO元素 [英] How to properly unload/destroy a VIDEO element

问题描述

我正在使用实时的媒体浏览/播放应用程序，使用浏览器中的< video> 对象进行播放。

I'm working on a realtime media browsing/playback application that uses <video> objects in the browser for playback, when available.

我正在使用直接javascript和jQuery的混合，

I'm using a mix of straight javascript, and jQuery,

我关心的是内存。应用程序永远不会在窗口中重新加载，用户可以观看许多视频，因此内存管理随着时间的推移变得越来越大。在今天的测试中，我看到内存配置文件按照每个后续加载的流式传输的视频大小跳转，并且不会下降到基线。

My concern is specifically with memory. The application never reloads in the window, and the user can watch many videos, so memory management becomes a large concern over time. In testing today, I see the memory profile jumping by the size of the video to be streamed with each subsequent load, and never dropping back down to the baseline.

我尝试了以下相同的结果：

I've tried the following things with the same result:

1 - 清空包含创建元素的父容器，例如：

1 - Empty the parent container containing the created element, eg:

$(container_selector).empty();

2 - 暂停和删除与视频匹配的孩子，然后清空父容器：

2 - Pause and remove children matching 'video', and then empty the parent container:

$(container_selector).children().filter("video").each(function(){
    this.pause();
    $(this).remove();
});
$(container_selector).empty();

有没有人遇到这个问题，有没有更好的方法呢？ >

Has anyone else run into this issue, and is there a better way to do this?

推荐答案

这个解决方案被报告工作，大概是因为它会使这些视频容器对象可用于垃圾收集（见下面的注释讨论为什么删除不应该有所作为）。无论如何，您的结果可能会因浏览器而异：

This "solution" is reported to work, presumably because it would make those video container objects available for garbage collection (see the note below for a discussion of why delete shouldn't be making a difference). In any case, your results are likely to vary by browser:

$(container_selector).children().filter("video").each(function(){
    this.pause(); // can't hurt
    delete this; // @sparkey reports that this did the trick (even though it makes no sense!)
    $(this).remove(); // this is probably what actually does the trick
});
$(container_selector).empty();

---

注意：毫无疑问， delete 关键字仅用于从对象中删除属性（如其他人在注释中指出的那样）。在之前和之后将此记录到控制台，删除此行，每次都显示相同的结果。 删除这个应该什么也不做，没有任何区别。然而，这个答案继续得到一个投票，人们报告说，省略删除这个使它停止工作。也许在一些浏览器JS引擎实现 c> delete 或浏览器的删除和jQuery是什么之间的不寻常的交互这样做这个。

---

Note: There's no doubt that the delete keyword is specified only to remove properties from objects (as others have pointed out in the comments). Logging this to the console both before and after the delete this line, above, shows the same result each time. delete this should do nothing and make no difference. Yet this answer continues to receive a trickle of votes, and people have reported that omitting delete this makes it stop working. Perhaps there's strangeness in how some browser JS engines implement delete, or an unusual interaction between a browser's delete and what jQuery is doing with this.

所以，只要注意，如果这个答案解决了你的问题，如果它工作不清楚为什么会出现这种情况，而且由于任何原因也可能停止工作。

So, just be aware, if this answer solves your problem, that if it does work, it's not clear why that's the case, and it's just as likely to stop working for any number of reasons.

这篇关于如何正确卸载/销毁VIDEO元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！