#164 — November 13, 2019

Read on the Web

React Status
Your weekly React news digest, every Wednesday

Building Great User Experiences with Concurrent Mode and Suspense — If you watched some of the ReactConf talks (linked last week), you may have seen how Facebook has been leaning on the latest React features in its redevelopment. This post goes into depth on the topic, and while it’s aimed at library authors, most React developers will find something of interest here.

Jospeh Savona

How Discord Achieves Native iOS Performance with React Native — Discord, the popular gamer-aimed chat system, chose React Native very early on as the basis for their iOS app, but they’ve had to invest a lot of effort in keeping it performant.

Miguel Gaeta

Get Best in Class Error Reporting for Your React Apps — Time is money. Software bugs waste both. Save time with Bugsnag. Automatically detect and diagnose errors impacting your users. Get comprehensive diagnostic reports, know immediately which errors are worth fixing, and debug in minutes. Try it free.

Bugsnag sponsor

Adaptive Loading Hooks: Deliver Experiences Best Suited to a User's Device and Network Constraints — A suite of React Hooks and utilities for adaptive loading based upon things like device memory, CPU capability, and connection type.

Google Chrome Labs

Microsoft Looks to React Native As A Way to Tackle Cross-Platform Development — A variant of this story has bubbled up a few times in the past year, but it’s interesting to see Microsoft skipping its own Xamarin platform in favor of React in more places.

The Register

Why Suspense Matters: A Twitter Thread — Asynchronous tasks (such as fetching data from a remote API) can introduce inconsistencies into a state-based UI. Suspense, however, “guarantees the UI you see is always consistent” and “That’s what Suspense is really all about.”.

Dan Abramov on Twitter

💻 Jobs

Senior Software Engineer at Getty (Los Angeles, CA) — Build fantastic tools and interfaces at one of the world's most prestigious cultural heritage orgs using Linked-Open-Data, Python, Structured-CMS, Vue.js

J. Paul Getty Trust

Find a Job Through Vettery — Make a profile, name your salary, and connect with hiring managers from top employers. Vettery is completely free for job seekers.

Vettery

📘 Tutorials and Stories

How Concurrent React Changes The Game for Data-Heavy UI — Concurrent React and Suspense are shaping up to heavily change how dynamic data-driven UIs are built.

Topher Winward

Tried & True Tips from 24 React Experts to Make You More Productive — Get invaluable, practical productivity tips from React and JavaScript experts on how to excel in React. Read on.

Progress KendoReact sponsor

Understanding React's key Prop — The key prop is a mechanism for controlling component instances. “I want to share a little trick with you, not because I use this a lot, but because understanding this principle will help you understand React a bit better.”

Kent C Dodds

Using NFC on iOS in React Native — iOS 13 opens up the opportunity to interact with NFC chips and devices, and you can take advantage of this from React Native apps too.

Tamas Szikszai

▶  Joe Savona on Relay and Data Fetching with Suspense — Joe has spent the last year working with the React team in developing a Relay-Suspense integration for Facebook and shares some of what they’ve learnt here.

React Podcast podcast

Learn React Context in 5 Minutes - A Beginner's Tutorial — React’s Context API has become the state management tool of choice for many, oftentimes replacing Redux altogether.

Bob Ziroll

Making Instagram.com Faster: Code Size and Execution Optimizations — The latest in a series of posts from the Instagram team.

Glenn Conner

▶  Listen to the Podcast: Accessibility in Web Standards

Heroku sponsor

How to Test React-Redux Hooks with Jest

Albert Gao

🔧 Code and Tools

Interactive React Paycard: A Smooth Credit Card Form — Someone saw the vue-interactive-paycard control we featured in JavaScript Weekly recently and thought.. we need a React version of that!

jasminmif

Redux Starter Kit is Now Redux Toolkit — We only linked to version 1 two weeks ago, but Redux Starter Kit, a toolset designed to make working with Redux easier, has now rebranded.

Redux Toolkit

Animavita: A React Native App for Finding Pets to Adopt — Always good to see an open sourced example of a complete app’s codebase.

Wendel Freitas

html-react-parser: An HTML to React Parser — For both client and on the server.

Mark Xu