71: Joe Savona on Relay and Data Fetching with Suspense

In the immortal words of TLC, "Don't go chasing waterfalls".
Turns out they're really easy to find in React today.

Joe Savona joins us to talk about avoiding waterfalls in your React code.
He's here for our 2nd of 6 React Conf 2019 interviews to talk about data-fetching strategies with Suspense.

Joe has spent the last year working with the React team in developing a relay-suspense integration for the new facebook.com.

He shares the lessons and patterns they've learned and how they're baking great user experience into Relay.

Fetch-on-render, fetch-then-render, and Render-as-you-fetch are patterns you'll be hearing more often as Suspense picks up steam.

Thankfully, in today's episode Joe helps us navigate that verbiage and determine what our first steps with Suspense should be.

Featuring

Joe Savona — Twitter, GitHub - Michael Chan — Twitter, Website, GitHub

Links

• Data Fetching With Suspense In Relay | Joe Savona — Joe's React Conf 2019 talk on Relay Hooks and Suspense at Facebook
• Building The New Facebook With React and Relay | Ashley Watkins — Ashley's talk on Relay at Facebook
  • Selective hydration
  • progressive hydration
  • @defer
  • @stream
  • @module
• Relay — A JavaScript framework for building data-driven React applications
• Relay Hooks — Experimental Concurrent Mode APIs
• Relay Hooks: A Step By Step Guide
• Concurrent Mode API Reference
  • Suspense
  • SuspenseList
  • useTransition
  • useDeferredValue
• Data fetching patterns
  • fetch-on-render
  • fetch-then-render
  • render-as-you-fetch
• Relay Runtime
• Relay Compiler
• Tagged template literals
• GraphQL Fragments
• Sophie Alpert — React team manager emeritus
• Yuzhi Zheng — Manager of React and Relay teams
• Hack — Programming Productivity Without Breaking Things

Sponsors

Linode

Instantly deploy and manage an SSD server in the Linode Cloud. Get a server running in seconds with your choice of Linux distro, resources, and node location. Get a $20 credit when you visit: linode.com/react and use promo code: react2019 at checkout

Clubhouse

Clubhouse is project management that brings everyone, on every team, together. They've made all core features completely free for teams with up to 10 users. React Podcast listeners get 2 months free on any paid plan. Get your project back on track at clubhouse.io/react.

Episode source