This Week In React #92: Remix, MDX 2, Lifetime Analysis, Story of React, Quick Start Docs, TypeScript, Node.js, Deno...

This Week In React #92: Remix, MDX 2, Lifetime Analysis, Story of React, Quick Start Docs, TypeScript, Node.js, Deno...

Hi everyone!

Trending this week: the convergence of frameworks and tools, using standard web APIs: Remix, Deno, Node.js...

MDX v2 freshly released, exciting for interactive content authors!

Quite calm on the React-Native side.

A good amount of TypeScript content.

It's exciting to see Vercel continues its investment to bring us faster DX: porting tsc, and hiring NAPI-RS creator. The plan is indeed to cover all the build pipeline, including replacing Webpack.

🙏 Support the newsletter 🙏:

TWIR_POST.png

React

Remix: Not Another Framework!

Remix builds on top of Web standard APIs. Ryan Florence can't predict if Remix will stick, but gives good reasons to learn it: the knowledge you acquire won't be lost. It's like React: no need to learn another templating language, and the JS knowledge you get by using JSX remains usable in many other places.

Remix is also designed to be framework-agnostic. On Twitter, Ryan Florence teases us on the next possible targets for Remix. I bet on Qwik and Solid.

I increasingly see Remix as a potential gateway to Deno (also based on web APIs), and possibly the next framework to outlive React.

Unrelated: Kent C. Dodds had a serious car accident 🤕

MDX 2.0

Official launch for MDX 2.0. This technology permits to interleave Markdown and JSX quite easily, very convenient to create interactive content (ie Josh Comeau's website, Docusaurus...).

v2 improves on many things: fixes a few syntax problems, significantly improves performances , can support other frameworks...

Lifetime Analysis for React Component Architecture

Alan is inspired by the concepts of lifetime analysis and ownership of objects in Rust to deduce where to put his React state. I feel like I do exactly this, intuitively. Original reading, a little verbose initially, but this makes sense at the end. No need to understand Rust.

Creating a Schema-Based Form System

Tania explains how to drive the rendering of a React form with a JSON schema. The example is based on Formik and Yup, but it is above all the technique that matters, and can be useful for integration with a CMS or backend that sends you such schema.

Extras:

💸 Sponsors

Stream: powerful Chat & Feeds for React & React-Native

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

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

Porting tsc to Go (not Rust))

With the arrival of new bundlers, type-checking becomes the bottleneck in larger codebases. Donny (Vercel) is the author of SWC (Rust). He attempted a complete rewrite in Rust (POC compiles 62x faster than tsc), but it's a lot of work compared to a port that would draw on existing tsc code.

Problem: the tsc codebase is difficult to port to Rust (shared mutability, GC...), and Go is better suited for this specific task.

The plan of SWC and Vercel is clear: they will provide us fast tooling for the everything we need: transpilation, typechecking, minification and bundling.

About porting tsc, another alternative in Rust exists - tyty - but for the moment it's a side-project, not yet open-sourced.

Deno in 2021

Deno shares its 2021 retrospective, with improvements on the core (opcalls, perf, FFI), their Deno Deploy service (V8 isolates, comparable to Cloudflare, good target for Remix)...

I'm excited about the compatibility with web APIs and Node.js compat mode. With Node.js gradually implementing web APIs (see below), we might be able to switch from one to the other more easily through meta-frameworks like Remix.

Extras:

Image description

Did you find this article valuable?

Support Sébastien Lorber by becoming a sponsor. Any amount is appreciated!