0

そのため、現在、1秒間に20回再生されるバウンドするオブジェクトのアニメーションがあります。

    1000/50 = 20 times a second

コードは次のとおりです。すべての変数が適切に初期化されていると想定できます。

        var animation = setInterval(function () {
            currentFrame++;
            if (speedX <= 0.0) {
                clearInterval(animation);
            }
            speedX -= 0.03;
            speedY = (speedY + Math.sqrt((2 * currentFrame) / gravityPull));
            yPosition += speedY;

            if (yPosition > groundY) {
                speedY *= -1;
                yPosition = groundY;
            }
            xPosition += speedX;
            $("#box").offset({ top: yPosition, left: xPosition });

        }, 50);

Chromeはこのコードを実行しても完全に問題ないように見えますが、これはIEで非常に厄介なパフォーマンスを生み出しています。実際、それは非常に悪いので、コンピュータの多くを遅くします。

ここに何か問題がありますか？計算はかなり単純なようです...フレームレートはそれほど高くなく、1秒あたり20は極端ではありませんが、それほど途切れのないアニメーションには十分流動的です。

4

1 に答える 1

3

新しい発見：InternetExplorerは最悪です。

まあ、少なくともIE8以前。IE9は優れたパフォーマンスを発揮します。

setTimeoutとによってトリガーされる時限関数の問題setIntervalは、ブラウザが期限が来たときに関数を実行しようとすることですが、これは実際にはアイドル状態の場合にのみ発生します。また、Internet Eplorer <9は非常に遅く、常に何かに対して「遅い」ので、そのアニメーションが良くない理由を理解できます。

問題は、「フレーム」を実行するたびに、IE8が計算とDOMの変更によって引き起こされるすべてのタスクを実行するのに50ミリ秒以上かかることです。

于 2012-06-08T00:12:16.493 に答える