A super lightweight fps meter, with near zero overhead
createFpsMeter is a function factory, it returns a new meter.
But why not a class? Last time I checked, accessing instance properties was slower than accessing variables on a near closure.
yarn add micro-fps
NPM
npm install micro-fps
If you don't use a package manager, you can access micro-fps via unpkg (CDN), download the source, or point your package manager to the url.
JS fiddle Example: https://jsfiddle.net/Victornpb/g8pra2a6/
import microFps from 'micro-fps';
function updatedUIcallback(stats){
// Update your UI
fps_div.innerHTML = stats.fps.toFixed(2) + " fps";
console.log(stats);
}
const REFRESH_RATE = 2; // update you HUD twice a second (it can be a fraction e.g.: 0.5 will compute every 2 seconds).
const fpsTick = microFps(updatedUIcallback, REFRESH_RATE); // create a tick functionThen call the returned function on every frame of your loop
// game/animation loop
setInterval(function loop(){
fpsTick(); // call on every frame
// Your game/animation logic
}, 1000/60);Callback stats object
| property | type | description |
|---|---|---|
| fps | float | The calculated frames per second |
| jitter | float | The absolute difference since the last calculated fps |
| elapsed | float | Milliseconds ellapsed since the last computation |
| frames | integer | Number of frames since the last computation |
| trigger | float | Next computation will happen at this amount of frames |
See example folder or the runkit example.
micro-fps is compiled as a collection of CommonJS modules & [ES2015 modules](http://www.2ality.com/2014/0
-9/es6-modules-final.html) for bundlers that support the jsnext:main or module field in package.json (Rollup, Webpack 2)
The micro-fps package includes precompiled production and development UMD builds in the dist/umd folder. They can be used directly without a bundler and are thus compatible with many popular JavaScript module loaders and environments. You can drop a UMD build as a <script> tag on your page. The UMD builds make micro-fps available as a window.microFps global variable.
The code is available under the MIT license.
We are open to contributions, see CONTRIBUTING.md for more info.