📨 #232: React Router, Next.js, Radix, Vite, MCP, Storybook | Entreprise Framework, Shopify, Brownfield, WebGPU, AI, Release-It, Expo | Node.js, Async Svelte, Compile Hints, View Transitions
· 8 min read
Hi everyone!
I hope you've recovered from last week's React Labs news 🔥. This week is of course quieter, but still interesting, with great community articles, weak signals to look at, and a few releases.
Make sure to upgrade your React Router v7 app, and bump to Node.js >= 18!
As always, thanks for supporting us on your favorite platform:
- 🦋 Bluesky
- ✖️ X / Twitter
Don't miss the next email!
💸 Sponsor
Bit: Deployment independence with SPA and SSR
Build highly performant and consistent platforms from independent business features combining React, NodeJS, Angular or Vue components. Allow developers to integrate and test changes in the context of the complete platform while working independently.
Eliminate integration guesswork and the risk of breaking existing functionalities.
Start composing your existing code today!
⚛️ React
- 💸 Convex launched an MCP Server
- 🔐 React Router vulnerabilities and v7.5.2 fixes: React Router v7 has 2 important security vulnerabilities that could lead to DOS and XSS attacks. They have been fixed in the latest v7.5.2 release. Various cloud providers have deployed a mitigation already (Vercel, Netlify, Cloudflare), but it remains useful to upgrade.
- 👀 Next.js Docs PR - Remove Vercel mentions: The Next.js docs should now be less biased toward Vercel, and include its competitors more fairly. Personally, I think there's nothing wrong with offering your OSS software to the community and using it as a marketing vector for your paid offer (this is how many OSS projects become sustainable). Even for a larger company like Vercel, it's fair play to do that, but probably necessary to restore the broken trust with some of you.. A reminder that Vercel is not “taking over” the React team, and various client-side-only React Labs features announced last week are implemented by Vercel employees (such as
<ViewTransition>). - 👀 Vite RSC Plan: A Vite contributor is taking over the development of an upcoming
react-server-dom-vitepackage. Many integration PRs have been sent to frameworks like Waku or RedwoodSDK. - 🗓 React-Summit - 🇳🇱 Amsterdam - 13 & 17 June. Check out the full lineup with 60+ speakers at the biggest React conference worldwide! Use promo code TWIR for 10% off tickets.
- 🗓️ StrapiConf - 🇫🇷 Paris - 13 May. Last call to join us for a deep dive into the future of headless web development! Get a 10% discount with code "TWIR
- 📜 What Does "use client" Do?: Dan Abramov explains RSCs have no API surfaces. The directives are module system features that open doors between 2 worlds and could even make sense beyond React. Speaking of Dan, he just re-launched his YouTube channel, in case you want him to walk you through his blog posts.
- 📜 You can serialize a promise in React: A great interactive article that explains how React is able to forward a Promise from the server to the client through a stream. To do so, it re-creates a tiny version of this mechanism.
- 📜 React Internals: Which useEffect runs first?: A good reminder that
useEffectcallbacks run bottom-up, from the deepest child to the root (unless you use<Activity>,but that’s a story for another time 🙈). - 📜 Concurrent Optimistic Updates in React Query: Dominik shares interesting patterns to avoid displaying an inconsistent UI when using React Query with concurrent mutations and optimistic updates. Tip: only call
invalidateQueries()when there’s a single in-flight mutation. - 📜 Parents & Owners in React: Context Providers: Explains the difference between parent and owner components. By restructuring the owner tree without changing the parent tree, we create more targeted “units of update”.
- 📜 From Next.js to Astro: A Page Size Comparison: A quite fair numbers comparison after porting a small static Next.js site to Astro, reducing bundle size.
- 📜 Per-Route Documents in RedwoodSDK: Total Control Over Your HTML
- 📜 React-admin With Shadcn UI
- 💸 Tolgee React - Translate Apps with Tolgee and Forget About Infinite Spreadsheets of Text
- 📦 React MCP Server (experimental): It’s in the React repo, but for now, it’s just a one-person fun experiment by Lauren (React Compiler team).
- 📦 Radix UI 1.3 - OneTimePasswordField: In case you missed it (we did!), there’s now a
radix-uipackage to consolidate all Radix primitives under a single roof (instead of@radix-ui/*imports). It’s likely thatshadcn/uiwill adopt it and provide a codemod in the future. - 📦 Storybook 9 beta: The new version is now feature complete, with a good focus on testing (components, interaction, accessibility, visual tests). The tag-based organization should help improve UX. Also includes first-class support for React Native Web.
- 📦 Lexical 0.31 - Extensible text editor with React bindings
- 📦 Frimousse - A lightweight, unstyled, and composable emoji picker for React
- 🎥 Theo - React just got way cooler
- 🎥 Jack Herrington - Better-Auth: Headless Authentication for Your TanStack Start App
- 🎙️ This Month in React - React 19.1, Next.js 15.3, RN v0.79, RTK, React Aria
Don't miss the next email!
💸 Sponsor
How to take Clerk to Production
Step-by-step guide for developers to launch a Clerk app in a production environment with a custom domain, OAuth credentials, and secure DNS configuration.
📱 React-Native
React Native Enterprise Framework
The Callstack project is now open source. It’s built as a drop-in replacement for the RN community CLI to help you adopt React Native incrementally in existing mobile apps (also called “brownfield”). The features include:
- Incremental adoption in native apps thanks to our simplified brownfield approach
- Web-like DX thanks to advanced native build caching hosted on your infra
- Pluggable design to leverage out-of-tree platforms, custom bundlers, etc.
- 💸 Build a Modern Multi-User Chat App with React Native
- 🐦 RN 0.79 now has buit-in support for "aliases" (through Metro package.json
imports) - 📣 Expo Changelog - New Build Comparison Tool, Expo Router Landing Page, and UX Improvements
- 🗓️ App.js Conf - 🇵🇱 Kraków - 28-30 May. This is your final chance to join the biggest React Native & Expo event. Secure your seat now and enjoy a 15% discount using code "TWIR"
- 📜 Shopify Mobile Bridge: Making WebViews Feel Native: As part of their transition to React Native, Shopify implemented a fast custom WebView solution that looks and feels native. Critical screens remain implemented using native technologies, but this Mobile Bridge powers many of their important but non-critical screens.
- 📜 Powering Native Apps with React Native Brownfield
- 📜 React Native macOS - The best way to include custom fonts
- 📜 Migrating to React Native with Expo: A Path to Cross-Platform Success
- 📜 Optimizing Mobile App Battery Usage & Crash Rate
- 📦 React Native WebGPU Worklets: Run smooth WebGPU-backed animations (including Three.js) on any threads (UI/background), powered by Reanimated Worklets
- 📦 React Native AI 0.1: New Callstack project to let you run LLM models on-device, based on Vercel AI SDK.
- 📦 Expo-Release-It - Opinionated CLI for building, uploading, and submitting Expo CNG project on your machine: An interesting local alternative to EAS?
- 🎥 Simon Grimm - Epic React Native Snippets You Need to Know
- 🎥 Theo - React Native Is More Popular Than You Think
- 🎙️ React Native Radio 329 - State of React Native Survey Results are in! - RNR 329
- 🎙️ Rocket Ship 66 - Expo 53 BETA, FlashList v2, RN Popularity, App Sales & OTA Alternative
🔀 Other
- 📣 Node.js 18 reaches End-of-Life today: This Node.js version will no longer receive security updates, and it’s recommended to upgrade to v20 or v22.
- 👀 Asynchronous Svelte: Svelte has a new async experimental mode, and this doc explains how it works. The “Forks” section reminds a bit of Concurrent React, transitions, and its upcoming
<Activity>component. - 👀 Firefox enabling View Transitions in Firefox 139 Nightly builds: A positive signal from the only remaining browser to not have this feature. Good timing for React and its upcoming
<ViewTransition>component? - 📜 Giving V8 a Heads-Up: Faster JavaScript Startup with Explicit Compile Hints: A new feature coming with Chrome 136 allows faster web page loading by annotating your files/functions with magic comments to tell V8 to compile the JS code eagerly, showing promising results on experiments. Maybe it will be useful to speed up React hydration or even Node.js programs?
- 📜 Categorize Your Dependencies: Using pnpm catalogs.
- 📜 How Node.js Works Behind the Scenes
- 📜 A Decade of SolidJS
🤭 Fun
See ya! 👋
Don't miss the next email!
