Aurora Scharff

Aurora Scharff

@aurorascharff.no

DX, Docs & Education @nextjs.org ▲ @vercel.com | React Cert Lead @CertificatesDev

2K followers237 following423 posts

Aurora Scharff
@aurorascharff.no

Ahead of Next.js 16.4, I worked on applying the upcoming features across v0 and validating our new Partial Prefetching optimizer Skill in a real app. Excited to finally share it!

Next.js@nextjs.org

We used a coding agent with Next.js 16.4's new prefetching controls and Skill to improve v0's navigation experience at no added cost. The loop: • Capture navigation with 𝚒𝚗𝚜𝚝𝚊𝚗𝚝() • Define the target UI in the test • Refactor until it passes nextjs.org/blog/improv...

nextjs.orgImproving navigation experience in v0 with Next.js 16.4How we used Partial Prefetching and a coding agent to improve navigation across v0 with Next.js 16.4.

Aurora Scharff reposted

Next.js
@nextjs.org

We used a coding agent with Next.js 16.4's new prefetching controls and Skill to improve v0's navigation experience at no added cost. The loop: • Capture navigation with 𝚒𝚗𝚜𝚝𝚊𝚗𝚝() • Define the target UI in the test • Refactor until it passes nextjs.org/blog/improv...

nextjs.orgImproving navigation experience in v0 with Next.js 16.4How we used Partial Prefetching and a coding agent to improve navigation across v0 with Next.js 16.4.

Aurora Scharff reposted

Next.js
@nextjs.org

The Next.js site has a new look! We've redesigned the homepage, /docs, /blog, and more, with a consistent design that keeps the focus on the content. nextjs.org A few highlights ↓

Aurora Scharff
@aurorascharff.no

Coding agents hit Next.js errors, unclear docs, and non-obvious workarounds while they build. They often solve the task and move on without reporting what failed. For Next.js 16.4, we created a new agent feedback system. 𝚎𝚡𝚙𝚎𝚛𝚒𝚖𝚎𝚗𝚝𝚊𝚕: { 𝚊𝚐𝚎𝚗𝚝𝙵𝚎𝚎𝚍𝚋𝚊𝚌𝚔: 𝚝𝚛𝚞𝚎, } Learn more about the feature ↓

View full thread
Aurora Scharff
@aurorascharff.no

We group submitted reports to find recurring problems and use them to improve framework behavior, error messages, docs, and tooling. If you try it, let me know how the experience goes and what we should improve!

Aurora Scharff
@aurorascharff.no

Coding agents hit Next.js errors, unclear docs, and non-obvious workarounds while they build. They often solve the task and move on without reporting what failed. For Next.js 16.4, we created a new agent feedback system. 𝚎𝚡𝚙𝚎𝚛𝚒𝚖𝚎𝚗𝚝𝚊𝚕: { 𝚊𝚐𝚎𝚗𝚝𝙵𝚎𝚎𝚍𝚋𝚊𝚌𝚔: 𝚝𝚛𝚞𝚎, } Learn more about the feature ↓

Aurora Scharff
@aurorascharff.no

If your agent finds a potential Next.js issue, it can open a report in your browser before finishing. The report explains what happened, what the agent expected, and any workaround it found. You can edit or discard it, and nothing is sent until you hit "Send feedback".

Aurora Scharff reposted

Next.js
@nextjs.org

An out-of-band Next.js security update is planned for Wednesday, October 14. It will address three vulnerabilities in upstream dependencies, including two critical and one high-severity issue. nextjs.org/blog/upcomi... We're also changing how we share future security notices ↓

nextjs.orgUpcoming Next.js Security Update for Upstream VulnerabilitiesNext.js plans to publish an out-of-band security update next Wednesday, October 14, 2026, addressing two Critical and one High severity vulnerabilities in upstream dependencies.
Aurora Scharff
@aurorascharff.no

I’ve been updating an older commerce demo to explore 𝚎𝚗𝚜𝚞𝚛𝚎𝚂𝚝𝚊𝚝𝚒𝚌 in Next.js 16.4. Cache Components lets you mix static, cached, and request-time content. When you need predictable compute costs, the new 𝚎𝚗𝚜𝚞𝚛𝚎𝚂𝚝𝚊𝚝𝚒𝚌 API lets you guarantee static output at the relevant stage. More below ↓

View full thread
Aurora Scharff
@aurorascharff.no

I’ve been updating an older commerce demo to explore 𝚎𝚗𝚜𝚞𝚛𝚎𝚂𝚝𝚊𝚝𝚒𝚌 in Next.js 16.4. Cache Components lets you mix static, cached, and request-time content. When you need predictable compute costs, the new 𝚎𝚗𝚜𝚞𝚛𝚎𝚂𝚝𝚊𝚝𝚒𝚌 API lets you guarantee static output at the relevant stage. More below ↓

