不要な要素はちゃんと削除しよう【enchant.js】

enchant.jsでは画面に追加した要素はプログラムの変数とは別の存在になっているようで、削除の手続きをしてあげないと消えないようです。少量だと問題ないですが多くなると実行処理の負担になってたりします。なので不要になったものはきちんと削除してあげましょう。

とはいえ、例えば敵キャラを倒したりするたびにそのキャラの要素を削除する必要はないです。敵キャラなどは状態を「死」にしておいて画面外に放りだしておけばOKです。要素を削除したり新たに生成するのは結構負担が大きいようなのでメインループ内では基本使わない方が良いと思います。

要素の削除で重要なのはシーンの切り替え時です。

シーンの切り替え時に全部消す

例えば会話シーンなどを作ってゲーム画面に出した後にその要素をちゃんと削除せずにいるとずっとその要素は残り続けます。そしてまた別の会話シーンで要素を生成して、また別の会話シーンで・・とやっていると使った要素が蓄積されてそのうち処理が重くなってきます。

なのでシーン切り替えの時はいらなくなったシーンをしっかり削除しましょう。

function removeScene(scene){
    while(scene.firstChild){
        scene.removeChild(scene.firstChild);
    }
}

上記の関数をシーンを切り替える際に消したいシーンを引数にして呼び出してやります。これでシーン内の子要素はすべて削除できます。

こんな感じでシーン切り替えの際にシーンの子要素をすべて削除してやればきれいさっぱり消えてなくなってくれます。

※実はGameオブジェクトにもremoveSceneというメソッドがあるんですが、これがどうもちゃんと要素を消してくれないんですよね(;´Д`)

どのゲームで遊ぶ?

簡単な計算問題を制限時間内に何問解けるかな?頭の体操にどうぞ。
同色4つ以上つなげると消えます。一度の操作だけで全部が消えるようにするパズルゲーム。
ひったくり犯を追いかけるランゲー。道に落ちている障害物には気を付けて。
一つだけある空欄を使ってタイルを入れてマッチを作る落ちもの系パズルゲーム。ちょっと難しい。

コメント欄

※コメントはまだありません※

コメントを残す

メールアドレスが公開されることはありません。

ゲームタグ一覧

ゲーム開発書籍(amazon)

HTML5 ゲーム開発の教科書 スマホゲーム制作のための基礎講座
ゲームを作りながら楽しく学べるHTML5+CSS+JavaScriptプログラミング[改訂版] (Future Coders(NextPublishing))
改訂2版 はじめて学ぶ enchant.jsゲーム開発