HSPポータル
サイトマップ お問い合わせ


HSPTV!掲示板


未解決 解決 停止 削除要請

2016
1224
K-shsp3dish.js の動作テストについて7解決


K-s

リンク

2016/12/24(Sat) 20:46:02|NO.77701

hsp3dish.jsのウェイト(とサウンド)についてどれくらい環境差があるのか知りたくてデモを作りました。テストご協力頂けないでしょうか。

dish.js のウェイトは ENV.HSP_FPS のオプションで変えられるようなのですが、
試した限りでは 60 に設定しても実際には 40fps くらいしかなりませんでした。
それで 0 に設定すると 60fps になったのでしばらくこれで作っていましたが、
気になってモニタのリフレッシュレートを 75Hz に変えたところ 75fps になってしまいました。

最近はリフレッシュレート 144Hz などのモニタも出ており、60fps 基準で作ったゲームが倍以上の速度で動いてしまってはゲームになりません。

初めは await 16 で一定で動かせるのではと思ったのですが、
実験(http://hsproom.me/program/view/?p=1)してみたら 60Hz→60fps、75Hz→37.5fps という結果に。
垂直同期を待っているとしたら 75Hz だと1回更新タイミングを跨いでしまう(75/2=37.5)のではと予想しています。

次に、前回とのフレーム時間差を利用する方法を試しました。
時間差が 10ms なら 10 加算、15ms なら 15 加算という感じです。
これならリフレッシュレートに依らず一定の早さが実現できたのですが、
慣れていないのもあってこの方法だと以前と同じような動きにするのにかなり苦戦しました。
細かい制御とかタイミングが取りづらいというか…

そこで今回のデモのように実際の経過時間から更新フレームと描画フレームを調整する方法を実装しました。
これなら以前と同じような書き方ができ、かつリフレッシュレートの違いもある程度吸収できます。
ただどうしても 60fps 基準のものを 75Hz などの60の倍数ではない環境で動かすとカクつきが頻繁に発生してしまいます。それでも動作速度が変わってしまうよりかはマシだろうという判断です。
本当は2番目の方法で書ければベストなのかもしれませんが、自分にはちょっと厳しい…

今回のデモはこのフレーム実装がちゃんと動作するかのテストです。
そもそもリフレッシュレートに依存しているのかも定かではないです。
テストは2つあり、1つ目はそのフレームのテスト、2つ目はどれくらい負荷がかけられるかのテストです。

サウンドのテストも兼ねています。
以前、自環境だとループが少し途切れたり音が鳴らなかったりしたのですが、いつの間にか直っていて。
ただその代わり?Chromeは右側からしか音が出ない状況です。

テストに使用した OS とブラウザ、RESULTの4つの数字と、音の再生状況を書き込んで頂けると幸いです。
あとモニタのリフレッシュレート、CPU、ビデオカード等もよければお願いします。
(動作不明ですがスマホ・タブレットも待ってます…)
(100Hz以上、G-SYNC、FreeSyncなモニタも気になる…)

テストページ: http://hsproom.me/program/view/?p=203

サンプル動画: https://youtu.be/nzoL1hD3Gb0

Win 10, Cpu i5-4570 3.2GHz, GTX 650Ti
Firefox 50.1.0 : 音OK
(60Hz) 1000, 966, 60, 354
(75Hz) 1000, 1000, 75, 346
Chrome 55.0.2883.87 m : 音右側しか鳴らない
(60Hz) 1001, 973, 60, 320
(75Hz) 1000, 1000, 76, 316
Edge 38.14393.0.0 : 音鳴らない
(60Hz) 1000, 968, 60, 259
(75Hz) 1000, 992, 76, 256



この記事に返信する


inovia

リンク

2016/12/24(Sat) 21:48:50|NO.77703

【環境1】
Win 10, Core i7 4790K (4.56GHz) / GTX 980Ti
HDMI 2.0 / Display Port1.2 3840x2160 60Hz 32bitカラー
(トリプルディスプレイ)

(※1080Pに下げても75Hzに設定できず。ディスプレイ側が60Hzまでぽい。)

-------------------------- Chrome 55.0.2883.87 m Firefox 50.1.0 Edge 38.14393.0.0 IE 11 -------------------------- Chrome 音右側しか鳴らない Firefox 音OK Edge 音が出ない IE 音が出ない -------------------------- Chrome 1000 900 60 406 Firefox 1000 892 60 128 Edge 1000 1000 60 300 IE 1000 990 61 170 --------------------------



inovia

リンク

2016/12/24(Sat) 22:05:43|NO.77704

【環境1(3840x2180、24Hz)】

-------------------------- Chrome 1000 370 38 0 // 真ん中のプログレスバーが一番最後 Firefox 1000 379 24 0 // 真ん中のプログレスバーが一番最後 Edge 1000 1000 60 319 // ↑と挙動が違う。60Hzと同じ動きをしている。 IE 1000 1000 61 168 // ↑Edgeと同じ動き --------------------------

75Hzに設定できなかったので、環境1にて24Hzで実験。
EdgeとIEがリフレッシュレートを無視してるような…?



MillkeySoftware

リンク

2016/12/24(Sat) 22:40:39|NO.77706

Windows 10 Pro Insider Preview 14986.1001
Intel G530 (Celeron 2.40MHz)
nVidia 740GT (32Bit 60Hz)[GF-GT740-LE1GHD/OC]
-------------------------------
IE 11 : Ver 11.1000.14986.0 - 1000 946 61 58 - サウンド両方でない。
Edge : Ver 39.14986.1000.0 - 1000 950 60 75 - サウンド両方でない。



inovia

リンク

2016/12/24(Sat) 22:48:09|NO.77707

【環境1(1920x1080、75Hz)】
(※古いディスプレイを引っ張り出してきた)
--------------------------
Chrome 1000 842 60 421
Firefox 1000 943 60 445
Edge 1000 1000 60 318
IE 1000 1000 61 176
--------------------------

75Hzにしてみたけど…? 60で止まってる。
ディスプレイ側の情報を見ると75Hzで出力されている…。
あれれ?と思っていろいろ試したところ、
複数のディスプレイを使っていて(拡張)リフレッシュレートが異なる場合は、
75Hzに設定したディスプレイにブラウザを置いても、
レートが小さいほうに合わせてるみたいですね。(多分)

というわけで、1台だけで測りなおしたら、75出ました。
--------------------------
Chrome 1000 999 75 413
Firefox 1000 942 75 485
Edge 1000 1000 75 326
IE 1000 1000 76 176
--------------------------

というわけで、計測する際はディスプレイ1台のみで計測したほうが良さそうです。



inovia

リンク

2016/12/24(Sat) 23:09:01|NO.77710

【環境2】
macOS Sierra 10.12.2 [MacBook Air (13-inch, Early 2015)]

--------------------------
Chrome 55.0.2883.95 (64-bit)
Firefox 50.1.0
Safari 10.0.2
--------------------------
Chrome 音右側しか鳴らない
Firefox 音OK
Safari 音が出ない
--------------------------
Chrome 1000 958 61 149
Firefox 1000 957 61 241
Safari 1000 946 60 119
--------------------------

ChromeとFirefoxについてはWindows版と同じ音の鳴り方をしてますね。



zakki

リンク

2016/12/25(Sun) 15:32:29|NO.77717

ブラウザの制限上awaitやwaitの精度がかなり落ちるので、ブラウザ特化でリアルタイム描画のゲームを
作るならHSP_FPS=0でrequestAnimationFrameが使われるようにして、
ブラウザの再描画間隔とhspの再描画タイミングを合わせるように指定すると滑らかに動作します。
おっしゃるように経過時間分だけ可変で内部時間を進められる場合に限られますが。
音再生周りは何となく鳴るってあたりで実装が止まってるので細かく制御できるといいですね…



K-s

リンク

2016/12/26(Mon) 15:37:08|NO.77729

ご協力ありがとうございます。引き続き募集しています。

音周りは自環境の問題かと思っていたのですが他でも同じようで安心しました。
ブラウザやバージョンの違いみたいですね。

> zakkiさん
HSP部屋もおそらく HSP_FPS=0 で設定されていると思うので
あとはスクリプトの書き方を工夫するしかないと思っています。
上手く書けると良いんですが内容によっては難しくて…
音は個別の音量設定、パン設定あたりができると嬉しいですね。



ONION software Copyright 1997-2021(c) All rights reserved.