Game fps setTimeout setInterval requestAnimationFrame

game.fps.js

(function(global) {

function Game(after) { // @arg Boolean = false
    this.init();
    this._vsync.tick = _loopVsync.bind(this);
    this._timer.tick = after ? _loopAfter.bind(this) : _loopBefore.bind(this);
    this._interval.tick = _loopInterval.bind(this);
    document.body.innerHTML +=
        "<br />" +
        (after ? "--- After ---" : " ---Before ---");
}
Game.prototype.init  = Game_init;
Game.prototype.start = Game_start;
Game.prototype.stop  = Game_stop;

function Game_init() {
    this._beginTime = 0;

    this._vsync    = { jobs: 0, timerID: 0, loopCount: 0 };
    this._timer    = { jobs: 0, timerID: 0, loopCount: 0, mutex: false, confusion: 0, tick: null };
    this._interval = { jobs: 0, timerID: 0, loopCount: 0, mutex: false, confusion: 0, tick: null };
}
function Game_start(stop) { // @arg Integer = 0
    this._beginTime = Date.now();

    this._vsync.tick();
    this._timer.tick();
    this._interval.timerID = setInterval(this._interval.tick, 0);
    if (stop) {
        setTimeout(Game_stop.bind(this), stop * 1000);
    }
}
function Game_stop() {
    // stop timers
    if (global["cancelAnimationFrame"]) {
        cancelAnimationFrame(this._vsync.timerID);
    }
    clearTimeout(this._timer.timerID);
    clearInterval(this._interval.timerID);

    // show fps
    var elapsedTime = Date.now() - this._beginTime;
    document.body.innerHTML += [
        "",
        "vsync-fps: "       + (this._vsync.loopCount / elapsedTime * 1000).toFixed(3),
        "vsync-jobs: "      +  this._vsync.jobs,
        "timer-fps: "       + (this._timer.loopCount / elapsedTime * 1000).toFixed(3),
        "timer-jobs: "      +  this._timer.jobs,
        "timer-confusion: " +  this._timer.confusion,
        "interval-fps: "    + (this._interval.loopCount / elapsedTime * 1000).toFixed(3),
        "interval-jobs: "   +  this._interval.jobs,
        "interval-confusion: " + this._interval.confusion,
    ].join("<br />");
}

function _loopVsync() {
    ++this._vsync.loopCount;
    if (global["requestAnimationFrame"]) {
        this._vsync.timerID = requestAnimationFrame(this._vsync.tick);
    }
    //_loop(this, "_vsync");
}
function _loopBefore() {
    ++this._timer.loopCount;
    this._timer.timerID = setTimeout(this._timer.tick, 1000 / 60);
    _loop(this, "_timer");
}
function _loopAfter() {
    ++this._timer.loopCount;
    _loop(this, "_timer");
    this._timerID = setTimeout(this._timer.tick, 1000 / 60);
}
function _loopInterval() {
    ++this._interval.loopCount;
    _loop(this, "_interval");
}
function _loop(that, domain) {
    if (that[domain].mutex) {
        ++that[domain].confusion;
    }
    that[domain].mutex = true;

    for(var i = 0; i < 10000; i += 1.001) {
        _job(that, domain);
    }

    that[domain].mutex = false;
}

function _job(that, domain) {
    ++that[domain].jobs;
}

// export
global["Game"] = Game;

})((this || 0).self || global);