This Week In React #108: App.js, Fresh, Reassure, Million, Hydrogen, Gatsby, Treasured, WebComponents, RNW, Zeego, TC39...

Sebastien Lorber - Jun 15 '22 - - Dev Community

Hi everyone!

This week we celebrate the official death of IE11! 😄

I just came back from the App.js conf in Krakow: a very nice experience that I recommend to any React-Native dev 👌. Check my summary on Twitter!

Lots of interesting releases this week. And with React Summit coming up, it should continue 🤯

🙏 Support the newsletter:

If you like this newsletter, subscribe in priority there:


React

Fresh - The next-gen web framework.

Luca Casonato (Deno core team) unveils a new meta-framework for Deno based on Preact. Shares some common points with Next.js and Remix (FS routing, progressive enhancement). Islands architecture for hydration. No build step: compile on the fly. To be tested!

Reassure

A new performance testing tool for React should be open-sourced next week. Measures and counts renders of a given scenario, snapshot them, and generates a report on changes (possible to publish in a PR). Announced at App.js, the tool only supports React-Native for now: web support will come later.

Million.js

Million is a Virtual DOM solution supported by Vercel, which proposes to use a compiler to improve performance and reduce size (inspired by Svelte). The Million + React integration package has just been released. All this seems promising, but not yet ready for production.

Gatsby Launch Week

A digest of the latest Gatsby news, with detailed blog posts on each topic. Some of those topics:

  • Script Component
  • GraphQL TypeGeneration
  • Image CDN GA
  • Incremental Deploys for All Builds

Shopify - Best-in-Class DX with Vite and Hydrogen

Interesting feedback on the usage of Vite in the Shopify Hydrogen meta-framework. There are advantages in terms of DX via the use of ES modules in dev, but also for the SSR and the integration of React Server Components thanks to its plugin system.

Extras:


💸 Sponsors

💡 How to sponsor this newsletter

Axiom - Zero-Config Observability for Vercel

Axiom enables you to monitor the health and performance of your Vercel deployments by ingesting all your request, function, and web vitals data.

Use Axiom's pre-built dashboard for an overview across all your Vercel logs and vitals, drill down to specific projects and deployments, and get insight on how functions are performing with a single click. 

PSI use it myself to monitor the newsletter signups 😉

Scale Your Meteor Apps Confidently With Minimal DevOps

Meteor Cloud is the only full-service cloud solution engineered for Meteor apps.

You'll be able to host and scale your Meteor app with ease, monitor performance, and reduce time spent on DevOps, all from one centralized dashboard.

Configure your hosting needs to your exact specifications or use intuitive out-of-the-box features designed by long-time Meteor developers.

Save $1,000's per month on DevOps costs with the additional comfort of knowing your app is supported by in-house Meteor experts. Sébastien's readers get a special 30% OFF discount. Grab the offer here!


React-Native

App.js - Mon résumé sur Twitter

It's hard to summarize everything exhaustively. With Expo, mobile DX continues to improve. There is a real craze for web support! New tools available for performance monitoring. Various useful links:

  • 🧵Expo Dev Tools Keynote: EAS Metadata, versioned CLI, config plugins, universal Metro, lazy bundling...
  • 🧵 Sketches: David created sketches for each talk of the conference, giving a good overview.
  • 🐦 Expo Sweet Modules: A new API to facilitate the creation of native Swift/Kotlin modules will be released in Release Candidate this week.
  • 🐦 Shopify FlashList: a powerful alternative to FlatList that will be released soon.
  • 📦 Zeego: cross-platform menu components, from Fernando Rojo.
  • 📦 Universal Design System: Showtime has open-sourced its frontend and cross-platform design-system.
  • 🎥 Live streams: day 1 - day 2

React Native for Web 0.18

React 18 support, introduction of the new styleQ runtime, removes support for older browsers, various improvements. A step toward the ability to statically extract CSS? Nicolas Gallagher questions the usefulness of his project 🤔.

Extras:


Other

Updates from the 90th TC39 meeting

Various progress of proposals. I'm especially happy for "Symbols as WeakMap keys" in stage-3. It's an important step to be able to use Records & Tuples with React someday 🤗.

Extras:

CleanShot 2022-06-15 at 09 57 58@2x

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .