別タブを見ていたりスリープ画面になった場合に
setIntervalはバッグラウンドで停止する
つまりゲームの整合性に支障があると思いますが、
JSでオンラインゲームは成立させることは難しいということなのでしょうか
WebsocketとsetIntervalを使ってますがsetIntervalはどうしても監視処理に必要です。
気になる質問をクリップする
クリップした質問は、後からいつでもMYページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
回答6件
0
setIntervalはバッグラウンドで停止する
つまりゲームの整合性に支障があると思いますが、
単に、「それで整合しなくなる作り方が間違っている」だけではないでしょうか。
投稿2024/08/24 01:04
総合スコア145930
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2024/08/24 01:23
2024/08/24 01:24
2024/08/24 01:30 編集
2024/08/24 01:35 編集
2024/08/24 01:34
2024/08/24 01:53 編集
2024/08/24 01:54
2024/08/24 14:05
2024/08/24 23:06 編集
2024/08/25 00:02 編集
2024/08/25 00:09
2024/08/25 01:57 編集
2024/08/25 02:13
2024/08/25 13:51 編集
2024/08/25 13:47
0
JavaScriptでちょっとした自作のゲームを作ったことがあるので、その経験から、ghjuirrt2さんの質問の意図を下記のように推測しました。
例えば秒速2ピクセルでキャラクターが移動するとして(ここでsetInterval
やrequestAnimationFrame
を使い、要素のstyle.top
やstyle.left
に座標の数値を代入する)、そのキャラクターが描画されているタブがアクティブであれば、10秒後には20ピクセル移動しているのに対し、そのタブが非アクティブの場合には、10秒後にタブをアクティブにしても20ピクセル先に移動していない。
そのようなことがないように、タブがアクティブか非アクティブかを問わずに10秒後には20ピクセル先に移動していてほしい。
であれば、setInterval
やrequestAnimationFrame
を使うのはいいのですが、時間の経過を、第二引数で指定した時間に依存しないようにする必要があります。
先に良くない例を示します。
JavaScript
1(function () { 2 let x = 0; 3 setInterval(function move() { 4 character.style.left = x + "px"; 5 x += 2; 6 heavyFunction(); 7 }, 1000); 8})();
上記のようなコードでは10秒後に20ピクセル移動していることが保証されません。heavyFunction
が処理に時間がかかる関数である場合、次にmove
関数が実行されるのが2秒後、3秒後になることもあるからです。第二引数に1000
と指定して保証されるのは1秒以上経過してから実行することのみです。
次に、時間の経過を、第二引数で指定した時間に依存しないようにした例を示します。
JavaScript
1(function () { 2 let startTime = new Date().getTime(); 3 setInterval(function move() { 4 let x = Math.floor((new Date().getTime() - startTime) / 1000) * 2 5 character.style.left = x + "px"; 6 heavyFunction(); 7 }, 1000); 8})();
上記の例では、move
関数の中で改めてnew Date().getTime() - startTime
によって経過時間を計算し、経過時間に基づいた移動量を求めたうえでleft
プロパティに代入しているため、heavyFunction
で時間がかかったとしても、途中の描画が省略されるだけで、経過時間に対する移動量は保証されます。
後は必要に応じてサーバーが保持している座標とずれがないか確認する処理や、サーバーが保持している座標の情報を更新する処理を入れることになります。
DOMという言葉が出てきたのでstyle.left
を使って説明しましたが、canvas
で描画する場合でも基本的な考え方は同じです。
投稿2024/08/30 07:35
総合スコア130
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
0
もしかしたら質問自体がなにか誤解を産むような内容だったりしませんか?
個人的に思ったのはゲームなんて電源切ったら終わるのは当然だし、プロセスが終了して処理を続行できなかったら負けってことに当然なるのでは?と思いました。
ゲームオタクでは無いので常識が分からないのですが、スマブラなどやっててもホームに戻ったら対戦終了しません...?
多分そういうことを聞きたい訳じゃないとは思うのですが、こういう風にしか読解出来なかったです。
うーん。ほかの意図としてはjsでタブのライフサイクルを取得できないか?みたいな意図だったりするんでしょうか。
スマホとかだと、アプリを開いた時と閉じた時にイベントが発生するのでそのタイミングでログインログアウトみたいなことができ、MMOみたいな?ずっとログインし続ける系のゲーム(オートセーブ的な?よくしらんが)とかも上手く制御できるかと思いますが。そういう話?
ほかの回答で「作り方が間違ってる」というのがありますが、これは決め付けでしかないし、回答として意味を成してない(作ってる本人はそれがミスかどうかなど分かるはずがない)ので、通報でもして溜飲を下げるのがいいと思います。
反応しすぎて治安悪くなるのもアレかなと思います^^;
投稿2024/08/24 09:23
総合スコア267
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2024/08/25 00:06
2024/08/25 03:46
2024/08/25 04:05
2024/08/25 14:20 編集
2024/08/27 14:36
2024/08/28 07:28 編集
2024/08/28 07:30
2024/09/06 01:44
2024/09/06 06:23
2024/09/06 06:32
0
[香車]東上☆Aho(英帆)☆海美は、複数のゲームを立ち上げた状態で、生配信したことがある「
一番手前じゃないと止まってしまうゲームあるんだけれど、そういうのは、『ながらプレーをやってほしくない』という意思の表れだと思ってました。なので『
別タブを見ていたりスリープ画面になった場合に setInterval はバッグラウンドで停止する。
つまりゲームの整合性に支障があると思いますが...
』というのが、理解できないので『
単に、「それで整合しなくなる作り方が間違っている」だけではないでしょうか。
』に同意します。
」
投稿2024/09/14 17:20
総合スコア504
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
0
質問者さんの意図がわからないところを回答すると喧嘩腰なので回答しづらいですが、たとえばwindowをblurしたらオーバーレイしてユーザーに処理を隠すとかやり方次第では?
html
1<style> 2#overlay{ 3outline:none; 4border:solid 0px; 5background-Color:lightgray; 6} 7#overlay::backdrop{ 8background-Color:lightgray; 9 10} 11</style> 12<script> 13window.addEventListener('blur',()=>{ 14 overlay.showModal(); 15 overlay.addEventListener('click',()=>{ 16 overlay.close(); 17 }); 18}); 19</script> 20<dialog id="overlay"> 21フォーカスが外れました。クリックしてください 22</dialog>
投稿2024/08/26 01:22
総合スコア116443
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
あなたの回答
tips
太字
斜体
打ち消し線
見出し
引用テキストの挿入
コードの挿入
リンクの挿入
リストの挿入
番号リストの挿入
表の挿入
水平線の挿入
プレビュー
質問の解決につながる回答をしましょう。 サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。 また、読む側のことを考えた、分かりやすい文章を心がけましょう。