Working on developer experience, docs, and education on the Next.js team at Vercel. Practical guides on React, Next.js, and modern web development.https://aurorascharff.no/https://aurorascharff.no/posts/avoiding-server-component-waterfall-fetching-with-react-19-cache/https://aurorascharff.no/posts/avoiding-server-component-waterfall-fetching-with-react-19-cache/Learn how to use the React 19 cache() API in the Next.js App Router to optimize performance and avoid fetch waterfalls when using React Server Components.Tue, 25 Aug 2026 09:35:00 GMThttps://aurorascharff.no/posts/coordinating-optimistic-updates-in-nextjs/https://aurorascharff.no/posts/coordinating-optimistic-updates-in-nextjs/Several changes can happen before the first save finishes. Here is how useActionState and useOptimistic keep those changes on screen while the saves run in order.Thu, 13 Aug 2026 10:00:00 GMThttps://aurorascharff.no/posts/experimenting-with-rsc-for-performance-and-ux-in-nextjs/https://aurorascharff.no/posts/experimenting-with-rsc-for-performance-and-ux-in-nextjs/A few Server Component patterns from a small app on the Next.js 16.3 preview: a load more button that leans on the URL, a search field that keeps focus while results stream, and a message composer that previews your draft on the server.Fri, 24 Jul 2026 10:00:00 GMThttps://aurorascharff.no/posts/building-an-active-navlink-component-in-nextjs/https://aurorascharff.no/posts/building-an-active-navlink-component-in-nextjs/Active link styling is one of the most common things you need in a real application. Here is how to build a reusable NavLink component for a Next.js app, taking inspiration from React Router, that handles Cache Components and flicker-free hydration.Sat, 23 May 2026 10:00:00 GMThttps://aurorascharff.no/posts/component-architecture-for-react-server-components/https://aurorascharff.no/posts/component-architecture-for-react-server-components/React Server Components let each component fetch the data it needs. Pages stop being giant loaders that prop-drill everything down. Here's how that changes how you architect a page, where loading boundaries live, and why it leads to better UX.Fri, 22 May 2026 12:00:00 GMThttps://aurorascharff.no/posts/the-precompute-pattern-encoding-dynamic-data-into-urls-in-nextjs/https://aurorascharff.no/posts/the-precompute-pattern-encoding-dynamic-data-into-urls-in-nextjs/The Precompute pattern encodes request-specific data like auth state, locale, and feature flags into URLs to keep pages statically generated. This post walks through how it works, where it shows up in production, and how it relates to cache components.Wed, 01 Apr 2026 10:00:00 GMThttps://aurorascharff.no/posts/implementing-nextjs-16-use-cache-with-next-intl-internationalization/https://aurorascharff.no/posts/implementing-nextjs-16-use-cache-with-next-intl-internationalization/Next.js 16 introduces component-level caching with the 'use cache' directive, but it doesn't work seamlessly with next-intl yet. Learn why and discover a practical workaround.Tue, 24 Mar 2026 00:00:00 GMThttps://aurorascharff.no/posts/error-handling-in-nextjs-with-catch-error/https://aurorascharff.no/posts/error-handling-in-nextjs-with-catch-error/react-error-boundary has issues with Server Components in Next.js. catchError is a framework-aware alternative that handles notFound(), redirect(), and server data re-fetching correctly.Mon, 23 Mar 2026 15:00:00 GMThttps://aurorascharff.no/posts/building-design-components-with-action-props-using-async-react/https://aurorascharff.no/posts/building-design-components-with-action-props-using-async-react/Learn how to build reusable design components that expose action props and internally manage optimistic updates, loading states, and automatic rollback, so consumers just pass a value and an action.Mon, 23 Feb 2026 17:00:00 GMThttps://aurorascharff.no/posts/dynamically-generating-pwa-app-icons-nextjs-16-serwist/https://aurorascharff.no/posts/dynamically-generating-pwa-app-icons-nextjs-16-serwist/Learn how to dynamically generate PWA app icons in Next.js 16 using Serwist. This guide shows how to create environment-specific icons for development, staging, and production environments.Tue, 11 Nov 2025 08:00:00 GMThttps://aurorascharff.no/posts/building-an-async-combobox-with-usesuspensequery-and-usedeferredvalue/https://aurorascharff.no/posts/building-an-async-combobox-with-usesuspensequery-and-usedeferredvalue/Learn how to create a declarative combobox component using `useDeferredValue()` and `useSuspenseQuery()` for smooth, performant user experiences.Thu, 07 Aug 2025 21:22:00 GMThttps://aurorascharff.no/posts/server-client-component-composition-in-practice/https://aurorascharff.no/posts/server-client-component-composition-in-practice/Learn how to compose client and server components effectively in React. Explore patterns for keeping responsibilities clear, optimizing performance, and creating reusable components.Tue, 05 Aug 2025 10:22:00 GMThttps://aurorascharff.no/posts/building-reusable-components-with-react19-actions/https://aurorascharff.no/posts/building-reusable-components-with-react19-actions/Learn how to build reusable components with React 19 Actions, track transition states, use optimistic updates, and expose action properties for custom logic.Fri, 04 Apr 2025 10:22:00 GMThttps://aurorascharff.no/posts/managing-advanced-search-param-filtering-next-app-router/https://aurorascharff.no/posts/managing-advanced-search-param-filtering-next-app-router/Learn how to implement advanced search param filtering in the Next.js App Router, utilizing React 19 features like useOptimistic and the library nuqs.Thu, 24 Oct 2024 10:30:00 GMThttps://aurorascharff.no/posts/handling-form-validation-errors-and-resets-with-useactionstate/https://aurorascharff.no/posts/handling-form-validation-errors-and-resets-with-useactionstate/The React 19 `useActionState` hook is a powerful tool for creating a state based on the result of an action, typically useful with form submissions. Learn how to create a validated form using the hook, and how to handle form resets and errors with it.Fri, 04 Oct 2024 10:30:00 GMThttps://aurorascharff.no/posts/implementing-feature-flagging-with-nextjs-app-router/https://aurorascharff.no/posts/implementing-feature-flagging-with-nextjs-app-router/Feature flagging allows you to enable or disable features without deploying new code. Learn how to implement a simple feature flagging solution with the Next.js App Router.Tue, 17 Sep 2024 09:30:00 GMThttps://aurorascharff.no/posts/creating-a-reusable-submitbutton-with-useformstatus/https://aurorascharff.no/posts/creating-a-reusable-submitbutton-with-useformstatus/The React 19 `useFormStatus` hook is a powerful tool for handling form submissions. Learn how to create a reusable SubmitButton that works across multiple forms and enables progressive enhancement.Mon, 10 Jun 2024 11:30:00 GMThttps://aurorascharff.no/posts/rebuilding-remix-contacts-in-nextjs-14-with-transitions-server-actions-and-prisma/https://aurorascharff.no/posts/rebuilding-remix-contacts-in-nextjs-14-with-transitions-server-actions-and-prisma/Remix Contacts is Remix's official tutorial. In this blog post, we'll rebuild it in Next.js 14 using React Server Components, Server Actions, Transitions and Prisma, and compare the two approaches.Fri, 05 Apr 2024 08:22:00 GMThttps://aurorascharff.no/posts/utilizing-useoptimistic-across-the-component-tree-in-nextjs/https://aurorascharff.no/posts/utilizing-useoptimistic-across-the-component-tree-in-nextjs/The React 19 hook useOptimistic is a powerful tool for building fast and responsive UIs. Learn how to use useOptimistic across the component tree in Next.js with React Context.Sat, 24 Feb 2024 15:22:00 GMThttps://aurorascharff.no/posts/implementing-react-hook-form-with-nextjs-14-server-actions/https://aurorascharff.no/posts/implementing-react-hook-form-with-nextjs-14-server-actions/React Hook Form is a popular library for building interactive forms in React. Learn how to use React Hook Form with Next.js 14 and Server Actions.Sat, 30 Dec 2023 15:22:00 GMThttps://aurorascharff.no/posts/running-tests-with-rtl-and-vitest-on-internationalized-react-server-components-in-nextjs-app-router/https://aurorascharff.no/posts/running-tests-with-rtl-and-vitest-on-internationalized-react-server-components-in-nextjs-app-router/Learn a method for running tests with Vitest and RTL (React Testing Library) on React Server Components that utilizes internationalization (i18n) via the next-international package.Sun, 10 Sep 2023 15:22:00 GMT