解决setInterval计时器不准的问题
来源:互联网 发布:部门总结数据分析ppt 编辑:程序博客网 时间:2024/04/29 16:00
在js中如果打算使用setInterval进行倒数,计时等功能,往往是不准确的,因为setInterval的回调函数并不是到时后立即执行,而是等系统计算资源空闲下来后才会执行.而下一次触发时间则是在setInterval回调函数执行完毕之后才开始计时,所以如果setInterval内执行的计算过于耗时,或者有其他耗时任务在执行,setInterval的计时会越来越不准,延迟很厉害.
下面的代码可以说明这个问题
1
2
3
4
5
6
7
8
9
10
11
var
startTime =
new
Date().getTime();
var
count = 0;
//耗时任务
setInterval(
function
(){
var
i = 0;
while
(i++ < 100000000);
}, 0);
setInterval(
function
(){
count++;
console.log(
new
Date().getTime() - (startTime + count * 1000));
}, 1000);
代码里输出了setInterval触发时间和应该正确触发时间的延迟毫秒数
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
176
340
495
652
807
961
1114
1268
1425
1579
1734
1888
2048
2201
2357
2521
2679
2834
2996
......
可以看到延迟是越来越严重的.
为了在js里可以使用相对准确的计时功能,我们可以
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var
startTime =
new
Date().getTime();
var
count = 0;
setInterval(
function
(){
var
i = 0;
while
(i++ < 100000000);
}, 0);
function
fixed() {
count++;
var
offset =
new
Date().getTime() - (startTime + count * 1000);
var
nextTime = 1000 - offset;
if
(nextTime < 0) nextTime = 0;
setTimeout(fixed, nextTime);
console.log(
new
Date().getTime() - (startTime + count * 1000));
}
setTimeout(fixed, 1000);
代码里,通过1000(也就是周期时间)减去当前时间和准确时间的差距,来算出下次触发的时间,从而修正了当前触发的延迟.
下面是输出
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
186
200
230
271
158
899
900
899
900
899
899
899
902
899
418
202
232
266
145
174
192
214
242
268
149
179
214
......
可以看到虽然触发时间并非绝对准确,但由于每次触发都进行及时修正,所以并没有造成误差积累.
1 0
- 解决setInterval计时器不准的问题
- setInterval计时器不准的问题解决方法
- 解决double和float精度不准的问题
- 如何解决绑定变量造成执行计划不准的问题?
- cacti解决监控千兆取值不准问题的方法
- IE下onmouseout解决穿透不准的问题。(未测试)
- 解决校正PHP服务器时间不准的问题
- Android 倒计时(有效解决计时不准的问题)
- 解决Zabbix用snmp监控网络流量不准的问题
- 解决double和float精度不准的问题
- 解决TexStudio中文光标定位不准的问题
- 关于解决12单片机定时竟然不准的问题
- 仓库不准的问题
- SetTimer不准的问题
- SetTimer不准的问题
- 解决setTimeout 计时器重复调用的问题
- swift 用GCD写的倒计时 防止计时器不准
- viewDidLoad尺寸不准的问题
- [算法导论] 快速排序
- Adobe Photoshop CC2015 下载-安装-注册机破解
- String abc=null;String abc="";String abc;三种写法有什么区别?
- 友元
- MATLAB与C/C++混合编程之MATLAB调用C程序
- 解决setInterval计时器不准的问题
- php面试题2016-5-1
- java设计模式(工厂模式)
- C ++ 计时器
- Google产品设计师:从二维界面到虚拟现实
- BFS - 八方向迷宫问题
- SDUT 2168 Mathmen(贪心)
- Struts2架构思想、配置文件
- ubuntu14.04安装cuda7.5+cudnn+caffe