個人開発したブラウザゲーム「ねこタワー」に、2人で遊べるオンライン対戦機能を追加した。

オンライン対戦では、別々のブラウザで遊んでいる2人の間で、次のような情報を共有する必要がある。

• 対戦相手を待っているプレイヤー
• 対戦に使う部屋
• どちらのターンか
• プレイヤーが行った操作
• 勝敗や切断状態

これらを共有するために、ねこタワーではFirebaseを使っている。

ねこタワーで使っているFirebaseの機能

実装を確認すると、主に次の2つを使っていた。

• Firebase Authentication
• Firebase Realtime Database

Authenticationでは匿名ログインを行い、プレイヤーごとのIDを発行している。

Realtime Databaseには、マッチングの待機列や対戦部屋、プレイヤーの入力状態などを保存している。データが更新されると、対戦相手側のブラウザでも変更を受け取れる。

かなり単純化すると、Firebaseは次のような位置にいる。

プレイヤーAのブラウザ
        ↓ 書き込み
     Firebase
        ↓ 更新を通知
プレイヤーBのブラウザ

動いたが、理解しきれてはいない

オンライン対戦の実装は、AIの支援も使いながら進めた。

そのため、実際に対戦できるところまでは作れたが、Firebaseが内部で何をしているのか、自分の言葉で説明できるほど理解できているわけではない。

例えば、まだ次のような疑問がある。

• なぜFirestoreではなくRealtime Databaseを使っているのか
• 匿名ログインは何のために必要なのか
• データの変更は、どのように相手へ通知されるのか
• 複数人が同時にマッチングを始めても問題は起きないのか
• Security Rulesでは何を制限する必要があるのか
• Firebaseを使わない場合は、どんなサーバーが必要になるのか

一度に全部理解しようとすると重いので、ねこタワーの実装を読みながら、疑問ごとに少しずつ整理していこうと思う。

今回は、Firebaseが単なるデータの保存場所ではなく、別々のブラウザ間で状態を共有する役割も持っていることが分かった。