【发布时间】:2014-06-20 03:55:51
【问题描述】:
我正在开发一个 Javascript 秒表应用程序,它适用于除 Chrome 之外的所有浏览器。
这是一个小提琴: http://jsfiddle.net/djwelsh/Sxyy8/
理论上很简单。单击开始按钮记录epoch time in milliseconds,并启动setInterval。在每个间隔上,从当前纪元时间中减去该起始纪元时间。这给我们留下了一个以毫秒为单位的值,它被转换为h:m:s:cs 并显示在页面上。
问题
我的问题在于 Chrome。每次计时器达到 10000 毫秒时,选项卡就会崩溃并显示“Aw, snap”消息。
一个奇怪的方面是,如果您点击Stop,等待几秒钟,然后再次点击Start,崩溃仍然会发生。这似乎表明这是一个内存问题 - 某些东西正在填充到无法再容纳的程度,并且溢出。但是在开发工具和资源监视器中检查内存并没有发现任何异常。
可能的解决方案
可以通过将间隔值更改为大于 100 毫秒的数字(我要使用的默认值是 50)来避免该问题。出于某种原因,也可以通过在控制台中记录计时器值来避免这种情况。
问题在于,除非我知道为什么会发生这种情况,否则我无法确信这些快速修复确实可以解决问题。在我知道它适用于所有当前浏览器之前,我不想发布该页面。
我知道这似乎是一个范围相当狭窄的问题,但我希望该解决方案能够揭示一些可能对其他人有所帮助的更大范围的东西(Chrome 的计时器功能的特性或其他东西)。
编辑 顺便说一句,我知道停止和重新启动计时器并不像真正的秒表那样工作。我还没有完成那部分的实现。我认为对于 SO 来说,最好让它尽可能简单。
供参考(和伟大的正义),这是更新版本。仍然在 10000 处崩溃: http://jsfiddle.net/djwelsh/Sxyy8/7/
解决方案 根据@Akhlesh 的回答,我更新了小提琴。它现在可以正常运行并像秒表一样工作:http://jsfiddle.net/djwelsh/Sxyy8/18/
如果您想知道,我需要使用基于 epoch 的技术(而不是仅仅增加一个基值),因为有时内存使用问题会导致间隔不是每秒调用一次 - 如果选项卡例如,在计时器仍在运行时移动到后台。
【问题讨论】:
-
仅供参考,我尝试用重复的
setTimeout()替换setInterval(),以防setInterval()由于时间间隔短而在某种程度上过于落后,但同样的问题仍然存在每次更新都会设置一个新的setTimeout(),所以不是这样。 -
我知道 console.log 会减慢代码执行速度,也许足以让 GC 工作,而随着所有不断的 dom 更新,它找不到一个跛脚和暂停一切的好时机。跨度>
标签: javascript google-chrome crash setinterval