我遇到了一个奇怪的问题，我编写了一个强制导向的图形布局脚本，我想看看节点放置是如何近乎实时地发生的，这就是为什么我只计算力和重绘元素的原因一次在每个屏幕刷新上使用requestAnimationFrame（虽然我知道使用'while'语句一步计算布局并立即绘制它会更有效）。
所以问题是，当我重新加载页面后第一次发生时，它按照我希望它的工作方式工作：例如，60节点图形计算需要8879ms，我能够看到所有节点如何移动到他们的最终目的地，但是当我试图在没有页面重新加载的情况下重建相同的图形时，每个随后的计算发生得更快：
8879ms
5797ms
4649ms
4330ms
3923ms
....
3046ms
....
etc
因此节点几乎立即变得稳定。小图的差异可能大到10-20倍！ 16节点图：
3041
1583
1101
818
660
551
524
436
373
360
352
305
167
重新加载页面后，重复此过程。所以我想知道为什么它首先发生（浏览器以某种方式缓存和优化代码？）以及如果可能的话如何避免它。在IE，FF和Chrome中尝试过相同的结果。
由于
答案 0 :(得分：0)
是的，他们做到了，这是提高js发动机性能的关键。
我听说谷歌Chrome的V8 js引擎将JavaScript编译为原生机器代码，这就是为什么chrome如此之快。
http://en.wikipedia.org/wiki/V8_(JavaScript_engine)
似乎你的问题是关于你的javascript知识，没有浏览器，javascript有时很乏味而且很难完全掌握。有时您的代码只是按照您的预期执行而不按照顺序执行。
答案 1 :(得分：0)
永远不要指望计算足够慢以便您可以看到结果。迟早，你总是被证明是错的。 requestAnimationFrame用于需要尽可能顺利绘制的动画，并且可能会为您提供任意FPS。如果您需要限制某些事情的发生率，请使用setInterval，或使用requestAnimationFrame，但会降低每个节点移动的数量，使其与自上一帧以来的时间成比例地移动。
答案 2 :(得分：0)
是。 Chrome有他们的V8引擎，Firefox有spidermonkey，我相信Safari在他们的WebKit框架中有JavaScriptCore。此外，Firefox支持asm.js，这是javascript的一个子集，可以从C / C ++代码中编译下来，最近用于虚幻引擎的真棒javascript端口
http://www.unrealengine.com/html5/
所以，是的 - 大量资源用于优化javascript执行，性能因浏览器而异。新的通常是光荣的。 （这实际上是一个优化js的棘手过程，因为它是一个非常动态的语言 - 对象可以随时改变角色和属性。这种困难部分是谷歌'Dart'语言背后的理由：
https://www.dartlang.org/support/faq.html）
话虽如此，如果你写一个非常低效的while循环，那么浏览器只能做到这么多。