我们有一个包含77个左右视频缩略图的页面。当视频缩略图悬停时，视频开始在缩略图空间内播放。
在许多（8到60，具体取决于系统/浏览器）之后，它们会出现问题。视频开始播放不正确或无法播放。基本上，平坦/冗余区域全黑。在Edge中，这会在一两秒后自行纠正，但对于我们的客户来说，这是非常不受欢迎的行为。
我们通过调用pause()，删除src属性，然后使用空的load()属性调用元素上的src来暂停鼠标的每个视频，从而进行了改进，如下所示：
function pauseVideo(e) {
$('video', this).get(0).pause();
$('video', this).get(0).removeAttribute('src');
$('video', this).get(0).load();
}
这会清除一些内存，但问题仍然存在，尽管在问题变得明显之前可以播放更多视频。
我确实看起来与内存有关，并且暴露出我们看来是Microsoft浏览器内存泄漏的内容。每个视频都会增加内存使用量，内存永远不会被清除，就像在Chrome和Firefox中一样。当内存使用率接近任务管理器中的600mb到1gb（取决于系统）时，通常会出现此问题。 （Chrome总是大约在500-550兆字节左右。火狐大约在700-800兆字节左右。）
我们注意到行为开始发生时取决于视频卡的一些差异，但问题总是在某个时刻出现。
所有这些视频都显示在页面的多个位置。所以有一件事我想知道如果可以在元素之间共享视频内存。
还有一些可能相关的其他问题。在IE中，视频完全变黑，其尺寸在屏幕上发生变化，这可能会改变页面布局。
这是一个相关的问题，但它并不重复，因为它没有提供关于必须在一个页面上促进80个左右视频的问题或解决方案：How to properly unload/destroy a VIDEO element
我们正在测试IE版本11.228.17134.0和Edge版本42.17134.1.0，这两个版本目前都是最新版本。
最初所需的功能是视频在用户关闭视频时暂停在帧上，但是现在看来，如果我们必须卸载视频，我们将无法做到这一点。
我将在全天提供有关此问题的更多信息，因为它可用。
我们的团队有一个脚本，可以检测DOM元素是否在页面的可查看区域内，e.i。不在顶部上方或底部下方滚动。当用户滚动时，脚本会添加/删除一个类，并为添加了该行为的每个元素调度自定义事件。我能够利用这个系统暂停，删除和处理（垃圾收集）不在视图中的视频元素，然后在它们返回视图时重新填充它们，原始属性存储在与之关联的对象数组中每个视频/缩略图。
这将处理视频。必须使用.call()调用该函数，如：disposeVideo.call(videoElement);
var disposeVideo = function () {
this.pause();
delete(this);
$(this).remove();
}
奇怪的是，虽然delete(this)是一个hack，并且不应该在任何浏览器中工作，但它似乎适用于所有浏览器，根据我读过这个问题的评论，以及我在IE / Edge中的发现。
在IE（而不是Edge）上，这会产生减慢页面滚动速度的副作用。这是由我们的视图检查应用于页面上的80个项目，或者是否与重新下载海报（缩略图）和视频有关，因为它似乎无法有效地缓存这些资产立即（重新）可用于渲染器。
与上述相关的另一个副作用（也在IE中）是，当您滚动时，视频显示为空白，直到重新下载资源。我们选择使用分散在视频背后的图片，而不是使用海报属性来删除视频元素。这样，屏幕上永远不会有空白的视频缩略图。