Seb βš›οΈ ThisWeekInReact.com Profile picture
Apr 5, 2021 β€’ 16 tweets β€’ 10 min read β€’ Read on X
This week in React

πŸ‘‰ React Labs
πŸ‘‰ Next.js 10.1
πŸ‘‰ Dependency Injection
πŸ‘‰ Fastest Text Update
πŸ‘‰ Tuples?
πŸ‘‰ React React Errors
πŸ‘‰ Expo 41
πŸ‘‰ RN Timeline
πŸ‘‰ Web: Flutter vs RN?
πŸ‘‰ TS 4.3 beta
πŸ‘‰ Coolify
πŸ‘‰ Storybook 6.2
πŸ‘‰ Change Array by copy
...

🧡🧡🧡 Details πŸ‘‡πŸ‘‡πŸ‘‡
React Labs: @abernathyca presented a new official video series of technical deep dives in the React research.


The first video is a Q&A about server components:
Next.js 10.1 by @vercel contains significant improvements to Fast Refresh, install time, images

Webpack5 will roll out progressively

The Next.js team plans to make DX even faster.

More high-level tools get released: Shopify integration, Nextra blog...

nextjs.org/blog/next-10-1
React context is for dependency injection, not state management.

I don't see DI widely used unfortunately, and tests get complicated.

This great article from @tgroshon is a good summary of why I think things like Mock Service Worker are a bad idea.

blog.testdouble.com/posts/2021-03-…
Michael presented cool techniques to optimize text rendering in React

Opting out of the reconciler, using imperative dom updates, and using batching strategies to make the browser work less and achieve a high frame rate.

electricui.com/blog/fast-reac…
A few years ago, I had no idea what a Tuple was, and feel the name was a bit "scary".

@kyleshevlin explains what a Tuple is, and that you already use this concept on a daily basis if you are using React.

kyleshevlin.com/what-is-a-tuple
Many devs don't know how to read error messages and interpret stacktraces, while this is an incredibly useful (and portable) skill.

@dceddia shares his method to debug a common React error:
"Cannot read property `map` of undefined"

daveceddia.com/fix-react-erro…
Expo SDK 41 beta has been released by @notbrent

- Still on RN 0.63
- Using stable reanimated 2
- React-native-screens 3 (enabled by default)
- Require iOS 11
- .expo extension deprecated

blog.expo.io/expo-sdk-41-be…
React-Native Weekly W13: @Andrei_Calazans document interesting findings on the React-Native codebase.

One example is Timeline: a new time-travel debugger in ReactNative core?

andrei-calazans.com/posts/2021-03-…
Flutter recently released stable Web support, how good is it?

@ricmac wrote a summary of what the community thinks: it seems many Flutter users on Reddit are a bit disappointed: lacks hot-reload, bundle sizes...

In the meantime: RN works on the web!

thenewstack.io/googles-flutte…
TypeScript 4.3 beta released by @drosenwasser

Many improvements on Classes: new "override" keyword, private elements...

Not a fan of classes: I like the template literal strings improvements and the error on if(promise)

devblogs.microsoft.com/typescript/ann…
Change Array by copy, new stage-0 ES proposal by @r_ricard

New and long-awaited array methods that mutate arrays in a functional way (ie return a copy).

Note: Tuples (of stage-2 Records & Tuples proposal) would have the exact same methods: switch array/Tuple more easily!
Coolify: an open-source self-hosted alternative to Netlify / Heroku by @andrasbacsai

Deploy static websites, NodeJS apps by a git push, including provisioning a DB!

Looks similar to @getmeli but with a larger scope?

github.com/coollabsio/coo…
Storybook 6.2 released by @mshilman

Becomes less biased toward React and improves support of Vue / Svelte support.

Webpack 5, NPM 7, Yarn 2, ESM...

It should be possible to use it with new bundlers like Vite, Snowpack, esbuild.

storybook.js.org/blog/storybook…
🎬 THE END!

