-1

canvas を使用して、アーケード(多くのアクションとスピード) ブラウザ 2D ゲームを開発しています。

時々、私たちのテスト プレーヤーは、遅延があると報告します: キーアップ後、プレーヤーはまだ 5 ～ 10 ピクセル離れています。

私はこの問題を掘り下げました。 http://jsfiddle.net/C4ev3/7/を遅らせることができます(keydown/up をできるだけ早く試してください)。私の結果は70から120msです。そして、それはたくさんあると思います。(参考までに、ネットワーク遅延は 10 ～ 20 ミリ秒です)。

この遅延を減らす方法はありますか?

更新良いハードウェアでは、この遅延は 30 ～ 40 ミリ秒未満であることに気付きました。しかし、私はcore2duo、winxp、chrome 19でテストしています-IE6のP4ではありません:)

4

2 に答える 2

2

こんにちは、匿名関数を使用する代わりに、定義済み関数を使用してみてください。

http://jsfiddle.net/C4ev3/10/ - 私にとって、これは 50-100 MS で報告されました

ただし、キャンバス アプリケーション用の jQuery はお勧めしません

http://jsfiddle.net/C4ev3/11/ - 私にとって、これは 30-70 MS を報告しました

Javascript のスレッディング コメントで気づいたことの 1 つは、Javascript がマルチスレッドではなく、Urm-Arr であるということです。setInterval は同期ではなく非同期ですが、ウィンドウに影響を与えるのはシングル スレッド EG です。 setInterval を使用すると別のスレッドが使用され、数学の変更に問題はありませんが、Task ではページに Draw が必要で、JS ハンドル Que の下部に入ります。

Javascript の特定の部分は別のスレッド上にありますが、スレッドがフォームを変更したい場合は、Windows アプリケーションと同じように、ページを変更するすべてのものをメイン スレッドで実行する必要があります。メイン スレッドを呼び出してそれを実行する必要があります。

ただし、Windows のように特定の Wim で処理または中止できない他のものとは異なり、マルチスレッドではありません。

その他の非同期タスクには、AJAX が含まれており、非同期と同期の両方を行うオプションがあります。

FPS 制限に関する私のコメントを表示するように更新しました。

我慢してください。これは、例を示すために既にビルドされているプロジェクトにリンクしています: したがって、私のゲームは完全に OOP です。

var elem = document.getElementById('myCanvas');
var context = elem.getContext("2d");
context.fillStyle   = '#888';
context.lineWidth   = 4;
// Draw some rectangles.
context.fillRect(0,   0, 800, 600);
context.fillStyle = '#f00';

var ball = new Ball();
var leftPadel = new Padel(10, 60, 40, 120);
var rightPadel = new Padel(750, 520, 40, 120);

pong = new Pong();
pong.draw();

setTimeout("ball.move()", pong.redrawTime());

私の pong クラスの中には、ゲームのすべての主要な仕組みがありますが、見る必要がある FPS ビットはここにあります

this.fps = 30;
this.maxFPS = 60;

this.redrawTime = function(){
    return (1000 / this.fps)
}

this.lastDraw = (new Date)*1 - 1;

次に、インターバルがball.moveにあることがわかるように、これは再描画の最後に再描画でメインのpongクラスを再度呼び出します。FPSチェックと制限コードがあります

this.fps = ((now=new Date) - this.lastDraw);
if(this.fps > this.maxFPS){
    this.fps = this.maxFPS;
}
this.lastDraw = (new Date)*1 - 1;
if(this.reporting = true){
    console.clear();
    console.log("FPS: "+this.fps.toFixed(1))
}
setTimeout("ball.move()", pong.redrawTime());

これにより、メインスレッドをキューに入れることなく、可能な限り最高の FPS を取得することが強制されます

于 2012-06-11T14:30:56.297 に答える
0

これを試して：

e.stopPropagation()

親要素へのイベントのバブリングを停止し、親ハンドラーにイベントが通知されないようにします。

e.preventDefault()

ブラウザがデフォルト アクションを実行しないようにします。メソッド isDefaultPrevented を使用して、このメソッドが (そのイベント オブジェクトで) 呼び出されたかどうかを確認します。

私の分。Google chrome での結果: 7ms

于 2012-06-11T14:38:15.793 に答える