This Week In React #231 : React Labs, Compiler, React Router, Next.js, Router | TC39, Surveys, Rspack, tsdown

#react #reactnative

Hi everyone!

Cyril and Matthieu from Theodo Apps here 👋, standing in for Seb to bring you the latest news from the React and React Native worlds.

This week, we have two exciting blog posts for the React team, and a special guest from the React core team has a message for you all!

We've also been reading quite a few interesting blog posts from the "official" blogs and the community.

💡 Subscribe to the official newsletter to receive an email every week!

💸 Sponsor

Convex: The Database Designed for AI Coding

In the age of code generation, you need a backend that you can confidently generate with AI platforms. Convex is by far and away best in class in this respect.

This is because Convex is just TypeScript, allowing you to write queries as code that are automatically transactional, cached, and realtime.

And that’s just the beginning. With Convex, you can:

Easily schedule functions and write cron jobs
Set up file storage
Write efficient server functions
And so much more…

Try a Quickstart today

⚛️ React

React Compiler RC

The React Labs post is not the only exciting update this week! The React Compiler is also in Release Candidate, in preparation of the compiler’s stable release.

The Babel-free builds is a welcome improvement so that we can keep using the compiler with our modern Rust tooling!

💸 How to build a multi-tenant app using Clerk + Supabase
🗓 Future Frontend - 🇫🇮 Espoo - 26-28 May. Dive into the future of frontend development with Aurora Scharff, Rachel Nabors, and others! Use code "TWIR" for a 10% discount.
📜 Impossible Components: Dan Abramov continues his series of blog posts about RSC, this time detailing, among other things, how it squares with React’s top-down data flow.
📜 Faster Lazy Loading in React Router v7.5+: This was released a few weeks ago. Mark Dalgleish explains in this post why the new approach (lazy loading by route properties instead of the whole route) was necessary, especially when using middlewares.
📜 Performance tips with Next.js: A nice recap of all the available optimizations: pre-render, use caching, watch bundle size, lazy-load what can be, optimize fonts and images, use virtualization…
📜 Simplify TanStack React Query State Handling with Pattern Matching
📜 Using Client Caches In Loaders
📜 Life of a Request: Application-aware routing - Vercel
📜 Tailwind vs Linaria: Performance Investigation
📦 c15t: A new consent management framework coming with drop-in React components.
📦 Redux Toolkit 2.7: Standard Schema for RTK query, improved infinite queries.
📦 Headless Tree 1.0: A successor to React Complex tree, the author has a blog post explaining the change.
📦 Module Federation Core 0.13: Better React 19 support and bug fixes.
📦 Base UI 1.0 alpha-8: The new Radix UI alternative keeps progressing with new Toast and Meter components among many other things.
🎙️ Syntax.fm - React Server Components: Where are we at?

💸 Sponsor

Self-service analytics and dashboards in your product

Your engineers didn’t sign up to build dashboards.
Let them focus on features.

With Semaphor, your data team can ship insights independently. No code changes, no front-end redeploys. Decouple analytics from your product code and move faster.

📱 React-Native

Legend List 1.0

Making long lists performant is a hard problem, and React Native’s old architecture wasn’t making it any easier with it’s asynchronous layout computation. We remember Margelo abandoning their WishList project.
Legend List is now in version 1.0, and promises to be even faster than FlashList, all the while handling the "hard cases": bidirectional infinite lists, varying item sizes… And it's compatible with the old arch (though less performant and with possible glitches).

As Seb mentioned last week, there’s also a v2 of FlashList in the works, which should be easier to use (no need to specify estimatedItemSize for instance).

Thankfully, all those copy the API of FlatList so it’s easy to switch back and forth 🙂.