#113

RSC Fetching Patterns, react-grab, React Best Practices, dotenv-diff, React Conf 2025, Promise Data Trick, Zero UI


Together with
Clerk

Sharing data with Client Components

Sharing data with Client Components

Sam Selikoff shared another useful Next.js pattern. It shows how to share server-fetched data with Client Components without blocking the page, by passing a promise through Context and unwrapping it with React's use hook. Especially handy for shared data like auth, feature flags, or request-based values.

React Conf 2025

All React Conf 2025 sessions are now live! The talks cover what's next for React and React Native, including new features like <Activity />, View Transitions, and the release of React Compiler v1.0


⚡️ Sponsor: Clerk

Add API Key Support to Your SaaS in Minutes

Add API Key Support to Your SaaS in Minutes

Multi-tenant API key management without building the infrastructure. Organization-scoped keys, automatic verification, and prebuilt React components.

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

Data Fetching Patterns in React Server Components

A practical guide on how data fetching has evolved from client-side fetching to SSR and now React Server Components. It shows patterns like server-owned data with request deduping, sharing data with client components, React Query hydration, and streaming promises with Suspense

Next.js 16 vs. TanStack Start for E-commerce

Explains the trade‑offs between Next.js’s opinionated, batteries‑included approach and TanStack Start’s more flexible, hands‑on style. It looks at how each one handles things like rendering, data fetching, caching, SEO, performance, hosting costs, and long‑term maintenance

► STOP showing loading states and START using optimistic UI

Learn how useOptimistic and startTransition let you update the UI instantly while the server work happens in the background, including how rollbacks work on errors

Using React Transitions for low priority text editor updates

When a text editor starts doing too much work on every keystroke, performance can quickly suffer. This post shows how React Transitions can defer non‑critical updates, like read‑only previews, without affecting the main editing experience


📦 Projects / Packages / Tools

React Best Practices

React Best Practices

Vercel has released an open-source repository that collects over 10 years of React and Next.js performance learnings into one place. The rules are ordered by impact, include clear examples, and are designed to be used by both humans and AI coding agents

react-grab

Press ⌘C / Ctrl+C to grab the file name, React component, and HTML of an element, ready to paste into tools like Cursor, Claude Code, or Copilot

React Zero UI

A new approach to UI state that avoids React re‑renders completely. Instead of updating state at runtime, it pre‑renders all UI states at build time and switches them using data-* attributes and CSS

dotenv-diff

This tool scans your whole codebase and helps you spot missing, unused, duplicated, or wrongly named variables before they cause bugs in production.


⚡️ Sponsor: Expo

How to go from Web to Native with React

How to go from Web to Native with React

Everything that web devs need to know about building their first mobile app - You already know React. With Expo, you can use that knowledge to build fully native apps for iOS and Android without starting over or learning new tools


🌈 Related

Building Type-Safe Compound Components

In part 3 of Dominik Dorfmeister's series on Design Systems he explores compound components, explaining when they work well in React, when props or slots are a better choice, and how to handle type safety

I moved virtualization math to Rust/WASM - here's what I learned

A write-up about experimenting with WebAssembly to speed up list virtualization in a React app. The post explains why scrolling large, variable-height lists can get slow in JavaScript, and how moving the heavy math to Rust + WASM made scrolling much smoother, even with millions of rows

Mitigating Denial-of-Service Vulnerability for Next.js / React

A Node.js bug made stack overflows uncatchable when async_hooks are enabled, causing servers to crash. This silently impacted React Server Components, Next.js, and most APM tools because they rely on AsyncLocalStorage

I rebuilt my blog with React Server Components

The post explains where server components work really well, like code highlighting, LaTeX, and RSS generation, and where things feel awkward, such as client-side navigation. Instead of using Next.js, the author went with Parcel, but the ideas still carry over.


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

All submissions are appreciated.

👋 See you next week!