This Week In React 237
RSC, TanStack, Storybook, Lingo Compiler, LiveStore, Base UI | Legacy Arch, Hermes N-API, 120fps, ReactRaptor, DevTools | TC39, Import Maps, Vite, Vitest, Babel, PHP
Hi everyone!
I thought I was on schedule for today's issue, until I realized that Dan Abramov wrote 4 RSC blog posts this week 😂. We also get great releases, including Storybook, LiveStore, Base UI, and the Lingo Compiler is a quite exciting innovation. The community is still processing last week's Remix awakening with many videos and podcasts commenting on the news.
React Native devs were at App.js last week, where the React Native team unveiled their plan to freeze the Legacy Architecture.
The last TC39 meeting was also quite productive, with 3 proposals progressing to stage 4 among other things. We also got various interesting announcements from the Vite ecosystem.
As always, thanks for supporting us on your favorite platform:
🦋 Bluesky
✖️ X / Twitter
👔 LinkedIn
👽 Reddit
💸 Sponsor
Free AI Code Reviews in IDE - VSCode, Cursor, Windsurf
CodeRabbit is the AI code review platform purpose built to speed up code reviews and improve code quality. Integrating seamlessly into git workflows and existing toolchains, it delivers codebase-aware reviews and supports all programming languages.
Now they are excited to deliver AI code reviews directly in VS Code, Cursor, and Windsurf–letting you and your team (vibe) code with confidence and review while keeping in flow.
Even better: code reviews in the IDE are free! That’s right: line-by-line reviews and one-click fixes, all in your IDE at no cost to you.
Install the extension and start vibe checking your code today!
⚛️ React
Storybook looks set to become the ultimate component testing tool, integrating with Vitest and Playwright, covering:
Interaction tests: Verify functionality by simulating user behavior
Accessibility tests: Detect, diagnose, and fix WCAG violations
Visual tests: Check for appearance bugs down to the pixel
Coverage reports: Understand which code is tested at a glance
Test widget: Click to run a comprehensive test suite
This release also includes:
48% Leaner: Smaller install with optional docs and test packages
Story generation: Tools to write stories automatically
Tag-based organization: Filter and group stories by tag
Story globals: Set context (theme, viewport, locale) at the story level
Frameworks: Major updates for Svelte, Next.js, React Native, and more!
💸 Product for Engineers - What nobody tells developers about documentation
🔐 Next.js CVE-2025-48068 - Low-severity vulnerability in the dev server, fixed in v15.2.2
🗓️ React Advanced London - 🇬🇧 London - 28 Nov & 1 Dec. "It's one of my absolute favourite conferences here." — Lenz Weber-Tronic, Apollo GraphQL. 10% off with code "TWIR".
📜 Progressive JSON: Dan uses various analogies to illustrate the difference between different data streaming strategies. The depth-first strategy - used by JPEG, JSON and HTML - streams the data in order and either delay the parsing or creates an arbitrary cutoff point. The breadth-first strategy streams data out-of-order, replacing nested data with placeholders that can be filled later. React Server Components use the breadth-first strategy. Suspense allows to intentionally reveal the UI, decoupled from data reception. A quite interesting post that also exists in video format.
📜 One Roundtrip Per Navigation: Dan gives a comprehensive overview of the tradeoffs of the main React data fetching patterns. Using Server Components is quite similar to composing many Server Loaders into a single one, giving you the performance and co-location benefits of Relay while using vanilla JS code.
📜 RSC for LISP Developers: The
’use client’directive is similar to LISP quoting, marking a piece of code as data to be evaluated later.📜 Why Does RSC Integrate with a Bundler?: Server Components need a way to serialize component modules from the server to the client. It’s technically possible to do so without a bundler, but it’s inefficient.
📜 Search Params Are State: Tanner gives good reason for TanStack Router to associate a search params schema with route definitions. This helps improve type-safety, optimizes re-renders, and prevents schema fragmentation.
📜 The Power in Pragmatism: Libraries from the TanStack ecosystem aren’t tied to any rendering framework, but focus on the core ideas.TanStack Start is a flexible framework that adapts to your needs instead of anticipating them.
📜 useSyncExternalStore: Demystified for Practical React Development: A good overview of one of my favorite hooks, including common mistakes.
📜 Directive prologues and JavaScript dark matter: Gives interesting context on various ways to control how JS is interpreted: JSX pragmas, directives, and magic comments.
📦 Lingo Compiler: A free open-source compiler to automatically translate any React app at build time without touching the source code. It processes the React code AST and translates it automatically with LLMs, and even supports hot module replacement. A great innovation with first-class integrations for Next.js, React Router, Remix, and Vite apps. The demo on X is impressive.
📦 LiveStore Beta: The creator of Prisma introduced a new client-centric state management solution with first-class support for React and Expo. Based on SQLite, event sourcing, and reactivity, it can also sync clients through various providers. The landing page is quite cool to check and explains how it all works.
📦 Base UI 1.0 Beta: The upcoming Radix UI contender is now in beta. This release includes new Menubar, NavigationMenu, and ContextMenu components.
🎥 Theo - Remix is ditching React (and I think that's a good thing)
🎥 Ryan Carniato - The 3 Ways JavaScript Frameworks Render the DOM
🎙️ This Month in React - Dan explains RSC. Remix v3? React core team WIP?
💸 Sponsor
Build a working reward flow in minutes — with Dynamo
Building loyalty logic from scratch is a pain — infra setup, reward tracking, event triggers, tier rules… it all adds up.
Dynamo is the loyalty engine built for developers: one API, full control, zero gatekeeping. Get hands-on with real SDKs (React + React Native), clear docs, and a live sandbox to test your own reward flows in minutes — no calls, no credit cards, just code.
📱 React-Native
Freezing the Legacy Architecture
The React Native team officially announced their plan to freeze the Old Arch Legacy Arch, so that they can focus all their efforts on the New Architecture. They’ll keep the Legacy Arch usable through security and critical bug fixes, but don't plan to merge new features. They'll eventually remove it an indefinite future, because keeping it around has a maintenance cost.
👀 Hermes PR - Add Node-API to Hermes: Recent conversations show the Hermes team excited to accept this Microsoft PR, and plans to leverage the integration for standard library APIs such as
Intl,Temporal.📜 ReactRaptor: Find out which Android apps are built with Expo: This cool app scans your phone and shows you a list of RN/Expo apps. I just tried and discovered many apps I didn’t suspect were using RN, including local French ones. This might be super helpful to find a new RN job or freelancing customer.
🎥 Simon Grimm - React Native Tabs Navigation with Expo Router
🎙️ Rocket Ship 71 - Reanimated 4 Beta, LiveStore, DevTools & Expo Router Course
🔀 Other
📣 TC39 Advances 9 proposals including
Array.fromAsync,Error.isError, and Explicit Resource Management to Stage 4: Great to see theusingkeyword landing in the spec, and already leveraged by Vitest, and the new Random namespace and functions is also quite exciting!📜 Resilient Import Maps: Shopify made a significant contribution to the HTML spec so that browsers can declare multiple import maps. I believe it’s not a coincidence and Remix v3 is likely to leverage that.
📦 Rolldown-Vite: The Rolldown-powered version of Vite just reached feature parity with its parent project. Now available in technical preview, it can be used as a drop-in replacement. Early adopters reported up to 16x faster builds.
📦 Vitest 3.2 - Annotations API, Custom Browser Locators,
using, Test Signal, better Coverage Result📦 Vite 7.0 Beta - Drops Node 18, ESM-only, browser targets
baseline-widely-available📦 Babel 8 Beta - Drops Node 18, ESM-only, cleanup technical dept
🤭 Fun
See ya! 👋