今週やったこと
フロントエンドの画面実装
APIからデータを取得するなどの機能面は実装済みでデザインがまだ仮の状態だった画面の実装を進めました。
改めてFigmaを見ながら実装していろいろ学びが多かったです。
SeleniumでGoogleアカウントにログイン方法の調査
SeleniumでGoogleアカウントにログインしたい場面があり、ローカルでは動作していたのですがAWSのMWAAで動かしてみたところボット判定に引っかかりエラーになりました。
今回初めて知ったのですがheadlessオプションの有無でボット判定される場合が多いらしく、確かにローカルではheadlessオプション無しにして画面遷移を見ながら動作確認していてログイン成功していて、試しにローカルでもheadless有りにするとボット判定されるようになりました。
MWAAだとheadlessオプション有りで実行する必要がある(たぶん)ので、headlessで実行する方法を調査しています。
user-agentを見直したりする過程で改めてブラウザの動作やweb通信の仕組みを学び直したいと思います。
今週学んだこと
SQSのSendMessageメソッドの仕様
現場でSQSを使うことになったので、基本的なメソッドの仕様を調べました。
この機会に非同期処理のベストプラクティスなども調べていきたいです。
HTMLタグとpixel値
これまでFigmaのデザインだけを見て目視で大体文字の大きさはこれぐらいかなと想像しながらフロントエンドの実装をしていたのですが、Figmaで文字の大きさなどもpixel値が表示されていることを最近知りました。
なので、以下のサイトのようにHTMLのタグとpixel値を調べて実装すればもっと効率的に業務が進められそうだと思いました。(h4タグは16pxなど)
おそらくこういうすでに仕様が決まっている分野に関しては生成AIが活用しやすいと思うので、使い方をいろいろ探っていきます。
自分でFigmaを使い機会を増やせるともっとフロントエンドの業務が効率化できると思うので試してみたいところです。
参考になった記事など
ストリートファイター6とGoogle Cloud関連
あまり考えたことなかったですが、ゲームでもクラウドインフラが関連してくるということを知りました。
ストリートファイターのようなネットワークに対応したゲームタイトルでは、ユーザーがクライアント（ストリートファイター6ではソニーのPlay Station 4/5、Microsoft Xboxシリーズなどのコンソールゲーム機、ゲーミングPCなど）から、インターネット経由でカプコンが用意しているサーバーに接続し、そのサーバー上で対戦相手が決定し、インターネット経由での対戦が行われることになる。
Play StationとかXboxなど違うプラットフォームでも対戦できるみたいで、対戦相手を決める際などはインターネット経由の通信になるみたいですね。
なお、対戦相手が決まった後は、P2P（Peer to Peer）接続で、ユーザーのクライアント間での直接通信が行われ、実行されたコマンド（パンチするとかキックするとか）の情報が相互にやりとりされてゲームが進行していく形だ。
やっぱり対戦ゲームなどは反応速度がかなり重要だと思われるので、対戦中はP2Pでレイテンシーを極力減らしているんですかね。
カプコンの井上氏は「われわれはこうしたゲームタイトルをグローバルに展開している。このため、ユーザーは世界中に散らばっており、どこのリージョンに属するユーザーでも安定して使えるようにネットワーク周りの設計をしていかなければならない。また、こうしたタイトルではリリース直後にはものすごくユーザーが増えるが、そうではなくなるとユーザー数が減るなど、ユーザーの数がさまざまな理由で増減する。従って、インフラもそれに応じてスケールできるようにすることが重要だ」と述べ、安定して利用できること、そしてユーザー数の増減に合わせてスケールできることが条件となっており、今回のストリートファイター6ではGoogle Cloudを選択したのだと説明した。
かなり難易度が高そうで読んでいて面白かったです。
