読者です 読者をやめる 読者になる 読者になる

凹みTips

C++、JavaScript、Unity、ガジェット等の Tips について雑多に書いています。

Unity WebGL x WebSocket でみんなで自由にブロックを置いて遊べるブラウザゲームを作ってみた

Unity HTML5 Node.js

はじめに

Unity WebGL x WebSocket でたくさんのオブジェクトを同期する前回の仕組みを利用して、データの永続化の実験をしてみました。

デモ

マイクラもどきです。全員がログアウトしてもデータをサーバに保持しておくようにしました。みなさんのご協力のお陰で面白い空間ができたと思います!ありがとうございます。

よくよく考えると別に WebGL ビルドしなくてもデスクトップアプリとしても動くので同時に配布しました。WebGL だとやっぱり表現力が弱いので見た目はデスクトップアプリのほうが綺麗ですね。

ブロックの数が現状かなり多いので重くて動かない可能性もありますがご了承下さい。

コード

コードは前回と同じ場所にプロジェクト一式あげてあります。

仕組み

f:id:hecomi:20150112160844p:plain

基本的には前回と同じ仕組ですが、isSavedToServer フラグの立ったオブジェクトに紐付いたコンポーネントはサーバ側に永続化されるようにしました。例えば保存されているファイルは以下の様な感じです。

これを各クライアントのログイン時に送って復元しています。後は前回と同じようにログインしている各クライアントのローカルな情報を随時サーバ経由でブロードキャストします。

反省

バグをいくつか出しながらも、みなさんのご協力のお陰で何とか遊べるレベルにはなったのではないかと思います。

ただ、オブジェクトはいくらでも置けるようにした結果、現在保存されているデータは 31000 行くらいあり、ブロックに1つにつき位置情報を保存するコンポーネントと色情報を保存するコンポーネントがついているので、合計で 15000 個くらいのブロックが置かれていることになります。ご体験いただいた or お察しの通りめちゃくちゃ重いです。

この後、renderer.material.color にアクセスするとマテリアルのコピーが走るのでキャッシュしてダイナミックバッチングが効くように、とか色々調整してちょっとは軽くなりましたが、それでもまだ重くてしんどいです。ブロックは Particle System で描いてコライダだけ GameObject にするとか、何か色々と工夫しないと厳しそうな感じがしますが、これだけ大量のオブジェクトを同期するのは特殊ケースだと思うのと、このゲームのためだけに最適化しても微妙な気がするので次に移ろうと思います。

おわりに

今回は実験も兼ねていたので、どれくらい行けるか制限を設けずにやってみましたが、思っていたよりはうまく動いたと思います。次は AI をどう動かすかの実験か、WebSocket x サーバデータ保持に代わる WebRTC x LocalStorage の実験をしてみようと思います。