html - 找到 FPS 以使用不同的视频 FPS 截取屏幕截图？

我正在构建一个视频渲染引擎，但遇到了一个问题。我想确定截屏的速度。

目前，我将速率设置为 25 fps。从中，我可以确定总截图，例如，一个 10 秒的视频将是 250 个截图。

for (let i = 0; i < 250; i++ {
  //... i / 25 fps is what I set the HTML 5 video to be
  //... this means every 0.04s or 40ms a screenshot is taken
}

问题是在我的编辑器中，用户可能会将 25 fps 视频与 30 fps 视频结合起来。我发现 30 fps 视频有时会断断续续，因为自然速率会是i / 30这意味着它需要每 0.033 秒或 33 毫秒进行一次屏幕截图。

我正在尝试想办法解决这个问题。我想更多地了解如何解决这个问题。

至于我现有知识的解决方案，我只能想到两个。

确保添加到编辑器的每个视频都以 25fps 重新编码，这仍然可能导致问题和问题，因为删除帧可能会导致卡顿，而添加帧是不可能的。
在截屏时具有可变帧速率，因此当视图中的视频为 30fps 时，我可以更改截屏机制的速率。当顶部的图层使用 25 fps 的动画帧速率，或者如果它与帧速率为 25 的视频并排放置时，就会出现问题。

我能想到的两种解决方案都不是最好的。所以我想问问最了解这个问题并愿意分享一些知识的人。

最后，似乎浏览器在处理这方面做得很好，这告诉我这是可能的。这是应用程序的屏幕录像https://share.getcloudapp.com/KouwpkwE第一次运行有点慢，但第二次使用 30 帧速率在后台展示视频，然后使用顶部的抽奖动画帧速率为 25。

当试图以固定的 25 帧逐帧捕获此帧时，我遇到了问题。有什么技术可以解决这个问题吗？

谢谢

标签： htmlhtml5-videorendervideo-processingframe-rate