AIと一緒にアプリをつくっていて、こんな要望が出てくることはありませんか？
- 「相手が入力したら、こっちの画面もすぐ変わってほしい」
- 「今だれがこのページを見ているか、表示したい」
- 「注文の状況を、更新ボタンなしで変えたい」
これが「リアルタイム」です。名前はカッコいいですが、実は考え方はシンプル。この記事では、小さな対戦ゲームをつくってみた経験をもとに、リアルタイムの仕組みと、使いどころ・落とし穴をまとめます。
まず、ふつうの画面は「見に行く」
ふつうのウェブの画面は、こう動いています。
画面を開いたとき、またはボタンを押したときに、サーバーに「最新ありますか？」と聞きに行く
郵便受けにたとえると、自分で何度もポストを見に行くイメージです。何も来ていなければ、無駄足になります。かといって頻繁に見に行くと、手間がかかります。
リアルタイムは「届く」
リアルタイムは、つなぎっぱなしにしておいて、何かあったら向こうから届く仕組みです。
電話を繋いだままにして、「あ、更新あったよ！」と向こうから知らせてもらうイメージです。画面を更新しなくても、相手の操作がすぐ反映されます。
私が試したこと：2人で遊ぶ三目並べ
私は、仕組みを理解するために、2人で遊べる三目並べを小さくつくってみました。
1つのパソコンでタブを2つ開いて、Aliceの画面とBobの画面にします。Aliceが真ん中に「X」を置くと、更新ボタンを押していないのに、Bobの画面にも「X」が現れました。Bobが「O」を置くと、Aliceの画面にもすぐ出ます。
「おお、動いた」と、素直に感動しました。
使われている2つの役割
リアルタイムでよく使われるのは、次の2つの役割です。
① 放送：出来事を全員に伝える 「Aさんがここに置いた」というその瞬間の出来事を、同じ部屋にいる全員に伝えます。チャットのメッセージや、ゲームの1手がこれです。
② 出席簿：今だれがいる？ 「今、だれが部屋にいるか」の名簿を、みんなで共有します。誰かが入ってきたら名簿に載り、タブを閉じたら名簿から消えます。「オンライン中の人」の表示がこれです。
私の実験では、タブを閉じてから、相手の画面の名簿から消えるまでは、1〜3秒でした（1回きりの観測です）。
私が一番つまずいたこと：途中から入った人
ここが、一番の学びです。
三目並べが少し進んだところで、3人目の観戦者を入れてみました。すると…
名簿には「3人いる」とちゃんと出ているのに、盤面は空っぽでした。
なぜでしょう？
「放送」は、その瞬間に流れるものです。ラジオ放送を、途中から聴き始めた人は、さっきまでの内容を知りません。同じことが起きていたのです。
一方で、「出席簿」は今の状態なので、途中から入っても、ちゃんと最新の名簿が見えます。
解決方法は、入ったときに「今の状態を教えて」と聞くことでした。聞かれた人が「こうだよ」と答えると、途中参加の人の画面も追いつきます。
この学びを、一般的な言葉にすると、こうなります。
リアルタイムは「今」を伝えるのが得意。でも「過去」は覚えていない。 過去を残したいなら、別の場所に保存しておく必要がある。
AIに頼むときも、「リアルタイムで更新したい」だけでなく、「途中から入った人にも、最新の状態が見えるようにしたい」「履歴は残したい？ 残さなくていい？」まで伝えておくと、あとで困りません。
向いている場面・向いていない場面
向いている – ゲームの盤面、対戦 – 「今だれがここを見ている？」の表示 – チャット・コメントのやり取り – 配送状況・在庫の変化の表示 – 共同編集の「入力中…」表示
向いていない（別の方法が合う） – 履歴をずっと保管したい記録 – 一字一句、必ず届いてほしい重要な通知 – 1日1回で足りる集計 – 大量のデータを一度に配る処理 – 過去の出来事を、後から見返す用途
目安は、「すぐ見えること」が価値になるか。「すぐ」が要らないなら、ふつうの「見に行く」仕組みで十分なことも多いです。
見落としやすい注意点
① 部屋は、誰でも入れる設定になっていることがある
私のデモは、ログインなしで動きました。便利ですが、それは部屋が「誰でも入れる」設定になっていたからです。実際に、設定画面を見ると、最初から「公開」が許可されていました。
つまり、仕組みを知っている人なら、部屋に入って、偽のメッセージを送ることもできてしまいます。ゲームなら「偽の手を送られる」、チャットなら「なりすまし」です。
本当に使うときは、「ログインした人だけ」「許可された人だけ」が入れる部屋に切り替える方法があります。ここは私は今回確かめていません。大事な部分なので、AIに「この部屋に入れる人を限定したい」と相談する価値があります。
② 一度にたくさん送ると、上限にあたる
無料で試せる範囲には、同時につなげる人数や1秒に送れるメッセージの数に上限がありました。三目並べなら十分ですが、「マウスの動きを全員にリアルタイムで見せたい」のような用途は、すぐ上限に近づきそうです。
③ ルールの判定を、どこでやるか
私のデモは、「誰の番か」「勝ったか」の判定を、画面側だけでやっていました。そのため、不正な操作をされたら、止められません（試してはいませんが、仕組み上そうなります）。お金やポイントが絡む場合は、判定をサーバー側でやる設計が必要です。
AIに頼むときの言葉
- 「更新ボタンなしで、相手の操作がすぐ反映されるようにしたい」
- 「今だれがオンラインかを表示したい」
- 「途中から入った人にも、最新の状態が見えるようにしたい」
- 「履歴を残す必要はある？ 残すなら別に保存してほしい」
- 「この部屋に入れる人を限定したい。ログイン済みの人だけにできる？」
- 「不正な操作を防ぐには、どこで判定すればいい？」
私が確かめられていないこと
- 別々の端末・別々のネットワークからの接続（1台のパソコンのタブで確認しました）
- 人数が増えたときの、速度や安定性
- 「入れる人を限定した部屋」の設定
- 不正な操作を実際に試すこと
まとめ
- リアルタイム＝見に行くのではなく、向こうから届く
- 2つの役割：放送（出来事を伝える）と、出席簿（今だれがいる）
- つまずきポイント：放送は過去を覚えていない。途中から入る人には「今の状態を教えて」の工夫が要る
- 部屋の公開設定、上限、ルールの判定場所には、注意が必要
- 「すぐ見えること」に価値がある場面で使う
画面が「勝手に変わる」のを初めて見たとき、ちょっと魔法みたいに感じました。でも仕組みは「つなぎっぱなし」と「名簿」と「放送」。そう思うと、AIに相談するときの言葉も選びやすくなると思います。
もっと詳しく知りたい方へ（技術編・Qiita）
実際に手を動かした記録を、Qiitaに書きました。
Leave a Reply