`
ruilin215
  • 浏览: 1143124 次
  • 性别: Icon_minigender_2
  • 来自: 成都
文章分类
社区版块
存档分类
最新评论

再谈JavaScript时钟中的16ms精度问题.

阅读更多

上一篇BLOG中,通过测试我们发现JavaScript的时钟是16ms的间隔. 对于IE来说,每次总会发生16ms的间隔;对于firefox来说,会存在0ms的间隔. 对于后者,我曾解释说:可能是Java使用了自己的时钟.

先说第二种情况,对于firefox中的js引擎,我尚未去看代码,因此我只说"可能",但后来hax来说,firefox的JS引擎仍是C写的,这才想起的确如此.所以这里先说,我前面关于firefox的问题的解释是错的.

再说16ms的问题. 我其实也怀疑,为什么是16ms,而不是其它的什么值呢?

hax给了我很多信息.我这里来整理一下:

首先是取时间值.也就是我们在JavaScript中用new Date()得到时间值采用的方法其实是不准确的. 该值总会是15~16ms的间隔值,其原因在于:
---------------
Windows系统获取时间主要是用下面的几种方法
  一:GetTickCount()
这个就是用的上篇里说的系统时钟中断
  Windows NT 3.5 及更高版本,精度为 10ms(100Hz)
  Windows NT 3.1 ,精度为 16ms(60Hz)
  Windows 95 及更高版本,精度为 55ms(18.2Hz)
  (对于WindowsXP(NT5.0) 及更高版本,实测得的精度为 16ms)
  
  二:timeGetTime()
  精度约1ms(需通过其它API配合)

  三:High-Resolution Timer
这种方法就使用了CPU的RTC
  QueryPerformanceCounter() 配合 QueryPerformanceFrequency(),适用于高精度应用场合

参见:http://www2.matrix.org.cn/thread.shtml?topicId=10491&forumId=1&fid=1
---------------
也就是说,如果JavaScript的new Date()采用getTickCount()来实现,那么它必然是返回16ms间隔的时间值的.
举例来说,你可能写一个超大循环用来收集一批Date()对象,最终你会发现,大多数时候是一样的值,而每两
批时间值的差值总在15~16ms.

接下说时间精度.也就是讨论setTimeout/setInterval()为什么是16ms,而另外一些人/资料会提及到10ms这个精度值.首先我们来看时钟的实现:
---------------
  一、使用系统时钟SetTimer()
  系统时钟是采用向窗体发WM_TIMER事件来激活处理例程的。而且同一个窗体消息队列中只允许同时存在一个WM_TIMER,因此它可能被丢失消息。

  二、使用timeSetEvent()
  可以使用timeSetEvent()来设置时钟。缺省情况下,他是16ms精度的。另外,同进程中同时最多有16个timeSetEvent()。

  三、在线程中使用sleep()
  Zhe曾用C代码做过测试,证明sleep()的精度是10ms。也就是说,sleep(1)产生的效果最低限也是10ms的间隔。

参见:http://dev.cbw.com/vc/progress/200510315005_4279849.shtml
---------------

timeSetEvent缺省情况下是16ms/10ms间隔的,更确切地说,是“对于Intel 芯片的精度为16ms,对于MIPS芯片的精度为10ms”。这一点在下面这份文档中有说明:
http://www.wanfangdata.com.cn/qikan/periodical.Articles/jdgc/jdgc99/jdgc9903/990318.htm

timeSetEvent()可以通过一些API:timeBeginPeriod()来调整计时精度。这一点请参考:
http://www.vckbase.com/document/viewdoc/?id=1234

最后,我们来讲结论。对于JavaScript来说,由于new Date()只需要得到毫秒值,并不需要过高的精度,因此最合理的方法当然是调用GetTickCount()来取值,而不是采QueryPerformanceCounter() 配合 QueryPerformanceFrequency()来得到高精度的时间值。由于GetTickCount()自身的限制,JavaScript的new Date()得到的时间隔是16ms精度的。——对于win98或其它系统来说,这个值可能是58ms/10ms。

对于定时器来说,JavaScript应该会是使用timeSetEvent()来做定时器。因为如果用线程+sleep()会存在较大的开销(事实上我出观察到线程计数是没有变化的),而采用SetTimer()会存在消息队列的问题。所以采用timeSetEvent()是最实际的方案。——至于16个timeSetEvent()的限制,可以通过同一个timeSetEvent()中处理多个例程来规避。因此,由于timeSetEvent()自身在缺省状态下的限制,因此导致了16m时间间隔。

对于FireFox中的和WebKit(safari)中的脚本引擎,因为是开源的,有兴趣的不妨自己读读相关的代码。就不再讲述了。

感谢Zhe和hax对我提供的帮助。本文基本上是资源整理贴。^.^

分享到:
评论

相关推荐

    javascript中数字时钟的制作方法.pdf

    本资源主要介绍了使用JavaScript制作数字时钟的方法。该资源提供了一个完整的HTML代码,展示了如何使用JavaScript和CSS来实现一个数字时钟的展示。 一、HTML结构 该资源的HTML结构主要由一个`<table>`元素组成,...

    JavaScript应用实例-时钟球球动画.js

    JavaScript应用实例-时钟球球动画.js

    javascript经典特效---纯JavaScript时钟.rar

    在本主题中,我们将深入探讨“纯JavaScript时钟”这一经典特效,它展示了JavaScript如何实时更新页面上的时间显示,无需依赖任何外部库,如jQuery。 在纯JavaScript时钟中,我们首先需要理解JavaScript的时间处理...

    简单的javascript时钟

    我个人编写的简单的javascript时钟 供初学朋友学习使用

    javascript时钟

    JavaScript 12小时制时钟是一种常见的编程任务,它用于在网页上显示当前时间,以12小时格式(AM/PM)表示。在JavaScript中,我们可以利用内置的Date对象和一些基本的字符串处理来实现这一功能。下面我们将深入探讨...

    HTML网页数字时钟代码.zip

    在这个案例中,我们看到一个基于Vue.js 2.3.4版本实现的数字时钟代码。Vue.js是一款轻量级的前端JavaScript框架,以其易用性和灵活性而受到开发者的欢迎。在2.3.4版本中,它提供了响应式数据绑定、组件化、虚拟DOM等...

    javascript的parseFloat()方法精度问题探讨

    在Javascript中parseFloat()方法会产生精度问题 代码如下: [removed] var a = “0.11”; var b = “0.2801”; var c = “1.002”; var sum1 = parseFloat(a) + parseFloat(b) + parseFloat(c); var sum2 = ...

    JavaScript开发一个时钟

    在`clock.css`文件中,我们可以设置时钟的背景、边框、字体等属性,使其看起来更像一个真实的时钟: ```css #clock { width: 300px; height: 300px; border: 20px solid #333; border-radius: 50%; display: ...

    javascript背景时钟实现方法.docx

    JavaScript 背景时钟实现方法是一种使用 JavaScript 实现时钟背景效果的方法,该方法主要介绍了 JavaScript 背景时钟实现方法,涉及 JavaScript 时间及页面元素样式的相关操作技巧。 时钟显示位置 在该方法中,...

    javascript避免数字计算精度误差的方法详解.docx

    在JavaScript中进行浮点数运算时,经常会出现精度误差的问题。例如,一个简单的加法运算 `0.1 + 0.2` 的结果并不是预期中的 `0.3`,而是 `0.30000000000000004`。这种现象不仅让人困惑,而且在实际应用中可能会导致...

    罗盘时钟HTML源码下载

    首先,我们可以使用`Date`对象获取当前时间,然后通过计算小时、分钟和秒的角度值(因为时钟是一个360度的圆),再应用到CSS的`rotate`属性上。例如,一个小时代表30度,一分钟代表6度。JavaScript还可以添加事件...

    倒影时钟 javascript 倒影 时钟 源码 html IE

    描述中提到"用javascript写的练习脚本,代码很简单,适合初学者",这暗示了这个项目是一个教学资源,可能是一个简单的JavaScript代码示例,目的是帮助初学者学习如何使用JavaScript来创建动态效果,如倒影时钟。...

    纯JavaScript时钟效果

    纯JavaScript时钟效果,可以直接在您的网页中直接引用。!!

    JavaScript 全栈教程[廖雪峰 ].CHM

    JavaScript 全栈教程[廖雪峰 ].CHM

    VS2015安装证书,JavaScript_ProjectSystem.msi,JavaScript_LanguageService.msi

    在这个场景中,我们关注的是VS2015的安装过程中涉及到的证书问题以及两个特定的组件:JavaScript_ProjectSystem.msi和JavaScript_LanguageService.msi。 首先,关于“VS2015安装证书”,这通常是指安装过程中需要...

    js-实现3D炫酷实时时钟翻转动画带倒影特效.rar

    在JavaScript的世界里,实现3D炫酷实时时钟翻转动画带倒影特效是一项充满挑战且有趣的技术实践。这个特效不仅能够吸引用户注意力,还能展示开发者对于JavaScript高级特性和CSS3的强大掌握。以下是对这个特效的详细...

    JavaScript小特效钟表 大笨钟.7z

    在本案例中,"大笨钟"可能是指一个模拟传统大型机械钟外观和功能的数字时钟。这个项目可能包括了HTML文件(timea.html)、CSS样式文件(可能在css.zip中)以及JavaScript脚本文件(可能在js.zip中)。 JavaScript是...

    【JavaScript源代码】JavaScript canvas实现七彩时钟效果.docx

    ### JavaScript Canvas 实现七彩时钟效果 #### 一、项目背景与目标 在本教程中,我们将通过JavaScript和HTML5的Canvas元素实现一个动态的七彩时钟效果。此项目的目标是在网页上呈现一个实时更新的时钟,时钟会根据...

    《ppk谈JavaScript》中文版pdf和原书示例源码

    ppk谈JavaScript JavaScript入门必读之书 本书全方位介绍了JavaScript,主要讨论了浏览器兼容性、可访问性、底层语法以及与HTML结构层的协同等问题。...ppk谈JavaScript.pdf 和 ppk谈JavaScript源代码

    js计算精度问题解决方案

    在JavaScript编程语言中,计算精度问题是一个常见的挑战,特别是在处理浮点数时。这是因为JavaScript的浮点数表示遵循IEEE 754标准,这可能导致在进行数学运算时出现不精确的结果。例如,简单的加法、减法、乘法或除...

Global site tag (gtag.js) - Google Analytics