这篇文章点赞+关注+收藏=了解到这个时代不管是做游戏还是做普通的网页，基本上都离不开动画。提到动画，第一个想到的概念就是“帧”。这是一个用来衡量和描述动画流畅程度的单位。Three.js中还有一个用于检测帧速率(FPS)的工具，称为Stats.js。该工具由Three.js的作者开发。使用方法很简单，常用的方法就那么几个。本文使用该工具来检测一个简单动画的帧数。动手编码ImportStatsStats.js已经包含在使用npminstall三下载的依赖包中。您可以像这样将Stats导入到项目中importStatsfrom'three/examples/jsm/libs/stats.module.js'以使用Stats要使用Stats，需要执行以下步骤：实例化Stats并设置初始面板stats.setMode(0).传入panelid(0:fps,1:ms,2:mb)设置监视器的位置在页面中添加监视器刷新帧数stats.update()代码如下//创建一个performancemonitorletstats=newStats()//设置监控面板，传入面板id(0:fps,1:ms,2:mb)stats.setMode(0)//设置监控位置stats.domElement。style.position='absolute'stats.domElement.style.left='0px'stats.domElement.style.top='0px'//给页面添加监听document.body.appendChild(stats.domElement)functionrender(){//更新帧数stats.update()//渲染界面renderer.render(scene,camera)requestAnimationFrame(render)}render()点击面板时，也可以切换监听类型设置初始显示类型。另一种方法是使用setMode设置除了初始显示的类型外，还可以使用showPanel进行设置。例如初始显示类型设置为ms，则传入1即可。stats.showPanel(1)更新监控数据的另一种方式是除了使用update更新监控数据外，还可以使用begin和end的组合变化。stats.begin()//动画或其他要监控的代码之间stats.end()开始和结束可以夹在要统计的代码之间，它们会帮你计算这段代码执行的平均帧数。完整代码代码仓库?Three.jsperformancemonitorStats推荐阅读+关注+收藏=学习了代码仓库
