MPA View Transitions are here!
summary
View Transitions now support multi‑page apps so clicking a same‑origin link can produce a seamless animation. Chrome ships cross‑document View Transitions in Chrome 126, SPA code still uses document.startViewTransition, and pages opt in with navigation: auto. The browser captures pixel snapshots, injects pseudo elements, exposes page‑swap and page‑reveal events to name elements before render, and offers CSS animation hooks and a render‑blocking meta. Demos run and the feature is documented on developer.chrome.com.
AI-written summary · about
chapters (10)
- 0:00Introduction
- 1:22View transition concepts
- 3:48Technical mechanics
- 7:18Pseudo-element trees
- 10:09Customizing animations
- 13:16Multi-element transitions
- 17:48Practical implementation
- 21:00Transition lifecycle
- 22:48Cross-document transitions
- 26:16Advanced control and closing
related talks
10mView Transitions: The brand-new browser API that will blow your mind
26mAn Animated Journey through the new Page Transition API
32mSupercharge Web UX with View Transitions!
04mIntuitive Web Experiences with the View Transitions API
22mFLIP no more; Viva View Transitions
19mView Transitions: Fact vs. Fiction
13mBringing page transitions to the web
49mSupercharge Web UX with View Transitions