为什么整个屏幕与窗口与单个选项卡的屏幕录制会导致文件大小显着不同？答案

【问题标题】：Why does screen recording of the entire screen vs a window vs a single tab result in significantly different file sizes?为什么整个屏幕与窗口与单个选项卡的屏幕录制会导致文件大小显着不同？
【发布时间】：2021-08-05 22:15:16
【问题描述】：

我正在将屏幕捕获集成到我正在扩展的框架中。我通过 getDisplayMedia 方法请求屏幕的 MediaStream 并使用RecordRTC library 记录它。 Firefox 和 Chrome 都允许用户指定共享的具体内容，例如整个屏幕、特定窗口或单个选项卡（仅限 Chrome）。我注意到这里的选择会显着影响生成的视频文件大小。下面的结果来自 30 秒的记录，其中浏览器窗口填满了整个屏幕。

铬：

整个屏幕：3.44 MB

窗口：0.81 MB

标签：0.15 MB

火狐：

整个屏幕：5.23 MB

窗口：3.56 MB

当然，当录制与整个屏幕相对的窗口时，分辨率会稍微变小。就像 Firefox 录制一样：整个屏幕 = 2560x1440 和窗口 = 2488x1376，但我认为这不会有太大的不同。

我尝试查看 Chromium 源代码（因为它是开源的并且基于 Chrome）以找出不同选项之间的区别，但似乎无法弄清楚发生了什么。我的 Google 搜索也没有一个成功。

有谁知道造成这些巨大差异的原因是什么？

如果有什么不同的话，我使用的是 Ubuntu 20.04。

【问题讨论】：

窗口有多大（与整个屏幕相比）？
窗口是屏幕上的最大尺寸，因此与整个屏幕的尺寸大致相同（唯一的区别是Ubuntu中的任务栏和顶部栏）。我认为这不应该有这么大的区别，对吧？
用这些信息更新了我的问题。

标签： javascript google-chrome firefox screen-capture get-display-media

【解决方案1】：

这是因为当你录制窗口或选项卡时，浏览器负责内容的呈现。所以它知道什么时候画了新的东西，什么时候什么都没有画。

您可以在 Chrome 中清楚地看到这一点，他们甚至会在标签捕获的 VideoTrack 上 5 秒后触发 mute 事件，其中没有任何动画。

因此，他们知道没有任何新内容被绘制，他们不会将任何内容传递给流，而是创建一个持续时间为很长时间的单帧。

但是，在捕获桌面时，它们不再负责渲染，也不知道是否发生了变化：它们必须将每一帧都作为新帧传递。

【讨论】：

哇，这听起来很合乎逻辑。感谢您的解释。与 Firefox 相比，Chrome 似乎在跟踪事件不多的情况下做得更好。
是的，它实际上是各种错误的根源，所以我不会对他们将来改变它感到惊讶。