Frontend First

Tim Neutkens on the Next.js App Router

Episode Summary

Tim joins Sam to talk about his work on the new app router in Next.js 13. He explains how the app router leverages Server Components and React’s new cache API to bring a new level of composability to server-side code, how Server Actions are being designed to enable partial revalidation in a single round trip to the server, and how to think about UI updates as a result of server-side state changes.

Episode Notes

Tim joins Sam to talk about his work on the new app router in Next.js 13. He explains how the app router leverages Server Components and React’s new cache API to bring a new level of composability to server-side code, how Server Actions are being designed to enable partial revalidation in a single round trip to the server, and how to think about UI updates as a result of server-side state changes.

Topics include:

• 0:00 - Intro
• 2:53 - Rendering Server Components and the RSC payload
• 21:49 - Composition vs. top-down data flow and the React cache
• 53:35 - Revalidation after a user event and Server Actions
• 1:06:37 - Revalidation after a server-side state change
• 1:14:02 - Back and forward navigation
• 1:21:43 - Caching layers
• 1:30:53 - Current focus on stability, performance, education, and TurboPack

Links:

• Tim’s deep dive on caching and revalidating
• Next.js docs on Caching