#125

React2DoS - CVE-2026-23869, The Precompute Pattern, Boneyard, use cache migration, RSC Boundary, What To Know in JavaScript (2026 Edition)


Together with
Clerk

The Precompute Pattern: Encoding Dynamic Data into URLs in Next.js

The Precompute Pattern: Encoding Dynamic Data into URLs in Next.js

The Precompute pattern solves the problem of a single cookies() or headers() call forcing your entire app into dynamic rendering. Instead of reading dynamic data inside components, you resolve it once in middleware and encode it into a hidden URL segment. This lets Next.js treat each variant as a static page. The post walks through a full implementation, covers how the Vercel Flags SDK formalizes this approach, and explains why 'use cache' in Next.js 16 makes it unnecessary for most cases

React2DoS (CVE-2026-23869): When the Flight Protocol Crashes at Takeoff

Security researchers at Imperva found a way to crash React servers with tiny requests. The bug (CVE-2026-23869) lives in the Flight protocol, which RSC uses to pass data between client and server. Also check out the Vercel summary of this vulnerability and update to the latest Next.js version


⚡️ Sponsor: Clerk

Clerk Billing: seat limits that enforce themselves

Clerk Billing: seat limits that enforce themselves

Building a B2B app with tiered plans? Clerk Billing now lets you set membership limits per plan so organizations are automatically blocked from adding members beyond their tier. Users hitting the cap get nudged to upgrade, no custom enforcement code required. Configure it in the dashboard and drop in a <PricingTable />.

Make sure to stay up to date about new features, best articles and tools in the Next.js ecosystem by subscribing to the newsletter.

Once‑weekly email, best links, no fluff.

Join 6,000+ developers. 100% free.

📙 Articles / Tutorials / News

React Rendering Strategies

A detailed guide that walks you through the full history of React rendering. It covers SPAs, SSR, SSG, and React Server Components with interactive diagrams and real-world examples

feat(next): add sitemap index support

A draft PR has been opened to add native sitemap-index.{ts|js|xml} file support to Next.js. This feature would let you dynamically generate a sitemap index following the Sitemap Index protocol, making it much easier to manage large sites with many sitemaps

Docs: add unstable_cache → use cache migration guide

The Next.js docs will soon include a guide that maps the old unstable_cache patterns to the new use cache API, showing how revalidate: 3600 becomes cacheLife('hours'), tags: ['x'] becomes cacheTag('x'), and explains that keyParts are no longer needed

‘use client’ in Next.js: What It Does, What It Costs, and When to Use It

Every use client you add comes with a price tag. This article breaks down exactly what that cost looks like: more JavaScript sent to the browser, extra hydration work blocking the main thread, and potential data-fetching waterfalls


⚛️ React Summit | June 12 & 16, 2026

The world’s biggest React conference in beautiful Amsterdam and online! Learn from top React experts & connect with the community.

Use code NEXT for 10% off tickets


📦 Projects / Packages / Tools

Boneyard

Boneyard

Boneyard snapshots your real UI and creates a flat list of positioned, sized rectangles that mirror your layout exactly. Just wrap your component in <Skeleton> and you get pixel-perfect skeleton screens that stay in sync with your actual design

RSC Boundary

A simple devtool that draws colored outlines around your components so you can instantly see which parts are server-rendered and which are client-side

use-form-guard

Since Next.js App Router dropped router.events, blocking navigation for unsaved forms has been a pain point. This lightweight hook (~0.8KB, no dependencies) solves it by intercepting tab close, SPA navigation, and browser back/forward

next-translate

A minimal translation library for Next.js that automatically loads only the namespaces each page needs in the current language


⚡️ Sponsor: Bluebag

Add Skills to your AI-SDK Agent in minutes

Add Skills to your AI-SDK Agent in minutes

Execute Skills in runtime VMs without building infrastructure. Run complex scripts, read Skills on-demand, install dependencies, mint download links, and build predictable, specialised agents in minutes.


🌈 Related

What To Know in JavaScript (2026 Edition)

Chris Coyier's yearly roundup covering everything a JavaScript developer should have on their radar. From new ES2025 features like iterator helpers and set methods, to the Temporal API, to TypeScript v6 preparing for a massive v7 finally fixing dates

You really, really, really don't need an effect! I swear!

A practical guide to eliminating unnecessary useEffect calls in React. The post provides a clear decision tree: computed values should be derived inline, user actions belong in event handlers, state resets should use the key prop, and data fetching should use a library like TanStack Query

Test IDs are an a11y smell

If you're still reaching for data-testid in your tests, this post might change your mind. The author argues that role-based selectors (like getByRole('button', { name: 'Open Widget' })) are far better because they mirror how real users interact with your app and they double as basic accessibility checks

Why we rolled our own React Server Components framework

A team's journey of ditching Gatsby and building their own React Server Components framework in under 1,000 lines of code with React 19 and Vite's new RSC plugin


Have a link you want to share? Send me an email at erfan@nextjsweekly.com

All submissions are appreciated.

👋 See you next week!