0

キャンバスへの描画で問題が発生しました。問題は、イベントが発生すると、「requestAnimFrame」が遅いことです。

http://jsfiddle.net/pAjYC/4/

現在の描画から次の描画までの時間を確認できます。

テキストボックスに少し長いテキストを入力するだけです。入力すると、ギャップタイムが長くなります。

fsfiddleでテキストボックスに入力すると、テキストの色がチェックされます。

少し時間がかかります。たとえば、「v」または「var」と入力します。私の場合、ギャップ時間は16から58に変わります。または、ドラッグしてソースコードを選択すると、時間がかかります。その理由は、DOMへのアクセスまたは一部の画面の変更である可能性があります。

しかし、それだけではありません。socket.ioを使用してゲームを作成しています。ゲームがsocektを受信すると、ギャップ時間は100ms以上になります。しかし、ソケット機能は10msまたは20msかかります。

これはゲームプログラミングの重要な問題です。

それを解決する方法はありますか?

4

2 に答える 2

0

Paul Irish のshim ではなく、Erik Möller の更新版の shimを使用することをお勧めします。

(function() {
    var lastTime = 0;
    var vendors = ['ms', 'moz', 'webkit', 'o'];
    for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
        window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
        window.cancelAnimationFrame = 
          window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame'];
    }

    if (!window.requestAnimationFrame)
        window.requestAnimationFrame = function(callback) {
            var currTime = new Date().getTime();
            var timeToCall = Math.max(0, 16 - (currTime - lastTime));
            var id = window.setTimeout(function() { callback(currTime + timeToCall); }, 
              timeToCall);
            lastTime = currTime + timeToCall;
            return id;
        };

    if (!window.cancelAnimationFrame)
        window.cancelAnimationFrame = function(id) {
            clearTimeout(id);
        };
}())

それが問題を解決するかどうかはわかりませんが...

于 2012-05-30T16:50:24.390 に答える
0

遅くはrequestAnimFrameありません-遅いのはあなたの計算ですここを見てください:

http://jsfiddle.net/FwynN/

于 2012-05-28T08:53:31.547 に答える