React ViewTransitionコンポーネントで実現する、宣言的UIアニメーション by elecdeer

react@experimentalで導入されたViewTransitionコンポーネントは、ブラウザのView Transition APIをReactに統合する新しい組み込みコンポーネントです。

これまでもReactとView Transition APIを組み合わせることは可能でしたが、DOMの更新に対してstartViewTransitionを手続き的に呼び出す必要があり実装が煩雑になりがちでした。ViewTransitionコンポーネントはこのプロセスをReactのトランジションの概念と統合し、マウント、アンマウント、移動といった状態変化に応じたアニメーション実装を簡単にします。

本トークでは、このViewTransitionコンポーネントの基本的な使い方から、ネイティブアプリのような洗練されたアニメーションを実装する実践的なテクニックまで、デモを交えて解説します。