edge-yacht - Cloudflare Workersで動作するマルチプレイヤーゲーム
(yacht.seokmin.dev)こんにちは。普段はGeekNewsを読むばかりでしたが、最近 Cloudflare Developer Challenge (https://challenge.developers.cloudflare.com/) に参加したプロジェクトを共有したくて投稿します :)
遊び方は、メイン画面の Create Room ボタンを押して、次の画面に表示されるリンクを共有するだけです。そのリンクに接続した2つのブラウザ同士でセッションを構成してマルチプレイヤーゲームを進行し、この一連の処理はすべて Cloudflare Workers 上で行われます。リポジトリはこちらです。
https://github.com/SeokminHong/edge-yacht
Cloudflare Developer Challenge は、Cloudflare のプロダクトである Cloudflare Workers、Cloudflare Pages、Workers KV、Durable Objects を2つ以上活用して面白い作品を作り、投稿するプログラムです。こうしたプロダクトを知って参加するきっかけになったのが GeekNews だったので、なおさら共有したくなりました!
Cloudflare Workers は、サーバーレスコードをグローバルエッジにデプロイできるようにし、WebSocket と Durable Objects による coordination をサポートします。実際、これを活用してすでにオンライン上でマルチプレイヤー Doom を動かすデモが披露されています。 (https://blog.cloudflare.com/doom-multiplayer-workers/) これに触発され、約1か月の開発期間で2人用マルチプレイヤーゲームをゼロから作ってみようと思いました。
ゲームのデザインとルールは、Nintendo Switch の 51 Worldwide Games というミニゲーム集に収録されている Yacht を参考にしました。クライアント側でゲーム状態を改ざんできないよう、ゲーム状態のミューテーションはすべて Workers で実行し、クライアントは JavaScript 3D ライブラリ three.js を使って状態をシミュレーションします。開発期間が短く、オーディオやエフェクト、デザインなどで妥協した部分も多いですが、ひとまず動くゲームを完成させられたので、ここに投稿します。
2件のコメント
わあ!! ヤッチですね。サイコロさえあればできるので、私も好きなゲームです。完成おめでとうございます。
試しにブラウザを2つで接続してみたら、とてもきれいにしっかり動きますね。
エッジで動くマルチプレイヤーゲームには、十分意味があると思います。
ありがとうございます!GeekNewsのおかげで、こういうプロダクトに関するニュースに触れることができましたね(笑)