JavaScript: Est-ce fiable minuterie?

Question

Aujourd'hui, j'a été introduit dans le monde des travailleurs sur le Web en JavaScript. Cela m'a fait repenser minuteries. Je l'habitude de minuteries programme comme laide, comme celui-ci.

var time = -1;
function timerTick()
{
    time++;
    setTimeout("timerTick()",1000);
    $("#timeI").html(time);
}

Je sais que cela pourrait être améliorée en enregistrant la date à laquelle vous démarrez le chronomètre, mais je ne l'ai jamais été un fan de ça.

Maintenant, je suis venu avec une méthode utilisant les Web Workers, je l'ai fait un peu de référence et l'a trouvé beaucoup plus fiable. Depuis que je ne suis pas un expert en JavaScript Je voudrais savoir si cette fonction fonctionne correctement ou quels problèmes il pourrait avoir grâce à l'avance.

Code Mon JavaScript (s'il vous plaît noter que j'utilise JQuery):

$(function() {
    //-- Timer using web worker. 
    var worker = new Worker('scripts/task.js'); //External script
    worker.onmessage = function(event) {    //Method called by external script
        $("#timeR").html(event.data)
    };
};

Le script externe ( 'scripts / task.js'):

var time = -1;
function timerTick()
{
    time++;
    setTimeout("timerTick()",1000);
    postMessage(time);
}
timerTick();

Vous pouvez également voir une démonstration en direct sur mon site .

Answer 1

Si vous essayez d'afficher de manière fiable secondes à retardement par, alors la seule façon fiable de le faire est d'obtenir l'heure actuelle au début et à utiliser la minuterie seulement pour mettre à jour l'écran. Sur chaque tick, vous obtenez l'heure actuelle, calculer les secondes écoulées réelles et afficher cela. Ni setTimeout() ni setInterval() sont garantis ou peuvent être utilisés pour compter avec précision le temps.

Vous pouvez le faire comme ceci:

var start = +(new Date);
setInterval(function() {
    var now = +(new Date);
    document.getElementById("time").innerHTML = Math.round((now - start)/1000);
}, 1000);

Si le navigateur est occupé et minuteries sont espacés de façon irrégulière, vous pouvez obtenir une mise à jour légèrement irrégulière à l'écran, mais le temps écoulé restera précise lorsque l'écran est mis à jour. Votre méthode est susceptible d'accumuler une erreur dans le temps écoulé.

Vous pouvez voir ce travail ici: http://jsfiddle.net/jfriend00/Gfwze/

Answer 2

La minuterie la plus exacte serait une comparaison de deux timbres de temps. Vous pouvez augmenter la précision de votre horloge en mettant à jour plus fréquemment (par exemple tous les 100ms). Je préfère utiliser setInterval() sur setTimeout().