想定外の高負荷

いよいよ満を持して中型イベント専用アプリ（期間限定ランキング）開発に着手しました。
技術スタックはReact（Next.js）、Phaser 4、Laravel APIで、
主にフロントエンドコンテナのAPIはNext.js、スクロールなどweb的な動きをさせたい部分はReact、
ゲーム的な動きをさせたい部分はPhaser、サーバーサイド処理をLaravelに任せるといった構成です。
このうちPhaserはいわゆる2Dブラウザゲームを作るためのゲームエンジン的なもので、今回が初使用。
自分はまったく存じ上げませんが、実装主体はCodexに全面的に任せる方針を採用しているため、
ネットにノウハウさえ転がっているなら実務経験ゼロでも採用できるというわけです。
年初にほんの少しPICO-8に触れたことを除けば、本格的にゲーム系プラグインに触れるのはこれが初めてとなります。

が、いざスタートしてみると思いもよらぬところで壁にぶち当たりました。
開発していると頻繁にMacbookのWindowServerが落ち、そのタイミングで強制再起動がかかってしまうのです。
最初、これは最近アプデしたmacOS 26.4.1に固有の不具合なのかと思っていました。
ChatGPTに確認すると確かに当該バージョンでWindowServerが落ちるという報告があると言うので。
ただ、あまりにも頻繁に再起動するので、もしこれが世界中のユーザー環境で起きているならもっと騒ぎになっているはず。
そうでないということは、この開発のせいでは？
……と思いアプリ側、特にPhaserの設定を見直したところ、あっさり改善しました。
アプリの描画負荷があまりにも高かったので、
OSのウィンドウレンダリングを司るプロセスをクラッシュさせてしまっていたわけです。

今回作成しているwebアプリはそれほどレンダリングに負荷を与えるものではないと思っていました。
3Dアクションを作っているわけでもないし、そもそも常時何かが動いているわけでもない。
しかしまさかOSのコアプロセスをクラッシュさせるなんて……。
この辺はAIに任せきりでは大変な負荷がかかるものだと思って、
意識的にレンダリング負荷を落とす工夫を盛り込む必要があると感じました。
今回のこれは自分の環境で動けばOKというものではなく、参加希望者すべてのPCで無事に動かなければなりません。
自分の開発環境であるMacbook Pro M1 Maxはそこまでスペックが低いとも言えないので、
この環境で落ちてしまうようでは先が思いやられます。

開発自体は思っていたより10倍順調なのですが、
レンダリング負荷などのように当初想定していなかった作業は他にもありそうな予感がしています。
一番良くないのはリリース後にそれが発覚することなので、とにかく多方面からテストする必要はありそう。

余談ですが、YouTubeで2017年のアニメ『けものフレンズ』が期間限定で全話無料公開されていたので、
作業のお供に流していました。観たのはほぼ９年ぶり（#04864 / 2017年05月01日）でしたがやはり面白いですね。
内容について語り出すとまた止まらなくなるので割愛しておきますが。
ガッツリ作業するときのお供にアニメ、意外と悪くないかも？