micro-fps

Software
Cover image

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.

Installation

Yarn

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.

Usage

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 function

Then 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

micro-fpsĀ is compiled as a collection ofĀ CommonJSĀ modules & [ES2015 modules]([http://www.2ality.com/2014/0](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.

License

The code is available under theĀ MITĀ license.

Contributing

We are open to contributions, seeĀ CONTRIBUTING.mdĀ for more info.

View project on GitHub

image GitHub - victornpb/micro-fps: A super lightweight fps meter, with near zero overhead for mission critical loops and animations\ A super lightweight fps meter, with near zero overhead for mission critical loops and animations - GitHub - victornpb/micro-fps: A super lightweight fps meter, with near zero overhead for mission c...\ https://github.com/victornpb/micro-fps