Post

Next.js 16.3 Instant Navigations lets you balance reusable content with fresh or personalized data while keeping navigation responsive, like a SPA. I built next16-airline.vercel.app to try this in a common multi-step flow. See the source and learn more below ↓

Aurora Scharff

@aurorascharff.no

18 Sept

Cache Components marks reusable flight data with 𝚞𝚜𝚎 𝚌𝚊𝚌𝚑𝚎. Partial Prefetching brings it into the browser before you click, including URL-specific content with 𝚙𝚛𝚎𝚏𝚎𝚝𝚌𝚑={𝚝𝚛𝚞𝚎}.

Aurora Scharff

@aurorascharff.no

Async React keeps search and booking actions responsive with 𝚞𝚜𝚎𝙾𝚙𝚝𝚒𝚖𝚒𝚜𝚝𝚒𝚌, 𝚜𝚝𝚊𝚛𝚝𝚃𝚛𝚊𝚗𝚜𝚒𝚝𝚒𝚘𝚗, and 𝚞𝚜𝚎𝙰𝚌𝚝𝚒𝚘𝚗𝚂𝚝𝚊𝚝𝚎. Server Functions write and refresh data with 𝚞𝚙𝚍𝚊𝚝𝚎𝚃𝚊𝚐. 𝚅𝚒𝚎𝚠𝚃𝚛𝚊𝚗𝚜𝚒𝚝𝚒𝚘𝚗 animates loading and confirmation.

18/9/26, 12:51 pm0 reposts0 likes

Aurora Scharff

@aurorascharff.no

18 Sept

I’m also testing 𝚞𝚗𝚜𝚝𝚊𝚋𝚕𝚎_𝚙𝚛𝚎𝚏𝚎𝚝𝚌𝚑() and 𝚞𝚗𝚜𝚝𝚊𝚋𝚕𝚎_𝚗𝚊𝚟𝚒𝚐𝚊𝚝𝚒𝚘𝚗() to refine what waits for navigation, like search results and live seat availability.

next16-airline.vercel.appWaypointA Next.js 16.3 airline booking demo demonstrating Instant Navigations with Cache Components and Partial Prefetching.

Aurora Scharff

@aurorascharff.no

18 Sept

Source code: github.com/aurorascharf... Learn about Instant Navigations: nextjs.org/blog/next-16... Learn how these patterns come together: nextjs.org/blog/buildin... Read our 16.3 announcement: nextjs.org/blog/next-16-3

next16-airline.vercel.appWaypointA Next.js 16.3 airline booking demo demonstrating Instant Navigations with Cache Components and Partial Prefetching.