setInterval最短极限有多快?

      在几年前的一次测试里,几乎所有浏览器的定时器最短间隔都是64/1000秒,于是我默认了这个答案。但在今天无意中去测试了下,发现结果大不一样,所以要更新下过去的结论。


      平时我们为了最频繁的速度执行某段代码,一般都写成setInterval(XXX, 1)。虽然明知是达不到1ms的间隔的,但我们总希望浏览器能尽可能快些。但浏览器究竟能到达多快呢?我们写个计数器测试下:

var n = 0;
var max = 0;

function tick()
{
	n++;
}

function report()
{
	if(n > max)
		max = n

	document.title = n + " Max:" + max;
	n = 0;
}

setInterval(tick, 1);
setInterval(report, 1000);

      在IE里,仍然是那经典的数字:64,每15.625ms触发一次。当然这并不是浏览器的BUG,如果你做过windows程序开发的话,应该知道SetTimer API的精度是很低的,差不多每秒64次,显然IE里是用了这个。这意味着如果你要做动画或者游戏的话,最高的FPS可以到达64。不过对于如今清一色的液晶显示器来说,这个速度还是足够了,因为液晶只有60HZ的刷新率。事实上,实际应用中能达到64的FPS已是相当不错了,毕竟一次复杂的渲染要控制在16ms内,还是比较有挑战的。而且64FPS也远超人眼的分辨,给人的感觉已是非常平滑了。

      当然,上述只代表IE的测试结果。事实上其他的浏览器在一次次更新后,如今已是各不相同了。下面列出了在各个浏览器下,测试了一段时间后记录到的最大值:

      IE: 64

      FireFox: 75

      Opera: 512

      Safari: 94

      Chrome: 207

      显然,用setInterval(XXX, 1)来追求最快的渲染是很不合理的,不仅浪费了大量的资源,而且在不同的浏览器下表示出的速度也各不一样。因此对于简单的界面渲染,用最简单的办法就是setInterval(XXX, 17)或者再高点。如果是复杂的界面,那就得自己维护一个定时器,并且控制跳帧了。

posted @ 2011-03-14 14:28  EtherDream  阅读(2739)  评论(5编辑  收藏  举报