Aurora Scharff
@aurorascharff.no

Product links in the grid use 𝚙𝚛𝚎𝚏𝚎𝚝𝚌𝚑={𝚝𝚛𝚞𝚎} to load cached details before the click. On /𝚙𝚛𝚘𝚍𝚞𝚌𝚝/[𝚒𝚍], 𝚎𝚗𝚜𝚞𝚛𝚎𝚂𝚝𝚊𝚝𝚒𝚌 = '𝚙𝚛𝚎𝚏𝚎𝚝𝚌𝚑' keeps personalized cart and saved state out of those prefetches.

Aurora Scharff
@aurorascharff.no

built Stamp, a Gmail-style inbox, to explore the new 𝚗𝚊𝚟𝚒𝚐𝚊𝚝𝚒𝚘𝚗() API in Next.js 16.4. Sometimes you want to cache content for return visits without prefetching it before someone opens the page. Live demo, source code, and docs below ↓

Aurora Scharff
@aurorascharff.no

In this mailbox, visible links prefetch each thread's header. The message bodies still use '𝚞𝚜𝚎 𝚌𝚊𝚌𝚑𝚎', but 𝚊𝚠𝚊𝚒𝚝 𝚗𝚊𝚟𝚒𝚐𝚊𝚝𝚒𝚘𝚗() keeps them out of the prefetch. They load after the click but will still be reused when you return.

Aurora Scharff
@aurorascharff.no

We've had a lot of Next.js releases lately, including security updates and API changes. Keeping apps current can be a lot to follow. 𝚗𝚎𝚡𝚝 𝚞𝚙𝚐𝚛𝚊𝚍𝚎 --𝚊𝚐𝚎𝚗𝚝 gives your coding agent the context to help you upgrade and verify your app. It also sets up future prompts for security fixes, or for 𝚕𝚊𝚝𝚎𝚜𝚝!

Next.js@nextjs.org

A new CLI command helps agents upgrade your Next.js apps: 𝚗𝚙𝚡 𝚗𝚎𝚡𝚝@𝚌𝚊𝚗𝚊𝚛𝚢 𝚞𝚙𝚐𝚛𝚊𝚍𝚎 --𝚊𝚐𝚎𝚗𝚝=𝚕𝚊𝚝𝚎𝚜𝚝 It gives your agent any guides, codemods, and verification steps needed, all specific to your version of Next.js.

Aurora Scharff
@aurorascharff.no

Next.js 16.4 adds 𝚗𝚊𝚟𝚒𝚐𝚊𝚝𝚒𝚘𝚗(), a new API for keeping parts of a route out of prefetches. I built Stamp, a mailbox demo, to try it. Message bodies wait for navigation, so scrolling never downloads emails you don't open. Demo: next16-mail.vercel.app Source: github.com/aurorascharf...

next16-mail.vercel.appStampA Gmail-style mail client demo exploring Cache Components, Partial Prefetching, and the navigation() API with Next.js 16.4.
Next.js@nextjs.org

The new 𝚗𝚊𝚟𝚒𝚐𝚊𝚝𝚒𝚘𝚗() API lets you exclude parts of a page from being rendered during a prefetch. Use it to prerender only the most meaningful UI ahead of time, and defer more expensive secondary content until an actual user navigation.

Aurora Scharff
@aurorascharff.no

We've been looking for more ways to collect feedback from coding agents about the problems they encounter while using Next.js. If you'd like to help, enable 𝚎𝚡𝚙𝚎𝚛𝚒𝚖𝚎𝚗𝚝𝚊𝚕.𝚊𝚐𝚎𝚗𝚝𝙵𝚎𝚎𝚍𝚋𝚊𝚌𝚔. You review each report before it's sent, and we use them to make Next.js better.

Next.js@nextjs.org

Coding agents encounter framework errors and workarounds we may not otherwise see. The experimental 𝚊𝚐𝚎𝚗𝚝𝙵𝚎𝚎𝚍𝚋𝚊𝚌𝚔 workflow drafts reports for you to review before sending, helping us improve Next.js based on the problems coding agents encounter.

Aurora Scharff
@aurorascharff.no

Next.js 16.4 is out! New apps now enable 𝚌𝚊𝚌𝚑𝚎𝙲𝚘𝚖𝚙𝚘𝚗𝚎𝚗𝚝𝚜 and 𝚙𝚊𝚛𝚝𝚒𝚊𝚕𝙿𝚛𝚎𝚏𝚎𝚝𝚌𝚑𝚒𝚗𝚐 by default, making it easier to build fast, dynamic apps with opt-in caching and a SPA-like experience. Really excited for you to try it!

