1

我正在构建一个 Gatsby 站点，并希望使用react-three-fiber. 我正在尝试将 Stats.js 添加到其中，只是为了监视（并了解它是如何工作的），就像大多数普通的 three.js 项目一样。

  • 我尝试使用react-stats，但它似乎已经过时：上次更新是 5 年前。在我发现“与 React 16 不兼容”的问题中，即使它似乎已修复，错误“需要导入 Proptypes”仍不断弹出。
  • 我试过了，在战斗了几个小时后，react-canvas-stats我无法克服来自createInstance. node_modules/react-three-fiber/web.js:183以我的经验，我可能不应该弄乱node_modules.

我不确定使用包是否是最好的主意（或者是否有更好的包我找不到它），或者我是否应该尝试stats.js从原始仓库添加（绝对不知道从哪里开始） . 或者，如果首先添加没有意义stats.js，我应该做一些完全不同的事情。或者，如果有一个非常明显的解决方案，我完全错过了！

无论如何，感谢所有答案！

4

2 回答 2

6

您可以自己制作，这是用于原始 fps：https ://codesandbox.io/s/r3f-gltf-useloader-pvriu平均 fps 涉及更多一点，但并不多。

如果你喜欢https://codesandbox.io/s/r3f-gltf-useloader-29sp2 ，你也可以使用简单的threejs stats

我今天将其添加到 drei：https ://github.com/react-spring/drei

编辑：

它在里面，你可以从 'drei' 导入 { Stats } 并将其粘贴到场景中。

于 2020-04-30T08:04:39.687 回答
1

看看react-fps-stats。为我完成了这项工作。

如果您只希望 fps 用于开发目的，您可以考虑使用内置的Chrome Devtools FPS Meter。

于 2020-04-30T03:55:50.993 回答