Question

这是一个远景 - 无论如何通过JS插件检测可怜的显卡性能？

我们为客户建立了一个视差网站，它在性能较低的机器上口吃 - 我们可以调整性能以使其更好地全面运行 - 但这当然会降低具有更高性能机器的用户的体验。

我们也可以检测浏览器版本 - 但同样的浏览器可以在低性能和高性能机器上运行 - 所以对我们的情况没有帮助

有什么想法吗？

Answer 1

requestAnimationFrame（rAF）可以帮助解决这个问题。

你可以使用rAF找出你的帧率。有关详细信息，请访问：calculate FPS in Canvas using requestAnimationFrame。简而言之，你弄清楚帧之间的时差然后除以1（例如1 / .0159s~ = 62fps）。

注意：使用您选择的任何方法，性能将被任意决定。也许每秒超过24帧的任何东西都可以被认为是“高性能”。

Answer 2

为什么不让用户决定？ Youtube（以及许多其他视频共享网站）实现了播放质量的选择器，现在是一个带有可供选择的分辨率列表的齿轮图标。会是这样的 HD | SD 或 Hi-Fi | Lo-Fi 选择器在您的应用程序环境中工作（甚至有意义）？

Answer 3

这就是“旧学校”加载屏幕变得有用的地方，你可以在前景（或隐藏起来）中呈现一些复杂的东西，如果它看起来很奇怪或者是笨拙的那么无关紧要 - 当你加载时您可以决定启用或禁用哪些效果的资源。

基本上你会使用jcage为此提到的，测试帧速率（即使用setInterval与计时器结合）。这并不总是100％可靠，但是因为如果他们的机器决定在那个例子中进行三螺旋 - 后退 - 翻筋斗（或更可能的话），你会得到一个狡猾的阅读。根据所涉及的动画，可以实时升级和降级效果 - 但这对代码来说总是比较棘手，而且你自己对情况的分析实际上有时会导致性能下降。

Answer 4

Firefox内置了不支持的图形卡列表：https://wiki.mozilla.org/Blocklisting/Blocked_Graphics_Drivers相关的help acrticle。

但是你只能在访问WebGL功能时间接测试它们......

当出现问题时，

http://get.webgl.org/troubleshooting/会将您引导至相应的浏览器提供商。检查JS代码时，您将看到他们通过

进行测试

if (window.WebGLRenderingContext) {
    alert('Your browser does not support WebGL');
}

如果您有最新的图形卡。

Answer 5

您可以考虑检查浏览器是否支持window.requestAnimationFrame，这表示您在较新的浏览器中运行。或者考虑检查jQuery.fx.interval。

然后，您可以实施自定义功能来衡量可用的处理能力。您可以尝试使用自定义缓动函数，然后可以通过.slideDown()之类的函数运行该函数，以了解可用的计算能力。

有关如何在javascript中查看效果的更多提示，请参阅此answer另一个问题。

Answer 6

如果浏览器是超现代的并且支持requestAnimationFrame，您可以实时计算动画帧速率并删除较慢机器的动画设置。这是IE 10，Firefox 4，Chrome 10和Safari 6。

你基本上会创建一个'tick'函数，该函数在requestAnimationFrame（）回调上运行，并跟踪每个tick之间经过的毫秒数。注册了这么多刻度后，您可以将其平均以确定整体帧速率。但是有两点需要注意：

当标签位于后台时，requestAnimationFrame将暂停回调 - 因此，几秒到几分钟的帧之间的单个突然延迟并不意味着它是一个慢动画。和：
只需在每个动画帧上运行JavaScript规范，就会导致整体动画速度变慢;在没有对其产生负面影响的情况下，没有办法测量类似的东西。记住，海森堡是个混蛋。

对于旧版浏览器，我不知道如何可靠地测量帧速率。您可以使用setTimeout（）来模拟它，但它不会那么准确 - 并且可能会对性能产生更大的负面影响。

Answer 7

这可能是基于风险/收益的决定。我认为你必须在这里作出重要而艰难的决定。

1）如果你决定有两个版本，你将不得不花一些时间来：

找出快速，非侵入性的测试
花时间实施
将其投入生产

你最有可能最终得到错误的实现，例如我的计算机正在运行70个chrome标签，带有1080p动画的VLC和IntellijIDEA

我的MBP，2012模型被检测为“慢”计算机的概率很高，至少现在是这样。

误报真的很难搞清楚。

2）如果你选择一个版本，你将不得不在@Patrick提到的HD和Lo-Fi之间做出选择，这在我看来也是错误的。

我建议你去谷歌分析，找出浏览器发行版（是的，我知道这可能会产生误导，但任何其他测试也是如此）并且基于此（如果大多数用户是Chrome +现代版） IE / FF采用高清版本，但是花一些时间来制定优化策略。

总有一些事情可以做得更好，更快。获得一台旧笔记本电脑，并进行优化，直到获得不错的FPS速率。这就是它，作为开发人员需要做出决定，这是你的职责。

3）如果从浏览器发行版中你发现你绝对必须使用Lo-Fi版本，那么，试着认为“降级”是值得的，并且只有在你最后的手段才能实现它。

检测显卡性能 - JS

7 个答案: