Graphics Reference
In-Depth Information
Determining
the
frame
rate
for
your
scene
When you create large Three.js applications with many objects and animations, it is
good to keep an eye on the frame rate at which the browser can render your scene.
You can do this yourself using log statements from your animation loop, but luckily,
there is already a good solution available that integrates great with Three.js (which
isn't that strange since it was originally written for Three.js).
Getting ready
For this recipe, we'll use the
stats.js
JavaScript library that you can download
from its GitHub repository at
https://github.com/mrdoob/stats.js/
.
To use this library,
you have to include it at the top of your HTML file such as this:
<script src="../libs/stats.min.js"></script>
We've also provided a ready to use example for this recipe. If you open the
01.06-determine-framerate.html
file in your browser, you can directly see
how this library shows the current framerate, which you can see at the top-left of the
browser, as shown in the following screenshot:
Let's take a look at the steps you need to take to add this to your Three.js application.
