FPS Sync
A time based update loop which can synchronize the FPS and frame count of 2 animations.
You can also use this to synchronize an animation between the server and the client.
Installation
npm install fps-sync
<script src="https://cdn.jsdelivr.net/gh/AspieSoft/fps-sync@1.3.2/index.js"></script>
Setup
const fpsSync = require('fps-sync');
const game = fpsSync(60 /* FPS */, Date.now() /* Start Time */);
game.update((info) => {
console.log('update logic and math');
});
game.draw((info) => {
console.log('draw an image on the canvas');
});
game.start();
game.stop(() => {
console.log('game stopped');
});
// the pause method will pause the game without stopping the loop, and will not try to resyncronize the time and catch up on updates when resumed
// notice: this method does Not synchronize updates with other instances, and is here in case anyone wants to use this module for a simple singleplayer instance
// you can run the start method to unpause the update loop
game.pause();
Usage
// update and draw info
game.update(30 /* set a custom FPS for a specific update */, ({
frames, // the number of frames run
fps, // the total fps
delta, // a number you can multiply by an interval, to maintain consistant results at a different FPS
seconds, // the number of seconds since starting (note: stop is more of a pause)
lag, // the amount of time between when the frame was called, and when this specific update was called
elapsed, // the amount of time between this update, and the last one
}) => {
});
game.update(30, (infoForThisUpdate, generalInfoForAllUpdates) => {
// the info for this update and general info for all updates have the same object structure
// infoForThisUpdate will recalculate based on the modified FPS
// generalInfoForAllUpdates uses the default FPS calculations
});
game.draw(({
frames, // the number of frames that should have passed
fps, // the default fps
seconds, // the number of seconds since starting (note: stop is more of a pause)
lag, // the amount of time between when the frame was called, and this function was called (tells you how long logic updates took)
elapsed, // the amount of time between this update, and the last one
}) => {
});
// how to stop update and draw functions
game.update(() => {
if(done){
// remove this function from the update list
return true;
}
});
game.draw(() => {
if(done){
// remove this function from the draw list
return true;
}
});
game.update(() => {
if(nothingChanged){
// if every update returns false, the draw functions will not run
// you can do this if there is nothing new to draw from this function
return false;
}
});
// merging lagging updates
game.update(true, ({delta}) => {
// if true is passed as an arg, it means you are setting merge mode to true
// by default, when updates lag behind, they are all run multiple times without a pause
// when merge is true, only one update occurs and the delta value is multiplied instead
value += 1 * delta;
});