Next.js Is Getting Much Better at SPA-like UX
DEV Community

Next.js Is Getting Much Better at SPA-like UX

Building SPA-like experiences with Next.js - Aurora Scharff’s post series looks at how to make Next.js apps feel fast and smooth like a single-page app, while still using server rendering. She shows how new Next.js features like Cache Components and Partial Prefetching can make pages load instantly, keep data around between visits, and reduce loading states.

⚑️ Sponsor: Arcjet - AI compliance controls. Protect your AI applications from prompt injection, PII leaks, and unauthorized tool calls.

Articles / Tutorials / News

Advanced React State Boundaries in a Real Next.js App - A practical article on the tricky parts of building a modern Next.js app where server data, client state, URL state, browser APIs, RSC, and TanStack Query all meet.

Cache Components in Next.js - Next.js has changed its caching story, and this post explains why. The big change is that data is now dynamic by default, and you choose what to cache with "use cache". The post walks through how to cache parts of a page, stream other parts with Suspense, set cache time with cacheLife, and clear cached data with cacheTag.

Next.js moves to scheduled security releases - Vercel is moving Next.js to a monthly security release schedule instead of shipping fixes at random times. The goal is to make updates easier to plan for, especially as AI tools are helping researchers find more bugs faster. Check out July 2026's security update 𝕏.

TypeScript 7 Support in Next.js - Next.js 16.3 Preview adds early support for TypeScript 7 with the new experimental.useTypeScriptCli option. Since TypeScript 7 currently does not include its JavaScript API, Next.js now has to call the installed tsc command directly during next build instead.

Projects / Packages / Tools

  • Canvas UI - From the creator of React Bits, Canvas UI is an OSS library of creative, framework-agnostic components built with canvas. It includes effects like fluid simulations, shaders, and 3D scenes that can run on top of a live, interactive interface.
  • stylextras - A collection of libraries and utilities that pair well with StyleX. It's still a work in progress, but you can already copy the component code from the repository.
  • RSC Boundary - See server and client component boundaries directly on the page while developing.
  • Sugar High - A tiny JavaScript and JSX syntax highlighter built for the browser or any JS runtime that can set HTML strings.

⚑️ Sponsor: RepoClip - Turn your GitHub repo into a demo video in 60 seconds. RepoClip’s AI reads your code and generates a professional promo video - script, visuals, narration, and music - with zero editing. Just paste a URL, and your first video is free (no credit card). Built with Next.js.

Related

React Forms Done Right - Forms look simple, but they quickly become tricky once validation, async checks, server requests, and error handling are involved. This guide breaks forms down into simple ideas, then shows how to build them with plain HTML, React 19 server actions, and TanStack Form.

What’s one React pattern you stopped using after working on larger projects? - On Reddit, developers are discussing which ideas seemed useful early on but became harder to manage in larger React apps.

ReactBench v1 - A new benchmark made to check how well coding agents handle real React work. Instead of only checking if code passes tests, it also looks for problems that affect real users, like performance issues and accessibility mistakes 𝕏.

Vercel Hires Pete Hunt and Nick Schrock - Vercel has brought in two big names in developer tools. Pete Hunt, an early React pioneer at Meta who helped push React at Instagram Web, will lead Frameworks and Next.js. Nick Schrock, a co-creator of GraphQL, will work on agentic developer experience and future tooling for AI-driven software.

Top comments (0)

Comments

No comments yet. Start the discussion.