Firefox 10ms 间隔

Question

所以我做了一个简单的计时器，格式如下：MM:SS.MS

你可以在这里查看它[已删除]
它在 chrome、IE 等中运行良好，但在 Firefox 中，秒数大约是原来的两倍。

我看了一些其他秒表，但我并没有放弃理解它们。 最好的方法是什么？现在我有一个 10 毫秒的间隔来生成计时器。

该功能看起来像这样，我希望它是可以理解的：

var state = false;
var msTimer = null;

var min = document.getElementById("min");
var sec = document.getElementById("sec");
var ms = document.getElementById("ms");

var minCount = 0;
var secCount = 0;
var msCount = 0;


document.onkeydown = function timer(e) {

if (!e) { e = window.event; }

if (e.keyCode == "32") {

    if (state == false) {
        state = true;

        min.innerHTML = "00";
        sec.innerHTML = "00";
        ms.innerHTML = "00";

        msTimer = window.setInterval(function() {
            if (msCount == 99) {

                msCount = 0;
                secCount++;

                // Minutes
                if (secCount == 60) {

                    secCount = 0;
                    minCount++;

                    if (minCount <= 9)
                    { min.innerHTML = "0" + minCount; }
                    else
                    { min.innerHTML = minCount; }
                }

                // Seconds
                if (secCount <= 9)
                { sec.innerHTML = "0" + secCount; }
                else
                { sec.innerHTML = secCount; }

            } else { msCount++; }

            // Miliseconds
            if (msCount <= 9)
            { ms.innerHTML = "0" + msCount; }
            else
            { ms.innerHTML = msCount; }

            // 1 Hour
            if (minCount == 60) {

                clearInterval(msTimer);

                min.innerHTML = "N0";
                sec.innerHTML = "00";
                ms.innerHTML = "0B";

                state = false;

                minCount = 0;
                secCount = 0;
                msCount = 0;
            }
        }, 10);

    } else if (state == true) {
        state = false;

        clearInterval(msTimer);

        minCount = 0;
        secCount = 0;
        msCount = 0;
    }
}

感谢您的任何建议:)

编辑：

顺便说一句，如果我从计时器中删除所有样式，它在 Firefox 中会更流畅。 但这不能是解决方案..

Answer 1

您不应该依赖计时器的间隔正好 10 毫秒。如果您将每个计时器滴答视为刷新屏幕计时器的请求，但从系统时钟或类似的东西中获取测量，那就更好了。

然后，无论机器（和 JS 实现）有多慢或多忙，您总是会看到一个准确的计时器¹ - 只是更新频率较低的计时器。

---

¹ 当然，这只会与系统时钟一样准确。如果 Javascript 可以访问高性能计时器，例如 .NET 的 Stopwatch 类或 Java 的 System.nanoTime()方法，这样会更好用。

Answer 2

无法保证 JavaScript 中的计时。 10 毫秒的间隔只会大约为 10 毫秒，很可能每次都会延迟一点点。在 Javascript 中创建计时器的正确方法是在启动计时器时保存起始时间戳，然后每隔 10 毫秒左右计算起始时间戳与当前时间之间的差异，并使用格式化值更新页面上的元素。