javascript - 如何在更改时间时强制视频刷新事件帧？

Question

在使用 HTML5 视频播放器时，我注意到奇怪的行为:

当使用时间轴上的小 handle 并将其拖动时(基本上更改了 currentTime 变量)，显示的帧不会相应更新。只有当我松开 handle ，或者相当缓慢地移动 handle 时，当前显示的帧才会不时更新。

如何强制视频播放器更快地更新帧，以便我可以流畅地在视频中跳转？

Answer 1

要显示您将时间线拖动到的帧，视频播放器必须能够转到您当时所在的位置，请求并下载视频文件的相关部分，对其进行解码然后显示.

实际上，这对于大多数玩家(尤其是最终用户)来说并不实用。

您将在许多视频服务中看到的解决方法是创建一组视频缩略图，通常是在对视频进行转码以准备进行流式传输时。

这是一个小得多的文件，并且各个缩略图是独立的 - 即它们不依赖于任何先前或后续帧来解码和显示它们，这意味着可以更快地访问和获取它们。

例如，这组缩略图可能在视频中每 5 秒点有一个帧，当用户沿着缩略图线扫描时，可以更容易地访问和显示它们。