「SPAじゃないから」と諦めない。View Transition APIで実現するMPAのスムーズな画面遷移 by こだまゆうや

私はこれまで、大規模かつレガシーなMPAサイトの保守・運用に携わっていました。現場では「SPAいいな」と憧れつつも、大掛かりなリプレイスは現実的ではなく、モダンな画面遷移の提案を諦めていました。本セッションで紹介する「View Transition API」は、そんなかつての私と同じような制約下にあるエンジニアへの一つの回答となる標準技術です。

この技術の最大の特徴は、既存のHTML構造を維持したままCSS数行から導入でき、未対応ブラウザでもサイトが壊れない「プログレッシブ・エンハンスメント」の考え方にあります。リスクを最小限に抑え、ブラウザの標準機能だけで心地よい体験を後付けできるため、実務において非常に現実的な選択肢となります。

本セッションでは、MPAでの基本的な実装方法や、擬似要素によるスナップショットの仕組み、そしてDOMをクリーンに保つことによるアクセシビリティ上のメリットまでデモを交えて解説します。大規模サイトを保守している方はもちろん、クライアントへ低コストかつ効果的な改善提案をしたいエンジニアやディレクターの方に向け、フレームワークに頼らず「もっと良い体験」を届ける第一歩をお伝えします。