This week in React
React-Hook-Form 7
React-UX-Form
Dumi
Figma-To-React
Recoil 0.2
Hermes Intl + OTA
Nextgen buildtools
Bundless
Microsite
Let
Const
How to test UI
XState Catalogue
Vue 3
IE11
DevTools
TS


Details 
























React-Hook-Form v7 was released by @bluebill1049
https://react-hook-form.com/migrate-v6-to-v7/
Most exciting thing is probably leveraging TS 4.1 template literal types and being able to type-check the form against field-name typos!
https://react-hook-form.com/migrate-v6-to-v7/
Most exciting thing is probably leveraging TS 4.1 template literal types and being able to type-check the form against field-name typos!
New React-UX-Form library by @zoontek
Also based on a subscription model and per-field validation (like React-Hook-Form), also using an interesting "validation strategy" concept.
Compat with React and React-Native.
https://github.com/swan-io/react-ux-form
Also based on a subscription model and per-field validation (like React-Hook-Form), also using an interesting "validation strategy" concept.
Compat with React and React-Native.
https://github.com/swan-io/react-ux-form
Discovered UmiJS by @chenchengpro
A React application framework that can output a static SPA.
https://github.com/umijs/umi
Looks quite popular already and has its own ecosystem, including an opinionated doc site generator called Dumi:
https://github.com/umijs/dumi
A React application framework that can output a static SPA.
https://github.com/umijs/umi
Looks quite popular already and has its own ecosystem, including an opinionated doc site generator called Dumi:
https://github.com/umijs/dumi
Figma to React by @tomsoderlund
It can convert a Figma design to:
- React-Native
- React+Styled-JSX
Code output looks quite clean
https://figma-to-react.vercel.app/
It can convert a Figma design to:
- React-Native
- React+Styled-JSX
Code output looks quite clean
https://figma-to-react.vercel.app/
Recoil 0.2 released by @mcc_abe
Improvements on async selectors, performance and scalability, and various bugfixes.
Future releases will have memory management features like cache eviction policies (LRU). https://recoiljs.org/blog/2021/03/22/0.2.0-released
Improvements on async selectors, performance and scalability, and various bugfixes.
Future releases will have memory management features like cache eviction policies (LRU). https://recoiljs.org/blog/2021/03/22/0.2.0-released
Hermes progress continues!
After Proxies in RN 0.64, @huxpro said Intl support should be added in React-Native 0.65 for Android.
https://github.com/facebook/hermes/issues/23#issuecomment-816126715
After Proxies in RN 0.64, @huxpro said Intl support should be added in React-Native 0.65 for Android.
https://github.com/facebook/hermes/issues/23#issuecomment-816126715
About Hermes and OTA:
@mrousavy it seems RN CodePush OTA already works, even with the newly released iOS support! (community feedbacks from @mrousavy)
https://github.com/microsoft/react-native-code-push/issues/1966
And @expo is likely to add Hermes support soon too!
@mrousavy it seems RN CodePush OTA already works, even with the newly released iOS support! (community feedbacks from @mrousavy)
https://github.com/microsoft/react-native-code-push/issues/1966
And @expo is likely to add Hermes support soon too!
It's a bit difficult to see how the next-gen build tools are different from one another.
@elliotclydenz did a great job comparing them and explaining the tradeoffs!
It looks like Vite by @youyuxi is the simplest option for a drop-in CRA replacement. https://css-tricks.com/comparing-the-new-generation-of-build-tools/
@elliotclydenz did a great job comparing them and explaining the tradeoffs!
It looks like Vite by @youyuxi is the simplest option for a drop-in CRA replacement. https://css-tricks.com/comparing-the-new-generation-of-build-tools/
But there are new nextgen build tool contenders!
Enter Bundless by @__morse
It looks interesting, as it bets fully on esbuild and its plugin ecosystem, even for the production build.
https://github.com/remorses/bundless
Enter Bundless by @__morse
It looks interesting, as it bets fully on esbuild and its plugin ecosystem, even for the production build.
https://github.com/remorses/bundless
Another interesting innovation: Microsite, a static site generator based on Snowpack and Preact, by @n_moore . .
https://github.com/natemoo-re/microsite
Following the progressive enhancement pattern:
- Supports "automatic partial hydration"
- Ships minimal JS to the browser
https://github.com/natemoo-re/microsite
Following the progressive enhancement pattern:
- Supports "automatic partial hydration"
- Ships minimal JS to the browser
Replacing "let" with "const"
https://charles-stover.medium.com/replacing-let-with-const-86797b790775
Can't agree more with this article from @CharlesStover
Your code becomes simpler by using an inner function + return.
Alternatives: IIFE or do-expressions (stage-1):
https://github.com/tc39/proposal-do-expressions
https://charles-stover.medium.com/replacing-let-with-const-86797b790775
Can't agree more with this article from @CharlesStover
Your code becomes simpler by using an inner function + return.
Alternatives: IIFE or do-expressions (stage-1):
https://github.com/tc39/proposal-do-expressions
How to actually test UIs by @winkerVSbecks
Interesting post explaining the tradeoffs of 5 different ways to test UI / components:
- visual
- compositions
- interaction
- accessibility
- user-flows (end-2-end) https://storybook.js.org/blog/how-to-actually-test-uis/
Interesting post explaining the tradeoffs of 5 different ways to test UI / components:
- visual
- compositions
- interaction
- accessibility
- user-flows (end-2-end) https://storybook.js.org/blog/how-to-actually-test-uis/
Vue 3 drop its initial plan to support IE 11
According to this RFC by @youyuxi , explaining the decision:
https://github.com/vuejs/rfcs/blob/ie11/active-rfcs/0000-vue3-ie11-support.md
It's planned to backport important features to Vue 2 for those that need to support IE11
According to this RFC by @youyuxi , explaining the decision:
https://github.com/vuejs/rfcs/blob/ie11/active-rfcs/0000-vue3-ie11-support.md
It's planned to backport important features to Vue 2 for those that need to support IE11
XState Catalogue by @mpocock1
A collection of well-designed state machines for XState.
Includes various patterns from complex forms like wizards) to data-fetching patterns like infinite-scroll
https://xstate-catalogue.com/
A collection of well-designed state machines for XState.
Includes various patterns from complex forms like wizards) to data-fetching patterns like infinite-scroll
https://xstate-catalogue.com/
Chrome DevTools migrated 150k LOC from Closure Compiler to TypeScript.
@TimvdLippe tells the story behind this migration:
- catch more errors than before, but increased compilation time
- using @ts-nocheck everywhere and removing it one file at a time https://developer.chrome.com/blog/migrating-to-typescript
@TimvdLippe tells the story behind this migration:
- catch more errors than before, but increased compilation time
- using @ts-nocheck everywhere and removing it one file at a time https://developer.chrome.com/blog/migrating-to-typescript

Going to turn these threads into emails (when I'll have more time).






