我看到过一些文章说 setInterval 影响CPU性能。我写了一个使用 setInterval 的脚本并监控了CPU使用率,但是没有注意到变化。我想知道是否有什么我错过的东西。
这段代码每100毫秒检查URL中哈希(#后面的内容)是否更改,如果更改,则使用AJAX加载页面。如果没有更改,则不执行任何操作。这种方式是否会导致CPU问题。
我看到过一些文章说 setInterval 影响CPU性能。我写了一个使用 setInterval 的脚本并监控了CPU使用率,但是没有注意到变化。我想知道是否有什么我错过的东西。
这段代码每100毫秒检查URL中哈希(#后面的内容)是否更改,如果更改,则使用AJAX加载页面。如果没有更改,则不执行任何操作。这种方式是否会导致CPU问题。
我认为setInterval
不会自身引起严重的性能问题。我猜这个声誉可能来自一个更早的时代,当时CPU的功率较低。
然而,您可以通过以下方式提高性能,这也是明智的:
setInterval
,而不是字符串。不要过早优化 - 当没有问题时,不要让生活变得困难。
然而,在您的特定情况下,您可以在支持它的浏览器中使用onhashchange
事件,而不是超时。
我倒是更愿意说相反的情况。正确使用setTimeout
和setInterval
,可以极大地减少浏览器的CPU使用率。例如,使用setTimeout
而不是使用for
或while
循环,不仅能减少CPU使用强度,还能保证浏览器有机会更频繁地更新UI队列,因此长时间运行的进程不会冻结和锁定用户体验。
但总的来说,如果在您的网站上同时运行了大量的setInterval
,可能会使事情变慢。20个同时运行的间隔,无论是更多还是更少的工作,都会影响展示效果。当然,你也可能把其他部分搞砸,但这并不是setInterval
的问题。
另外,顺便说一下,您不需要像那样检查哈希值。有事件可以做到这一点:
onhashchange
当哈希值发生变化时将会被触发。
window.addEventListener('hashchange', function(e) {
console.log('hash changed, yay!');
}, false);
不,setInterval
本身并不会导致CPU过度使用。但是如果您有很多间隔时间很短的间隔运行(或者一个相对较长的间隔时间内运行的非常复杂的操作), 那么根据您的间隔时间做什么以及它们多频繁地执行,这可能很容易导致CPU过度使用。
我不认为每 100 毫秒检查一次URL会出现任何问题,尽管个人建议将间隔时间增加到250毫秒,因为我不认为两者之间的差异会被典型用户注意到,并且基本上我会尝试使用最长的超时间隔,特别是一些大部分时间都无需操作的事情。
这里有一些营销用语,使用了“CPU密集型”的术语。实际上的意思是“比某些替代方案更加CPU密集型”。它并不像“游戏或压缩算法那样使用大量的CPU功率”那样“CPU密集型”。
解释:
一旦浏览器放弃控制权,它就依赖于底层操作系统和硬件的中断来接收控制并发出JavaScript回调。这些中断之间的持续时间越长,硬件就可以进入低功耗状态,从而显著降低功耗。默认情况下,Microsoft Windows操作系统和基于Intel的处理器使用15.6毫秒分辨率进行这些中断(每秒64个中断)。这使得基于Intel的处理器可以进入最低电源状态。因此,Web开发人员在使用setTimeout(0)时,在HTML4浏览器(包括早期版本的Internet Explorer和Mozilla Firefox)中通常只能实现64个回调/秒。在过去的两年中,浏览器试图通过更改节能的Windows系统设置并防止硬件进入低功耗状态来增加setTimeout和setInterval API每秒可接收的回调次数。HTML5规范甚至建议每秒250个回调。这种高频率可能导致功耗增加40%,影响电池寿命、运营成本和环境。此外,这种方法并没有解决提高CPU效率和调度的核心性能问题。来自http://ie.microsoft.com/testdrive/Performance/setImmediateSorting/Default.html。
在您的情况下,不会有任何问题。但如果您在canvas中进行大量动画或使用webgl,则会出现一些CPU问题,因此您可以使用requestAnimationFrame。
请参考此链接关于requestAnimationFrame
函数时间 > 间隔时间是不好的,您无法知道 CPU 何时会出现卡顿或变慢,并且它会堆叠在正在进行的函数之上,直到计算机冻结。使用 settimeout 或更好的 process.nextick,在 settimeout 中使用回调。