Hi everyone!

This week we have some interesting React criticisms to read.

We also have various interesting routing-related news: Next.js, React-Router, Expo...

The newsletter is finally back to its usual weekly rhythm! I'm just back from vacations, and I took the opportunity to change my email provider: I'm now using ConvertKit. This gives me more flexibility on the email rendering and will allow me to introduce some new features later ;)

To support me:

• 😘 Recommend the newsletter to your friends: it really helps!
• 💸 Sponsor the newsletter or sponsor me
• 🧵 Retweet the latest Twitter thread
• 📨 Reply to this email: feedback is welcome

⚛️ React

React I Love You, But You're Bringing Me Down

The author of React-Admin gives a fair criticism of React on many aspects (forms, useContextSelector, refs, deps array...). Don't miss Dan Abramov's response.

Next.js Layouts RFC in 5 minutes

The file-system based Next.js router will be significantly upgraded in the next major release. It includes support for nested layouts (like in Remix). This allows to avoid unnecessary unmount/remount of a layout during browsing, but also to manage data loading and errors. This article gives a quick overview. See also Delba's thread.

React Router 6.4

Big update: as expected, many Remix APIs (data-loading, mutation...) have finally been moved to React-Router. See the 2min video

What’s New In Gatsby 2022?

Paul upgraded his blog to the latest Gatsby v4 version and shares with us how he used the latest features. Deferred Static Generation can significantly reduce build time. See also Gatsby 5 Umbrella Discussion and the video Gatsby v5 Alpha Showcase: partial hydration is coming!

Extras:

• 🧑‍🎓Beta docs: useCallback + useMemo
• 💬 useEvent update: the useEvent prototype is implemented and available via @experimental. Some concerns will lead to the opening of a new RFC. If I understand correctly it is possible that this hook will never be released but another solution will be adopted.
• 💬 Dan Abramov - "in what ways is react 18 faster than react 17?"
• 📜 The new wave of Javascript web frameworks: a good overview of the frontend ecosystem of Flash until today. Focus on React and its various challengers: Vue, Svelte, Solid, Qwik, Astro, Fresh...
• 📜 Get in Zoomer, We're Saving React: article with interesting ideas. I didn't quite understand what the conclusion is except that React can do better and its challengers don't really improve things 😅
• 📜 useState with URLs: How to persist state with useSearchParams: explains how and why to persist React state in querystring
• 📜 An apparent React bug: related to behavior of the <details> element
• 📜 When to use “useImperativeHandle” and “forwardRefs” in React 18
• 📜 I18n with Storybook: shows how to bring full i18n support in Storybook: locale dropdown switch, RTL support...
• 📜 Storybook community showcase #3
• 📜 The Basics of Remix
• 📜 React and Observables from RxDB
• 📜 Automated Rule Docs With Docusaurus and Remark
• 📜 Me & React: 5 Years in 15 Minutes
• 🐦 Mitosis - Write components with Sveltejs syntax, compile to other frameworks d
• 🎥 React Finland day 1 + day 2
• 🎥 5 Pro-Level React Do's & Don'ts
• 🎥 freeCodeCamp - Code a Minecraft Clone with JavaScript, React, Three.js
• 🐦 React is focused on the problems that matter more: interesting conversations. See also Evan You comment.
• 🐦 React form without useState
• 🚧 MUI Base: the headless alternative to Material UI
• 🎙️ JS Party #244 - The spicy React debate show 🌶️
• 📦 Its fine: a collection of advanced escape hatches for React. Useful for bridging React context between renderers in the React-Three-Fiber ecosystem
• 📦 Theatre.js v0.5: new 3D editor, useful for React-Three-Fiber
• 📦 TinyBase 2.0: reactive datastore with React bindings
• 📦 React-Tether 3.0: one of the very first positioning libs for React seems to be back in business
• 📦 TanStack Query 4.4: decoupled from React, brings the support of another framework: SolidJS.
• 🥳️ Next.js merged 10000 pull-requests

📱 React-Native

RFC: File System-Based Native Routing with Expo and React Native

Evan Bacon is working on a new Expo router based on file-system conventions, similar to Next.js or Remix. He tells us all we need to know about this highly anticipated feature that brings the DX of the web to mobile. This should considerably reduce the boilerplate of our apps, but also improve discoverability, deep linking, indexing, loading data, error handling... See also this thread and this podcast.

• 📦 Announcing Ignite 8.0: "Maverick". InfiniteRed's popular React-Native boilerplate gets a nice update. Many improvements: unification Expo/Vanilla RN, redesign, i18n...
• 📦 FlashList 1.3 - MasonryFlashList: to reproduce a grid layout in React-Native, similar to Masonry/Pinterest
• 🥳️ TypeScripts types have been internalized in v0.71. No more need for @types/react-native.
• 🥳️ React-Native reach 1M downloads/week
• 🐦 0.70: notable improvement in stacktraces
• 🎨 Amazon Interactive Video Service demo: React-Native more performant than TikTok?
• 🎨 Software Mansion - Shared Element Transition + Reanimated sneak peek demo
• 📜 Testing React Native WebView with React Native Testing Library
• 🎙 The React Native Show #16 - React Native at Microsoft
• 🎙 React-Native-Radio #247 - Revisiting common complaints about React Native 5 years later
• 🔗️ There's a Snack for That: Expo Snacks collection

🧑‍💻 Jobs

🧑‍💼 G2i - 100% Remote React Native Jobs

We have several roles open for developers focused on React Native! Pay is ~160k plus 10% bonus. You must have production experience with RN and be based in the US. DM @gabe_g2i to learn more and don't forget to mention This Week in React.

💡 How to publish an offer ?

🔀 Other

• Qwik and Qwik City have reached beta!: cutting-edge framework, React challenger based on resumability instead of hydration
• TypeScript 4.9 beta: new feature satisfies highly anticipated!
• Token CSS: possible alternative to Tailwind?
• Updates from the 92nd TC39 meeting: small update
• Cloudflare - workerd: the Open Source Workers runtime
• Meta - MemLab: An open source framework for finding JavaScript memory leaks
• Type-Level TypeScript
• TotalTypeScript Tips + Zod tutorial
• Ezno, new type-checking compiler for JavaScript
• Turborepo 1.5
• tRPC 10 beta
• 2022 Web Almanac
• Chrome Developers - Container queries begin to land in stable browsers
• WebKit Features in Safari 16.0
• Best practices for creating a modern npm package