Serialization and deserialization without blowing React

Serialization and deserialization without blowing React
6 minutes by Ori Livni

Working with JSON data in React can cause performance problems. When you convert strings to objects using JSON.parse and back with JSON.stringify, every conversion creates new object references. This makes React think the data changed even when it didn't, leading to unnecessary re-renders. The solution uses structural sharing. This technique only creates new references for parts of the data that actually changed. Unchanged parts keep their old references, preventing unwanted re-renders and improving performance by up to 50%.

How to Build Secure MCP Auth With OAuth 2.1
sponsored by WorkOS

Securing access to an MCP server is complex. You need scopes, PKCE, consent flows, and safe revocation. This guide from WorkOS shows how to implement OAuth 2.1 in production with clear steps and examples. WorkOS Connect and AuthKit handle the full flow from authorization to token management.

Stop prop drilling: The ultimate guide to useContext with TypeScript
6 minutes by Karan Singh Bagga

Karan teaches the simple “Create, Provide, Consume” pattern to manage your application state. React's useContext hook solves prop drilling, where state gets passed through many components that don't use it. The solution follows a simple three-step pattern: First, create a context with TypeScript types to define your shared data structure. Next, provide the state using a Provider component that wraps your app and manages the actual state with useState. Finally, consume the data in any child component using useContext, letting deeply nested components access state directly without passing props.

How toTransform FormData between UI and database in React router
5 minutes by Sergio Xalambrí

Sergio explains how to transform form data between the UI and database in React Router apps using a clear separation of concerns. Actions convert FormData into structured objects for the data layer, while loaders reshape database data for UI use. By isolating logic across UI, HTTP, and data layers—and using tools like Zod for validation—developers can build more maintainable and testable applications.

Context inheritance in TanStack router
6 minutes by Dominik Dorfmeister

TanStack Router lets you accumulate state between nested routes in a type-safe way. When you define path parameters on a parent route with validation, all child routes automatically inherit those types. The same inheritance works for search parameters and router context. This means child components get access to all state from their parent route hierarchy with full type safety.

The perils of reactivity
6 minutes by Matthew Phillips

Reactivity is often presented as the holy grail. However, its magic comes with a hidden cost. The very mechanisms that make it so appealing also introduce their own set of complexities, making certain common scenarios more difficult to reason about and debug. In this article Matthew explores some of the often-unspoken downsides of reactivity, challenging that it’s the holy grail.

And don't miss the React conf 2025 recap.

webdev

• The present and potential future of progressive image rendering
• CSS :is() :where() the Magic Happens
• The new progress() function in CSS
• CSS Grid: A helpful mental model and the power of grid lines
• HTML’s Best Kept Secret: The output Tag

javascript

• Why typeof null === object
• How to group arrays in JavaScript without reduce()

And the most popular article from the last issue was:

• Concurrent hydration with useSyncExternalStore