This week in React

πŸ‘‰ React "Fizz"
πŸ‘‰ Docusaurus i18n
πŸ‘‰ Relay hooks
πŸ‘‰ Preact Server Components
πŸ‘‰ ReactNative 0.64
πŸ‘‰ Bob
πŸ‘‰ React-Navigation 6
πŸ‘‰ CSS for JS devs
πŸ‘‰ TS Constrained Identity Function
πŸ‘‰ ES 2021, TC39 updates
πŸ‘‰ TS-Pattern 3
πŸ‘‰ SvelteKit
...

🧡🧡🧡 Details πŸ‘‡
🧡 React "Fizz": looks like a new project code for React.

The goal is to support Suspense on the server (SSG + SSR) with streaming support!

@sebmarkbage opened many pull-requests already, one of them set-up some initial architecture and document Fizz.

github.com/facebook/react…
🧡 Docusaurus v2 i18n released!

This time I can present my own work 😜

You can now translate your doc sites easily.
v2.docusaurus.io/blog/2021/03/0…

We already have a few early adopters!
- Jest: jestjs.io/blog/2021/03/0…
- Redwood: learn.redwoodjs.com/fr
- PNPM: pnpm.js.org/zh/
🧡 Relay v11 with hook officially released!

Reduce code verbosity and indirection, better typing, and also enable pre-fetching data before render (like on link hover)

Also, the new Relay site upgraded to Docusaurus 2 😜

relay.dev/blog/2021/03/0…
🧡 Preact Server Components?

Looks like @marvinhagemeist from the Preact team is working on it! And has published a first demo on Twitter.

🧡 React-Native 0.64 was released by @grabbou !

Much awaited, finally Hermes is available on iOS and support Proxy (Mobx, Immer, Firebase...).

With Inline Requires + Hermes, no reason your app will have a slow start now πŸ€— (...unless you need OTA 😜)

reactnative.dev/blog/2021/03/1…
🧡 React-Navigation 6 pre-release by @satya164

Unlike v5, it's not a full rewrite.
But rather little improvements and small API breaking changes to reduce confusion.

They'll recommend the Native Stack as default stack soon

reactnavigation.org/blog/2021/03/1…
🧡 Bob: a tool to simplify creating RN libs by @satya164

It was just upgraded, with a new npx command to start a new RN lib easily

It is used by React-Navigation and offers a great DX.
🧡 CSS for JavaScript Developers by @JoshWComeau

css-for-js.dev

Been using CSS for years and not even bad at it.
But still signed up, as Josh is an awesome teacher.

Already learned something on the first module: available temporarily for free:
courses.joshwcomeau.com/css-for-js/00-…
🧡 Constrained Identity Function in TS

@kentcdodds is scratching my own itches here, as I've been looking for a solution to this exact problem quite often πŸ˜…

His workaround is really nice.
Unfortunately, we still need to write code to please TS πŸ˜…

kentcdodds.com/blog/how-to-wr…
🧡 ECMAScript 2021 Release Candidate

That spec is hard to read, and you'd better the summary by @rauschma instead, to check the 5 new features + understand the TC 39 process.

2ality.com/2020/09/ecmasc…
🧡 TC 39 proposal updates

As usual, @GNUmanth sums up which proposals changed stages after the TC 39 meeting.

Temporal stage 3!

But don't miss the less covered yet very interesting Error Cause by @legendecas , which progressed to stage 3 very fast!

dev.to/hemanth/update…
🧡 Incremental Static Regeneration: Its Benefits and Its Flaws

@cassidoo wrote an insightful post about the tradeoffs made by the ISG and the stale-while-revalidate pattern, used by Next.js

Looks like @Netlify is going to propose a new solution

netlify.com/blog/2021/03/0…
🧡 TS-Pattern 3.0 by @GabrielVergnaud

Pattern matching library.
That might help you replace ternaries and switch/case by more declarative code!

API is quite close to the current stage-1 ES proposal.
v3 is considered the first LTS

dev.to/gvergnaud/brin…
🧡 Svelte Kit open-sourced by @Rich_Harris !

The new toolkit to build Svelte apps, using Vite, and replacing Sapper.
Static-site-generation or serverless using adapters.



Read the older blog post for context:
svelte.dev/blog/whats-the…
🎬 THE END!

Turning these threads into emails soon.
βœ‰οΈ 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 Sebastien Lorber πŸ‡«πŸ‡·

Sebastien Lorber πŸ‡«πŸ‡· 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

4 Jan
This week in React (actually 2 weeks πŸ€ͺ)

