View profile

This Week In React #90: JSX, Tinybase, Dioxus, Owl, useWorkerizedReducer, Perf, TypeScript, CSS...

This Week In React #90: JSX, Tinybase, Dioxus, Owl, useWorkerizedReducer, Perf, TypeScript, CSS...
By Sébastien Lorber • Issue #90 • View online
Hi everyone!
Newsletter late this week! I have severe network issues 😅 with the delay, the much awaited Remix vs Next.js article was just published: my comments next week ;)
A week with various content, from interesting React articles to new tools leading to some healthy FOMO 😇
Parcel CSS reusing a Rust css parser initially created for Firefox, that’s really cool!
I was also happy to notice that Node.js plainly supports Error Cause!
🙏 Support the newsletter 🙏

React
We like React because it’s just JavaScript and we don’t need to learn another templating language. But let’s admin it’s not always easy and there are some pitfalls to avoid 😅 This article gives a great overview.
Surma (Google) introduces a lib to use a Service Worker to create a React reducer (possibly async). Communication is efficiant thanks to ImmerJS and transmitting patches using postMessage. Browser support is good, only Firefox needs a polyfill. Now let’s find a good use-case for this 🤷‍♂️, anyone?
Interesting thoughts on the current limits of end-2-end typing in Next.js, focusing on getServerSideProps and page props. There’s either too much manual boilerplate (risk of error), or a type helper InferGetServerSidePropsType that might give surprisingly unsafe results. Evokes a TypeScript feature much-awaited by all frameworks: the ability to type module exports. Presents other solutions like Blitz, Server Components or tRPC. The last one looks quite interesting (see also the zart boilerplate using it).
New reactive store for structured data (in tables, like SQL or Normalizr), with a React integration package including hooks like useCell for efficient, fine-grained subscriptions. Small in size, but quite featured: index, relationships, undo/redo…
Extras:
💸 Sponsors
Stream is the maker of enterprise-grade APIs and SDKs that help product and engineering teams solve two common problems at scale: in-app chat and social activity feeds.
With Stream, developers can integrate any type of messaging or feed experience into their app in a fraction of the time it would take to build these features from scratch.  Stream Chat makes it easy for developers to integrate rich, real-time messaging into their applications.
Stream provides robust client-side SDKs for popular frameworks such as React, React-Native, Flutter, Android, Angular, Compose, Unreal and iOS. It also supports Expo managed workflow.
Unlock enterprise-grade features, functions, and UI components completely free for your startup or side project with the Maker Account.
React-Native
This new solution runs your React-Native screens natively, takes screenshots, and compare them to the previously stored screenshots in ./owl to generate a report. All this is well-integrated with Jest (like snapshots).
Very happy to see visual regression testing progress for React-Native: this is very useful and React-Native has been left behind a bit compared to web. See also Storybook React-Native-Web permitting to do similar things with Chromatic, but requiring a web conversion.
Extras:
Partners
  • Start React Native: learn everything about gestures and animations with William Candillon
  • React-Native Weekly: stay up-to-date React-Native core updates
  • TypeScript Weekly: the best TypeScript links every week, right in your inbox.
  • ES.next News: learn about the latest in JavaScript and cross-platform tools
  • Tailwind Weekly: all things Tailwind CSS, new issue every Saturday
  • G2i: pre-vetted remote React & React-Native developers you can trust on contract or full-time basis
  • Infinite Red: US React-Native experts making your idea a reality
  • Software Mansion: the co-creators of React Native and the technological core of many tech companies
Other
A new parser, compiler, minifier un CSS written in Rust, reusing rust-cssparser from Firefox. Outperforms competitors on terms of speed and output size (even esbuild). Integrated in Parcel, but can also be used standalone, in Rust or JavaScript (Webpack?), and even Deno or web (WASM)
New Rust framework largely inspired by React (hooks, VDOM, RSX…), strongly typed, performant, cross-platform (web, mobile, desktop, SSR). Aiming to be easy to adopt for a React/TypeScript dev.
I looked a bit the cross-platform support and I’m not sure yet how it works. It says native performance but seems to be using Tauri on desktop and mobile, afaik using WebViews? 🤔
Extras:
Did you enjoy this issue?
Sébastien Lorber

📨 For React and React-Native developers ⚛️ I filter out the noise 🔊 You save time ⏱️ Stop losing your time scrolling on Twitter! 🐦

⚠️ The newsletter has moved!
➡️ Go to ThisWeekInReact.com

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