taki
taki73_cat
新しいバージョンをデプロイした直後、ユーザーの画面が真っ白になる。
コンソールにはChunkLoadErrorの文字。フロントエンド開発をしていれば一度は遭遇する問題ではないでしょうか。
この問題の正体は「バージョンスキュー」です。 ブラウザに残った古いHTMLが参照するJSチャンクが、デプロイ後のサーバーには存在せず404になり、画面が壊れます。
本トークではまずチャンク分割とバージョンスキューの仕組みを図解し、なぜこの問題が構造的に避けられないのかを明らかにします。
その上で、Error Boundaryによるリカバリー、外部ストレージでの旧アセット保持、バージョンチェックによる事前検知など複数の対策を比較検討します。
最後に、Next.js+コンテナデプロイの環境で実際に対策を導入した過程と得られた知見を共有します。