setTimeout函数的精确计时[重复]答案

【问题标题】：Precise timing on setTimeout function [duplicate]setTimeout函数的精确计时[重复]
【发布时间】：2013-12-16 14:28:07
【问题描述】：

我需要在浏览器（移动端和桌面端）上重现类似动画的效果，这个效果只是背景颜色从黑色到白色的程序性变化。

时间很重要，因为短时间的黑色背景表示“0”，较长时间表示“1”（就像二进制摩尔斯电码）。此信息由屏幕前的光传感器解释。传感器非常快，如果我们使用较低的频率，屏幕不会出现问题（假设最大刷新率为 50Hz）。

这是我正在使用的脚本：

var i = 0;
var b0t = 100;
var b1t = 3.5 * b0t;
var wl = 100;

function pulses (){
    bytes = "1001101010110101001000100";

        bit = bytes[i];

        i += 1;

        document.body.style.backgroundColor = 'white';
        document.body.style.color = 'white';

        setTimeout(toblack, wl);

        if(i <= bytes.length) {
            if (bit == 1)
                setTimeout(pulses, b1t + wl);
            else
                setTimeout(pulses, b0t + wl);
        }
}

function toblack() {
    document.body.style.backgroundColor = 'black';
    document.body.style.color = 'black';
}

pulses ();

还有一个working demo（如果您患有任何癫痫综合症，请不要打开）

问题是，20 个浏览器中有 1 个会弄乱时间，当然在传感器方面我有一个容差范围，一个非常容错的范围，但是浏览器有时会超出几毫秒，这不是奇怪的是，如果你的手机电脑在后台做某事，浏览器的性能会受到严重影响。

是否有软件解决方案？我正在考虑使用 flash 来更精确地进行闪烁，但我真的很喜欢我的应用程序也可以从 IOS 访问。或者我可以制作一个本机应用程序，它肯定会比浏览器更精确，但话又说回来，我想知道我是否可以让它在浏览器上运行。

【问题讨论】：

我认为 NaCl 应用程序是最好的解决方案，因为您真的不想在同步单线程应用程序中依赖计时器（至少根据我的经验）。 Flash 可能会解决问题，但就像你说的，IOS 在这里可能是个问题。也许是帆布？ stackoverflow.com/questions/16253920/canvas-game-timer
"...假设最大刷新率为 50Hz..." 这似乎是一个无效的假设，我用过的大多数显示器至少 60Hz，即使在英国这里的电源是 50。
还有其他方法可以在 JS 中为事件计时，上面的链接或this 可能是使用 setTimeout 的替代方法

标签： javascript mobile browser

【解决方案1】：

我唯一可以建议你尝试的是，忘记 sestTimeout 并尝试 Date().getTime() 它会给你一个微秒的 unix 时间戳，你可以尝试查询它并实现你自己的设置超时......我不知道这是否会奏效，但你没有任何尝试。

看这里http://www.sitepoint.com/creating-accurate-timers-in-javascript/

有一些例子。

【讨论】：