View Transitions in React

Ryan tells Sam about his experiments with using the new View Transitions API in a React photo gallery app. He talks about how he likes the flexibility of the API, how to think about integrating it into any client-rendered app regardless of the framework, and how he used a Promise with an Effect to tie a View Transition to a React Transition. Topics include: 0:00 - Intro 1:11 - What it’s like to integrate View Transitions with React 7:30 - How View Transitions work 16:09 - Building a gallery that animates photos across page navigations 19:38 - How to use startViewTransition for enter/update/exit animations 26:52 - Using a Promise to link a View Transition to a React Transition 43:02 - Do View Transitions replace framework-specific animation libraries? 45:17 - Using DevTools to preview and tweak transitions Links: easings.net Ionic Framework's animation curves Shu’s next-view-transitions library

You can listen to View Transitions in React online on Radio and Podcast. Open the player on this page to stream the available audio.

View Transitions in React is an episode from Frontend First by Frontend First.

This episode is 00:53:21 long.

This episode was published on Jun 12, 2024.

Yes. Use the heart button on the episode page to add it to your favorite episodes list.

Yes. This page shows related episodes from Frontend First when more episodes are available from the podcast feed.