React Deep Dive: useOptimistic
Frontend First
English - February 14, 2024 18:37 - 51 minutes - 46.8 MB - ★★★★★ - 18 ratingsTechnology technology web javascript ember ember.js software development design Homepage Download Apple Podcasts Google Podcasts Overcast Castro Pocket Casts RSS feed
Previous Episode: React Deep Dive: cache
Next Episode: Instant URL search params in Next.js
Ryan and Sam discuss the purpose and usage of the useOptimistic() hook, a new experimental API from React.
Topics include:
0:00 - Intro2:18 - Problem: RSCs require a server roundtrip before the UI can be updated10:13 - Solution: useOptimistic() lets you merge ephemeral client-side state with server-side data so you can update the UI during a Server Action or Transition14:03 - How useOptimistic() avoids the notion of identity by discarding the ephemeral state after the app settles21:17 - How useOptimistic() lets you safely “fork” state that eventually syncs with the server27:32 - Handling error states29:26 - Differences between useOptimistic() and Remix fetchers34:57 - How useOptimistic() lets you avoid managing a long-lived client-side cacheLinks:
Ryan’s useOptimistic tweetRyan’s video on React Cache: Part 2