1

私は新しいHTML5標準を試して、それが何を提供できるかを確認し、学習していました...しかし、Firefoxでゲームが非常に遅い理由がわかりません。

プレーヤーと背景を「描画」するために選択できる方法はいくつかあります。それは右下隅で選択できます。

私はFirefoxでゲームをテストし、結果を出しました:

全体として、非常に遅い結果になります。Htmlを使用すると、キャンバスとは完全に遅れますが、少し良く見えますが、それでも完全に遅れています...

Google Chromeの結果:

グーグルはコードをかなりうまく実行しているようです...それは本当に遅れています。

InternetExplorerのテスト

それで、ここにそのすべての興味深い部分があります。InternetExplorer9はそれを非常にうまく実行します...私のコンピューターではほとんど速すぎます。

だから私の質問はです。Firefoxは私のグラフィックカードが好きではありませんか?またはそれはどこでうまくいかないのですか?多分私のコードは遅すぎますか?しかし、私はテストを正しく行っていますか?画像を再描画する時間間隔を実行するのに約1ミリ秒しかかかりません(タイマーがintervalTimerという名前の右上隅に示されているように)。

そして、私はあなたがどのような結果を得るのか、そしてそれが私のグラフィックカードを嫌っているだけのFirefoxであるかどうかを非常に聞きたいです。:-(

また、Firefoxでより適切に機能するように、どこで改善できるかがわかります。

これが私のコードの一部です:

interval.jsファイルはsetIntervalを実行し、プレーヤーを再描画します。

function interval() {
var startdate = +new Date();  // log start timestamp

if (general_slowmo > 9)
    general_slowmo = 0;
else
    general_slowmo++;

collisions();


if (drawmethod == "canvas") {
    canvas.clearRect(0, 0, general_winwidth, general_winheight);
    drawplayercanvas(p0x, p0y, 0);
}
else if (drawmethod == "html") {
    drawplayerhtml(p0x, p0y, 0);
}
else {
    drawImageWebGl(p0, p0x, (general_winheight - p0y) - general_playerheight);
}


var enddate = +new Date();  // log end timestamp
var diff = enddate - startdate;
$("#intervalTimer").html("intervalTimer: " + diff + "ms");
}

しかし、intervalTimer divで取得するのは、0または1ミリ秒の時間だけです。しかし、プレイヤーを引くのにかかる時間を数えるかどうかはわかりませんか?

間隔内で、関数Collisionsが実行されます。

function collisions() {

var spritex = p0x;
var spritey = p0y;
var jump = jumpp0;
var keyX = keyXp0;
var keyY = keyYp0;
var onground = ongroundp0;

if (keyX == -1) { //left movement
    if (blockexists(spritex - 1, spritey) === false && blockexists(spritex - 1, spritey + general_blocksize) === false) {
        spritex--;
    }
}

if (keyX == 1) { //right movement
    if (blockexists(spritex + general_playerwidth, spritey) === false && blockexists(spritex + general_playerwidth, spritey + general_blocksize) === false) {
        spritex++;
    }
}

if (jump != 0) {
    var aboveone = blockexists(spritex, spritey + (general_playerheight - 1));
    var abovetwo = blockexists((spritex + general_playerwidth - 1), spritey + (general_playerheight - 1));

    if (aboveone === true || abovetwo === true) {
        jump = 0;

        if (toblock(spritex, spritey + (general_playerheight - 1)) == 2) {

            removeblockarray(spritex, spritey + (general_playerheight - 1));

            if (mapdrawmethod == "canvas")
                removeblockcanvas(spritex, spritey + (general_playerheight - 1));
            else
                removeblockhtml(spritex, spritey + (general_playerheight - 1));
        }
        if (toblock((spritex + general_playerwidth - 1), spritey + (general_playerheight - 1)) == 2) {

            removeblockarray((spritex + general_playerwidth - 1), spritey + (general_playerheight - 1));

            if (mapdrawmethod == "canvas")
                removeblockcanvas((spritex + general_playerwidth - 1), spritey + (general_playerheight - 1));
            else
                removeblockhtml((spritex + general_playerwidth - 1), spritey + (general_playerheight - 1));
        }
        spritey--;
    }
    else {
        jump++;
        spritey++;

        if (jump > maxjump) {
            jump = 0;
        }
    }
}

if (keyX != 0 || onground == false) {
    if (blockexists(spritex, spritey - 1) === true || (blockexists(spritex + general_playerwidth - 1, spritey - 1) === true)) {
        if (jump == 0)
            onground = true;
    }

    else if (jump == 0) {
        spritey--;
        onground = false;
    }
}

if (blockexists(spritex, spritey, "item") === true || blockexists(spritex + general_playerwidth - 1, spritey, "item") === true || blockexists(spritex, spritey + general_playerheight, "item") === true || blockexists(spritex + general_playerwidth - 1, spritey + general_playerheight, "item") === true) {

    if (toblock(spritex, spritey) == 11) {
        $("#diamcount").html(++general_numdiamonds);
    }
    else if (toblock(spritex + general_playerwidth - 1, spritey) == 11) {
        $("#diamcount").html(++general_numdiamonds);
    }
    if (toblock(spritex, spritey + general_playerheight) == 11) {
        $("#diamcount").html(++general_numdiamonds);
    }
    else if (toblock(spritex + general_playerwidth - 1, spritey + general_playerheight) == 11) {
        $("#diamcount").html(++general_numdiamonds);
    }

    if (toblock(spritex, spritey) == 10 || toblock(spritex + general_playerwidth - 1, spritey) == 10 || toblock(spritex, spritey + general_playerheight) == 10 || toblock(spritex + general_playerwidth - 1, spritey + general_playerheight) == 10) {
        if (keyY == 1) {
            if (general_slowmo > 5) {
                spritey++;
            }

            onground = true;
            jump = 0;
        }
        if (keyY == -1) {
            if (general_slowmo > 5) {
                spritey--;
            }

            onground = true;
            jump = 0;
        }
    }
}


p0x = spritex;
p0y = spritey;
jumpp0 = jump;
keyXp0 = keyX;
keyYp0 = keyY;
ongroundp0 = onground;
}

とにかく私が言おうとしているのは、なぜそんなに遅いのか聞きたいということです。そして、あなたが私と同じ結果を得るなら。

多分それは私がキャンバスの上にdivを置いたからですか?

4

2 に答える 2

1

Firebugアドオンを使用している場合は、それが理由である可能性があります。

Chromeでは非常にスムーズに実行されますが、Firefoxでは非常に遅く、遅れるキャンバスでも同じ問題が発生しました。無効firebugにした後、FirefoxではChromeで動作するよりもさらに高速に実行されました。

お役に立てれば。

于 2013-06-25T16:56:33.290 に答える
0

Firefox18.0.2を実行しているMacOSX 10.8.2を使用しています。実際には、Chrome25.0.1364.99よりも高速でスムーズにゲームを実行できます。偶然にも、私のFirefoxは19.0にアップデートされたばかりですが、それでも問題なくスムーズに見えます。

ゲーム内のJS/ライブラリと競合する可能性のある拡張機能を実行していないことを確認してください。Firefoxのすべての拡張機能を無効にして、もう一度試してください。また、完全に再インストールすると、速度低下の考えられる原因を排除するのに役立ちます。

于 2013-02-24T23:49:23.307 に答える