CODEWITHSUNDEEP
javascript
Sir
Sir

Reputation: 8277

calculating FPS in Javascript less than 1 millisecond

Is it possible to measure time gaps less than 1 milliseconds that is supported in all browsers i know of only one way which is in Chrome.

The chrome method : window.performance.now()

Currently i do FPS measurements in millisecond time spaces, but if less than 1ms passes i get infinity because the two numbers are rounded to nearest millisecond so they are the same value.

Does any one know a cross browser function calculate less than 1 millisecond time gaps in javascript?

Upvotes: 7

Views: 1952

Answers (3)

Steven Lu
Steven Lu

Reputation: 43547

Here's how you get accurate measurements without an accurate timer, so long as what you're timing occurs often, which I'm hoping they do in your case.

Average/aggregate the imprecise measurements of the duration of your event. A snippet out of one of my projects:

        var start = Date.now();
        ... (stuff to be timed)
        var now = Date.now();

        if (DEBUG.enabled) {
            var profile_this_iter = now - start;
            profile += (profile_this_iter - profile) * 0.02;
        }

Each new value measures nudges your reading closer to it by a factor of 0.02. Obviously you'll want to tweak that a bit. This will allow you to read an average that hovers around 0.5ms if you read a duration of 1ms half the time and 0ms half the time (with a 1ms resolution timer).

This is obviously not a replacement for a proper higher resolution timer. But I use this simple algorithm to give my javascript projects a non-crappy FPS reading. You get a damping factor that you can tweak depending on if you want more accuracy or more immediate response to changes. Considering the simplicity of this one, you'd be hard pressed to find a more elegant algorithm to provide you a good representation without any improved input data. One of the ways to enhance it would be to adjust the approach factor (that 0.02 constant) based on the frequency of sampling itself (if that changes), this way a slower measured rate could be made to converge more quickly than with a fixed value.

Upvotes: 3

Alvin Wong
Alvin Wong

Reputation: 12440

There is actually another way to calculate the fps, which may be a way to go around this issue. It is to count the actual number of frames in a second, which should be quite accurate, I think.

var fpsStart = new Date().getTime();
var fpsCounting = 0;
var fps = 0;
start_the_first_frame();

// Loop
function update(){
    do_time_consuming_stuff();
    fpsCounting++;
    var thisFrame = new Date().getTime();
    if(thisFrame - fpsStart >= 1000){
        fpsStart += 1000;
        fps = fpsCounting;
        fpsCounting = 0;
    }
    request_next_animation_frame();
}

P.S. just typed right here, not tested, may require slight changes.

I remember seeing a way like this in lwjgl tutorial...

Also as noted by @StevenLu, you can modify it to count the number of frames in 0.5 second and multiply the "fps" by two, or even shorter time (e.g. 0.25 second) so that the update of the fps value will be more frequent.

Upvotes: 1

valentinas
valentinas

Reputation: 4337

High resolution time is available in Chrome 20, but you should be aware, that time resolution in JS depends on the browser, device and circumstances. It might vary between 4ms and 1000+ms

Upvotes: 0

Related Questions