This Week In React

By Sébastien Lorber

This Week In React #76: Redux, useSyncExternalStore, context, React-Native, Netflix, Shopify,





Subscribe to our newsletter

By subscribing, you agree with Revue’s Terms of Service and Privacy Policy and understand that This Week In React will receive your email address.

This Week In React #76: Redux, useSyncExternalStore, context, React-Native, Netflix, Shopify,
By Sébastien Lorber • Issue #76 • View online
Hi everyone!
Here is the latest news that I found relevant for a React developer.
🙏 Support the newsletter 🙏:
  • 😍 retweet the Twitter thread of this week 🧵
  • 🤗 recommend it to your dev friends
🚧 Newsletter launch:
I’d like to launch the real newsletter in October 2021! In the meantime, you can take a look at what my French newsletter looks like at The newsletter will include additional links and expanded comments that can’t fit in a Tweet.
Until launch, this email is mostly a recall to not miss the Twitter thread.
I switched to Revue instead of TinyLetter, due to the new Twitter integration. Revue also makes it easier to embed a tweet, so I included some of my favorite picks!

Sebastien Lorber 🇫🇷 🦖 ⚛️ 📨
This week in React

👉 React-Redux & useSyncExternalStore
👉 Context & Perf
👉 Spacing children
👉 Netflix Lattice
👉 React Philosophies
👉 Memo
👉 Remotion 2.4
👉 Next.js SEO
👉 Redwood & Envelop
👉 React Native 0.66
👉 RN packages @ Shopify
👉 RNav v1 upgrade

🧵 Details 👇
Sebastien Lorber 🇫🇷 🦖 ⚛️ 📨
React-Redux v8 first alpha has been released by @acemarke

Rewritten in native TypeScript

More importantly adopts new useSyncExternalStore() hook.

This is an important milestone for React 18, according to @dan_abramov

My attempt to summarize why:
Sebastien Lorber 🇫🇷 🦖 ⚛️ 📨
How to destroy your app performance using React contexts, by @thoughtspile

One of the best articles on React context performance traps (there are many) I read recently

Explains why HOCs can still be useful to reduce rendering work with earlier bailout
Sebastien Lorber 🇫🇷 🦖 ⚛️ 📨
Spacing children in React by @robinweser

We often want to space list items, but without extra margin at the end.
Explains what it takes to build a reliable abstraction to solve this in React

We'll soon be able to use just "gap" in CSS (flex + grid)
Sebastien Lorber 🇫🇷 🦖 ⚛️ 📨
How We Build Micro Frontends With Lattice

@NetflixEng presented an internal React microfrontend framework

Plugins can register themselves in a host app at runtime

Allows to work in isolation & deploy plugin updates without requiring host app rebuild
Sebastien Lorber 🇫🇷 🦖 ⚛️ 📨
React-Native 0.66 introduced by @lunaleaps

Not too far behind 0.65, prepares for iOS 15, Android 12, Apple M1

Improves release process speed/reliability:
- nightly releases on npm
- "commitly" releases on PRs: easier to test PRs before merge
Sebastien Lorber 🇫🇷 🦖 ⚛️ 📨
Reusing Code with React Native Packages at @ShopifyEng

@ElviraBurchik explains work done by the Foundation team to make code-sharing across org easier:

Monorepos, Yarn workspaces, tooling at root, doc site, almost automated Lerna release process...
Sebastien Lorber 🇫🇷 🦖 ⚛️ 📨
Improved app performance and code quality by upgrading React Navigation

@ty___ler explains the strategy to upgrade the large Opendash's app (2016) from React-Navigation v1 to v5.

Gradual migration, v1+v5 working together!

+ TypeScript typing benefits
Did you enjoy this issue?
Sébastien Lorber

📨 For React devs ⚛️ I filter out the noise 🔊 You save time ⏱️

In order to unsubscribe, click here.
If you were forwarded this newsletter and you like it, you can subscribe here.
Powered by Revue