Going to turn these threads into emails (when I'll have more time).
βœ‰οΈ Pre-subscribe here: tinyletter.com/slorber

❀️ Like this thread 🧡 ?
πŸ™ Please Retweet πŸ™
πŸ‘‡ Follow the link πŸ‘‡

Previous editions?

Keep reading πŸ‘‡

β€’ β€’ β€’

Missing some Tweet in this thread? You can try to force a refresh
γ€€

Keep Current with Seb βš›οΈ ThisWeekInReact.com

Seb βš›οΈ ThisWeekInReact.com Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @sebastienlorber

Mar 1, 2023
🧡 This Week In React

βš›οΈ
πŸ‘‰ Next.js
πŸ‘‰ Signals
πŸ‘‰ useSyncExternalStore
πŸ‘‰ Server Components
πŸ‘‰ TanStack Bling
πŸ‘‰ Forgetti
πŸ‘‰ Suspense Toolbox
πŸ‘‰ Module Extraction

πŸ“±
πŸ‘‰ Expo
πŸ‘‰ Reanimated
πŸ‘‰ Metro
πŸ‘‰ Restyle
πŸ‘‰ DankStyle
πŸ‘‰ RFCs

Links ➑️ thisweekinreact.com/newsletter/136

Preview πŸ‘‡ Image
🧡 Intro

Signals remained a trending topic this week
Great Next.js 12.3 release unveiling a new cache system

Also many new for React-Native!
Expo 48, Expo Router 1, Expo Image 1, Reanimated 3, Metro symlinks support!

βœ‰οΈ Subscribe by email - Much better!
πŸ‘₯ Join 17000+ readers
Next.js 12.3 was released with great new features.
Many we already knew were coming.

What surprised me most is the new caching system of Next.js leveraging Vercel infra.

Worth checking this thread + link:


"This really unlocks the Edge" Image
Read 9 tweets
Feb 27, 2023
Different perspective πŸ€ͺ

"Mutability has great positives
But thinking immutability is bad may just mean some past patterns were problematic, and not that the entirety of immutable data is bad"

useMemo/useCallback will go away someday

I can agree, but maybe the pain is only temporary?

Maybe we shouldn't throw the immutability model because of short-term difficulties, and the platform should evolve to support better the immutable UI model

Things like Records & Tuples can greatly help

"make the right technical choice, and make the right long term choice"

I think the React team still follow this today

I can understand signals are appealing right now, but is it the way you want to write code in 10 years once the platform has improved?

Read 7 tweets
Nov 2, 2022
🧡 This Week In React

πŸ‘‰ Next.js 13
πŸ‘‰ Turbopack
πŸ‘‰ Remixing Shopify
πŸ‘‰ React-Three-Fiber Journey
πŸ‘‰ Gatsby Valhalla
πŸ‘‰ Full Stack Comps
πŸ‘‰ Rive
πŸ‘‰ Storybook
πŸ‘‰ React-Query
πŸ‘‰ Docusaurus
πŸ‘‰ Asta
πŸ‘‰ Expo 47
πŸ‘‰ TypeScript 4.9
πŸ‘‰ stc

... more by email βœ‰οΈ

🧡 Details πŸ‘‡
🧡 Intro

What a week 🀯

- Next.js conf: Next.js 13 + Turbopack
- Shopify acquires Remix
- Three.js Journey goes React
- Gatsby 5 releases Valhallah

Also testing a new format, do you like it?

βœ‰οΈ Subscribe by email - Much better!

revue.thisweekinreact.com

Sneak peek below πŸ‘‡
🧡 Next.js 13 - @vercel

New app/ directory: enables the new features and latest React 18 innovations like React Server Components and streaming

Nested layouts!

Turbopack: new alpha Rust bundler

Also improves image + font + link and many other things

nextjs.org/blog/next-13
Read 24 tweets
Oct 31, 2022
I'll do a thread with all the funny tweets I gathered for my React newsletter

Too much fun to not share 🀭

Just wondering if I should exclude non-React/frontend memes?

Should I include these? πŸ‘‡

Read 6 tweets
Sep 6, 2022
There are 16 hooks in React 😏 😈

And I bet you never used this one: useSyncExternalStore()

Used internally in state management libs, like Redux

But have you ever thought about using it in your own app code?

πŸ’‘ It could be useful & even prevent some React re-renders

πŸ‘‡ 🧡 Image
Let's start with a real-world problem.

Imagine you are using React-Router and call useLocation() in a few places

➑️ do some conditional rendering depending on pathname, hash, ?search query-string... Image
There are a few potential performance problems, for example:

- whenever you click on hash link, components reading only pathname will re-render ➑️ useless

- whenever you update the ?search querystring link, components reading only pathname or hash will re-render ➑️ useless
Read 13 tweets
May 4, 2022
🧡 This Week In React

πŸ‘‰ Click To Component
πŸ‘‰ Zag
πŸ‘‰ Why I don't miss React
πŸ‘‰ Next.js -> Remix
πŸ‘‰ Next.js ISR
πŸ‘‰ Next.js Router
πŸ‘‰ Component Party
πŸ‘‰ Convex
πŸ‘‰ Concurrent React
πŸ‘‰ Tilg
πŸ‘‰ RN 0.69 RC
πŸ‘‰ Expo 45
πŸ‘‰ RN-Skia, Graph
πŸ‘‰ TS Error Translator

More by βœ‰οΈ

Details πŸ‘‡ Image
🧡 Intro

Great week for React-Native: 0.69 RC, Expo 45, Skia...

New cool toys: Zag, Tilg, Click-To-Component, Convex, Component Party, TS Error Translator...

βœ‰οΈ A lot more links in the email
(a few nice TypeScript and Wasm ones)

ThisWeekInReact.com
🧡 Click To Component by @ericclemmons

Option+Click a React component in your browser to instantly open the source file πŸ‘Œ

Looks very convenient and easy to set up!

Only VS Code, but other IDE support possible
(there's already a PR for Intellij πŸ€—)

github.com/ericclemmons/c…
Read 21 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Don't want to be a Premium member but still want to support us?

Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal

Or Donate anonymously using crypto!

Ethereum

0xfe58350B80634f60Fa6Dc149a72b4DFbc17D341E copy

Bitcoin

3ATGMxNzCUFzxpMCHL5sWSt4DVtS8UqXpi copy

Thank you for your support!

Follow Us!

:(