HTML5画布动画已经偶尔抖动/犹豫/口吃 [英] HTML5 Canvas Animation Has Occasional Jitter / Hesitation / Stutter

问题描述

在Firefox 11中，我使用HTML5的画布和翻译经历偶尔抖动/犹豫/口吃一些基本的动画。

In Firefox 11, I am experiencing an occasional jitter / hesitation / stutter in some basic animation using HTML5's canvas and translate.

请参见下面的例子...
http://jsfiddle.net/ACRdx/

Please see the following example... http://jsfiddle.net/ACRdx/

在上面的例子中的配置好像在运动的特定的速率提供流畅的动画，偶尔口吃除外当然

The configuration in the example above seemed to provide the smoothest animation at the specified rate of movement, of course with the exception of the occasional stutter.

有没有人有任何想法可能会导致此行为？

Does anyone have any idea what may be causing this behavior?

在一个类似的职位提出了建议似乎并没有帮助，它一直没有更新自2011年6月同样的例子链接现在打破。请参阅...

Suggestions offered in a similar post did not seem to help and it has not been updated since June 2011. Also the example links are now broken. Please see...

<一个href=\"http://stackoverflow.com/questions/6513940/is-there-a-solution-for-html5-canvas-animation-stutter\">Is那里HTML5画布动画口吃的解决方案？

推荐答案

尽量减少你的FPS。可能是出于某种原因，浏览器也很难运行。我与你的code搞砸，这也可能是您的imageMoveXDelta太小。我碰到它到0.2，它跑了pretty顺利给我。除此之外，你应该尽量想，作为总前多少帧它的运行它，以获得良好的混合完成。

Try cutting down your FPS. Could be that the browser for some reason has a hard time running. I messed with your code, it may also be that your imageMoveXDelta is too small. I bumped it up to 0.2, and it ran pretty smooth to me. Other than that, you should try to think of that as how many total frames its running before its done in order to get a good mixture.

这篇关于HTML5画布动画已经偶尔抖动/犹豫/口吃的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！