View profile

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

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