javascript - 使用 javascript 检测设备 CPU/GPU 性能？

Question

(这个问题并不特定于 three.js，但我将以它为例)

我最近一直在使用 three.js 开发一个网络应用程序界面，并在 WebGL 和 Canvas 渲染器(用于桌面浏览器)之间编写了一些很好的回退。

但现在问题变成了如何正确检测设备能力，问题有两个方面:

1. 浏览器功能(静态功能，如 webgl/canvas):这在网络社区中主要通过使用简单的功能检测来解决。
2. 设备能力:这是困难的部分，无法直接访问设备的硬件信息，我们需要一些方法来判断我们是否应该回退到对硬件要求较低的代码。

一个值得注意的例子:Firefox mobile/Opera mobile 声称支持 WebGL，但存在错误或受设备硬件限制。

到目前为止，我提出了一些解决方法:

1. 使用通用功能作为性能指标 - 例如，触摸设备的硬件通常功能较弱。缺点:它不是面向 future 的。
2. 将已知有问题的浏览器/设备列入黑名单 - UA 嗅探将不可避免，而且很难维护。
3. 性能测试 - 因此问题是，除了运行代码和测量帧率之外，还有更好的选择吗？

或者也许不必这么难，还有其他建议吗？

Answer 1

我最终在一个项目中使用了性能测量方法，在该项目中，我们希望利用高规范 CPU/GPU 台式机以及低速设备(例如 table 和手机)上可用的 Canvas 功能。

基本上，我们从最小的场景复杂度开始，如果渲染循环花费的时间少于 33 毫秒，我们会增加复杂度(如果渲染循环稍后开始花费太长的时间，我们也会降低复杂度)。

我想在您的情况下，您可能必须运行快速 Canvas 和 webgl 性能测试，然后选择一个。花了一些时间研究这个问题后，我还没有发现一些棘手的非显而易见的技术可以更好地解决这个问题。