javascript - Chrome 中的 FPS 上限为 60fps

标签 javascript performance google-chrome canvas frame-rate

我一直在使用 JavaScript 在 Canvas 上做一些工作,我注意到 Chrome 中的 FPS 似乎上限为 60fps,直到打开检查器(通过右键单击并单击“检查元素”访问开发工具) ).

如果我在其他浏览器中运行我自己的代码,则没有 FPS 问题,同样,如果我在检查器工具打开时在 Chrome 中运行,也没有问题,它会立即达到每秒 120 帧。

作为展示实际示例的方式,请查看此页面:http://mbostock.github.io/d3/talk/20111018/collision.html

如果我在没有打开检查器工具的情况下查看此页面,FPS 图表显示每秒 40 到 60 帧。然而,一旦检查器打开,FPS 立即再次跳到 120 FPS,并且在视觉和物理上更加灵敏。

我真的很难理解为什么会这样,理想情况下我希望我的代码像检查器窗口打开一样运行。本质上,处理时间似乎大幅减少。

这是在非调试环境中执行的代码的已知限制吗?

任何见解将不胜感激,谢谢:)

最佳答案

在阅读了 Cuberto 的发现后进一步试验后,这似乎是 Chrome 和双显示器设置的错误。

正如 Cuberto 所建议的,我尝试将窗口的大小调整得更小一些,这使得 FPS 恢复了。即使没有最大化屏幕,但它仍然跨越大部分屏幕,它也会达到最大 FPS。

奇怪的是,我禁用了我的第二台显示器,然后将 Chrome 重新设置为最大化状态,一切正常。

一旦我重新启用我的第二台显示器,FPS 再次下降,所以这似乎是问题所在。

更新:似乎其他人在使用双显示器时遇到了同样的问题(见评论):Why would Chrome cap frame rate at 30fps?

关于javascript - Chrome 中的 FPS 上限为 60fps,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20482667/

相关文章:

google-chrome - 谷歌浏览器升级到版本76后测试失败

javascript - 使用 hapi 从 NodeJS 服务器下载文件

javascript - 数组拼接正在创建一个空白数组

OOP 的 JavaScript 命名空间和模式

javascript - 我的点击事件功能在某些情况下停止工作,我找不到这段代码在哪里失败

c# - 为什么将 List<T>.AddRange 方法设为通用方法会影响性能?

c++ - 多线程会提供任何性能提升吗?

javascript - React Native - Animated.View 与常规 View 组件之间的性能差异

css - Flex 高度在 Chrome 中不起作用

html - Chrome 为行内元素添加了额外的高度