This Week In React #88: Remix, Next.js, React 18, Storybook, Skia, Expo, Turborepo, Nx, Rising Stars, Learning Patterns...
I really like this conf format. The talks are very short and to the point (inspired by Next.js conf? 😏). It's easy to find the time to watch them. My Twitter thread also allows you to skim over the highlights.
Yang has worked a lot with Next.js. He explains how Remix is different very clearly and addresses potential objections. Forms, progressive enhancement, hydration, SSR vs SSG, routing, head links, data fetching, deployment ...
The Remix abstractions look really elegant. They answer real problems that I've encountered regularly: progressive enhancement, layout which unmount / remount, order of CSS, validation of duplicated forms... Remix is definitively a framework to keep an eye on!
Beautiful year for Storybook doing a 2021 retro: Webpack 5, Vite builder, automatic code splitting, faster, smaller... There is also a new ESLint plugin, and they have published an useful UI Testing Handbook
In 2022 we will continue to see great improvements: tests, performance, ESM, stability, embeds and integration with design/documentation tools...
As a cross-platform enthusiast, I'm most excited about the React-Native-Web support that was recently released!
Create-React-App v5: much awaited upgrade, includes Webpack 5 support
Blitz potential pivot: this Next.js fork has interesting unique features but does not take off compared to Next.js. The project could pivot to a framework-agnostic Blitz Toolkit (more emphasis on useful backend-related features) and help users migrate to Next.js + Blitz Toolkit.
React Three Fiber Journey: new resource helps you follow the popular Three.js Journey course (3D) using React
Remix: no static export planned, but wget is suggested 🤔 why not?
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.
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
Skia is Google's 2D graphics engine powering Flutter, Android, Chrome, Firefox...
A Skia renderer for React-Native has just been released, supported by Shopify, and implemented by William Candillon and Christian Falch.
A powerful imperative API (uses JSI, without bridge), 100% compatible with the Flutter one in Dart. This compatibility allows the reuse of CanvasKit (Skia's WebAssembly build) to get a powerful web rendering for free using React-Native-Web 🤯 The animations of the great presentation video are already using this web support through Remotion.
Above this low-level API, a very intuitive declarative API, which integrates nicely with animation libs like Reanimated. All this will eventually be available in Expo!
Ricky Hanlon at React-Conf: "We are not building React for individual platforms, and we are not building for the lowest common denominator".
A fundamental difference between React-Native and Flutter:
Flutter smoothen the differences across platforms: it can save time initially, but you can also reach dead ends with some platforms (like for the web: perf and SEO ...)
React-Native doesn't smoothen these differences, and it's 100% voluntary. We can choose to optionally smoothen them only when it makes sense (with this new project for example)
This is the reason why I bet on React: an incredible flexibility to interface with native platforms and re-use innovations from other ecosystems. We see it with mobile, web, Desktop, Skia, Three.js... and soon VR?
EAS Update in preview: a great new service that should significantly improve DX of Over-The-Air updates. It should catch-up with CodePush on some useful features (rollout, rollback, promote...) and the DX should become one step closer to what we are used to on the web: deploy previews, continuous deployment.
expo-dev-client 0.8.0: new UI, better error handling, Flipper integration...
Upgrades Software Mansion libraries: Reanimated, RNGH, Screens...
New modules to customize navbar/background (demo).
I had the opportunity to comment the Build Tools section.
Swyx wrote a good intro to Turborepo, particularly useful if you don't have time to watch the video.
Note: Nx is a similar project, older and more featured (growing fast this year). They created a page to compare Nx and Turborepo. Jared Palmer comments: "Turbo aims to underdo the competition": do less (on purpose) and be a simpler tool. In my opinion there's room for both, and we should see them grow in 2022.
See also 🎥 Video with Swyx + Nx creators: just published
Learning Patterns: awesome and very polished book and online resource to learn design, rendering and performance patterns, with some emphasis on React.
Updates from the 87th meeting of TC39: array groupBy stage 3. Intl and Regexp progress. Side-note: Records & Tuples has been simplified (no more Box) so that the proposal has a chance to process
Why Vitest: Vitest aims to replace Jest 😏