πŸ‘‰ Special React-Server-Components
πŸ‘‰ Inside React core team
πŸ‘‰ Expo Go
πŸ‘‰ Ignite v6
πŸ‘‰ ReactNative @ Wix
πŸ‘‰ Volta v1
πŸ‘‰ xstyled v2
πŸ‘‰ Moiva
πŸ‘‰ Mythical β€œfast” web page
πŸ‘‰ Typo tolerance

🧡🧡🧡 Details πŸ‘‡πŸ‘‡πŸ‘‡
The @reactjs core team published the state of their R&D about React Server Components, allowing to run some components on the server, and reduce the overhead of shipping some client-side code.

There's a video and a RFC here:

reactjs.org/blog/2020/12/2…
This is an illustration of what could be possible in the future.

Don't worry, React is not becoming like PHP, and it's not because you can that you should.

(In the same way, you could implement a React app in a single very fat component)

Read 26 tweets
21 Dec 20
This week in React

πŸ‘‰ React 2025
πŸ‘‰ Next for Vercel
πŸ‘‰ Vercel Virtual-Event-Starter-Kit
πŸ‘‰ Cloudflare Pages
πŸ‘‰ Meli
πŸ‘‰ Expo Application Services
πŸ‘‰ RN SwiftUI renderer
πŸ‘‰ React pragma
πŸ‘‰ Framer Motion
πŸ‘‰ React-Query 3
πŸ‘‰ RadixUI
πŸ‘‰ Modular
πŸ‘‰ EStimator
...

🧡🧡🧡 Details πŸ‘‡πŸ‘‡πŸ‘‡
React 2025 is a free course created by @leeerob

You'll build a real SaaS app, using a modern tech stack using Next.js, Firestore, Chakra, SWR, MDX, Stripe...

This looks interesting and different from other courses available.

react2025.com
After Vercel 40m$ series B announcement, @rauchg tells us what's Next for Vercel, and the future looks bright.

Core Web Vitals will likely become a very important indicator in May 2021 for SEO, and Vercel will give us the tools to do the right things

rauchg.com/2020/next-for-…
Read 19 tweets
16 Nov 20
What interested me this week❓

πŸ‘‰ React: Chakra, security, device-based code-splitting
πŸ‘‰ ReactNative: at Wix / ProductHunt, React-Navigation v6, Expo Application Services...
πŸ‘‰ TypeScript: at Bloomberg
πŸ‘‰ No-JS
πŸ‘‰ No-Else
πŸ‘‰ No-pipeline
πŸ‘‰ ...

🧡🧡🧡 Details πŸ‘‡πŸ‘‡πŸ‘‡
A nice React security cheatsheet has been posted by @ronperris from @snyksec, with 10 best practices

snyk.io/blog/10-react-…
Chakra UI v1 has been released, congratz to @thesegunadebayo for his popular accessible UI library.

Read 21 tweets
26 Oct 20
What interested me this week:
- Releases: React 17, CRA 4, Node 15
- React compared to Svelte and Vue
- Skypack quality score
- HTTP/3 support spreading
- Framer Motion page transitions
- ...

🧡🧡🧡Details πŸ‘‡πŸ‘‡πŸ‘‡
React 17

No new feature, but the ability to use 2 versions of React in the same app and simplify gradual updates.

Changes to the event delegation model, and the new JSX transform.

reactjs.org/blog/2020/10/2…
Create-React-App 4.0

- Fast Refresh
- React 17 (with new JSX transform)
- ESLint 7
- Typescript 4
- Jest 26
- ...

github.com/facebook/creat…
Read 15 tweets
24 Jul 20
@docusaurus This is a big Docusaurus release, with a lot of improvements.

Thanks to the many contributors to this release, in particular, the @MLHacks fellowship folks.

Here are some highlights

πŸ‘‡πŸ‘‡πŸ‘‡
@docusaurus @MLHacks PWA support, with @workboxjs service workers

With the ability to install the documentation websites and browse them 100% offline
@docusaurus @MLHacks @workboxjs Docusaurus is one of the first to integrate the new @algolia DocSearch v3 experience

The search dropdown is replaced by a fullscreen modal with dark mode support, keyboard shortcuts, favorite docs...
Read 9 tweets
29 Sep 19
After using hooks for a while, and being familiar with the stale closure problem, I don't really understand why we need to handle closure dependencies, instead of just doing something like the following which always executes latest provided closure (capturing fresh variables)
Coupling the dependencies of the closure and the conditions to trigger effect re-execution does not make much sense to me. For me it's perfectly valid to want to capture some variables in the closure, yet when those variables change we don't necessarily want to re-execute
Note that the above code is already used in major frameworks like Formik by @jaredpalmer and probably some others too. Here's a reference:
github.com/jaredpalmer/fo…
React-redux seems to use something a bit similar here: github.com/reduxjs/react-…
Read 14 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

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

Donate via Paypal Become our Patreon

Thank you for your support!

Follow Us on Twitter!