Next.js@nextjs.org

Next.js 16.4 • Cache Components by default in new apps • Static output guarantees and more control over prefetching • Agent-guided upgrades and feedback • 20–25% smaller Turbopack disk cache • Faster development and smaller bundles nextjs.org/blog/next-16-4

nextjs.orgNext.js 16.4Next.js 16.4 introduces lazy compilation, smaller Turbopack output, React 19.3 features, Cache Components improvements, and new developer tooling.
Aurora Scharff
@aurorascharff.no

Want to join? Comment below, and I’ll pick someone before September 30! The ticket covers entry to the conference. Flights and accommodation are not included.

View full thread
Aurora Scharff
@aurorascharff.no

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.

Aurora Scharff reposted

Next.js
@nextjs.org

We closed 1,500 issues on 𝚟𝚎𝚛𝚌𝚎𝚕/𝚗𝚎𝚡𝚝.𝚓𝚜 in one month by building a 𝚌𝚕𝚘𝚜𝚊𝚋𝚒𝚕𝚒𝚝𝚢 agent with eve.dev. The workflow: 1. Search related work 2. Try to reproduce bugs across versions in a sandbox 3. Return context for review nextjs.org/blog/how-we...

nextjs.orgHow we closed 1,500 GitHub issues in one monthHow the Next.js team used an agent to research old reports and work through the issue backlog.

Aurora Scharff reposted

Ozgur
@ozgrozer.bsky.social

I just got 100 on every PageSpeed category for Grape's website Huge thanks to Next.js 16.3 #buildinpublic

Aurora Scharff reposted

Max
@maxwellcohen.bsky.social

I absolutely love these instant navigation demos

Aurora Scharff@aurorascharff.no

I rebuilt an older Vercel book search demo with Next.js 16.3 Instant Navigations: www.next-books.dev See the source and learn more below ↓

View full thread
View full thread
Aurora Scharff
@aurorascharff.no

Cache Components prerenders static, cached, and fallback UI. Partial Prefetching brings that reusable route UI to the browser before navigation. Add 𝚙𝚛𝚎𝚏𝚎𝚝𝚌𝚑={𝚝𝚛𝚞𝚎} when a link should also resolve its URL-dependent content before the click. Anything still missing loads on the server and streams in.

Aurora Scharff
@aurorascharff.no

The filters use 𝚞𝚜𝚎𝚃𝚛𝚊𝚗𝚜𝚒𝚝𝚒𝚘𝚗 to fade the catalog while the server updates and 𝚞𝚜𝚎𝙾𝚙𝚝𝚒𝚖𝚒𝚜𝚝𝚒𝚌 to apply the next filter values immediately. Rebuilding the demo also improved initial loading. First Contentful Paint was 44% faster and Largest Contentful Paint was 33% faster than the original.

Aurora Scharff
@aurorascharff.no

Instant Navigations lets server-rendered routes respond immediately when you click, even on a throttled connection: 𝚌𝚘𝚗𝚜𝚝 𝚗𝚎𝚡𝚝𝙲𝚘𝚗𝚏𝚒𝚐 = { 𝚌𝚊𝚌𝚑𝚎𝙲𝚘𝚖𝚙𝚘𝚗𝚎𝚗𝚝𝚜: 𝚝𝚛𝚞𝚎, 𝚙𝚊𝚛𝚝𝚒𝚊𝚕𝙿𝚛𝚎𝚏𝚎𝚝𝚌𝚑𝚒𝚗𝚐: 𝚝𝚛𝚞𝚎 };

Aurora Scharff
@aurorascharff.no

Vercel just launched @matiNotFound's WebGPU library for shipping shaders in the browser: vgpu.sh Mati suggested to put it on the next-beats.dev album art and helped me with some ideas. I used the skills that ship with vgpu, plus GPT to generate inspiration, then turned it into a shader!

Aurora Scharff
@aurorascharff.no

React’s new 𝚋𝚛𝚘𝚠𝚜𝚎𝚛() API marks a component as browser-only during server rendering. Here, 𝚞𝚜𝚎(𝚋𝚛𝚘𝚠𝚜𝚎𝚛()) suspends on the server before reading a saved draft from 𝚕𝚘𝚌𝚊𝚕𝚂𝚝𝚘𝚛𝚊𝚐𝚎 in the browser. What else would you use it for? react.dev/reference/re...

Aurora Scharff@aurorascharff.no

Docs for React's new 𝚋𝚛𝚘𝚠𝚜𝚎𝚛() API are now live! It's available in Canary. Pass it to 𝚞𝚜𝚎() and it suspends to the closest Suspense boundary on the server, then renders normally in the browser. Looking forward to this in stable React! react.dev/reference/re...

react.devbrowser – ReactThe library for web and native user interfaces