GraphQL And React Native - The urql Edition
summary
Compares urql to Apollo for React Native and shows concrete patterns: use the dedupe → cache → fetch exchange chain, implement an auth exchange with pre-fetched token (avoid async-per-request storage to stop "fired with no listeners" leaks by initializing a token promise inside the exchange and pausing queries until resolved), and rely on graphcache auto-updates mutations to avoid refetchQueries. Demonstrates React Native devtools working, graphcache offline beta, and that this setup reduces Redux boilerplate and network chatter.
AI-written summary · about
chapters (30)
- 0:00Introduction
- 0:32About Kadi
- 1:00Agenda
- 1:22What this talk isnt about
- 1:52Why use GraphQL with React Native
- 4:40GraphQL clients
- 5:44My experience
- 6:34What is urql
- 8:36Querying data
- 10:18Exchanges
- 12:47Noop Exchange
- 13:23Auth Exchange
- 15:29Stateful Exchange
- 16:13OAuth Exchange
- 16:43Caching
- 18:35Cash Invalidation
- 19:14GraphQL Cache
- 19:41Cache Updates
- 20:20Refetch Queries
- 21:00Update Queries
- 21:43Update Cache
- 22:10How it works
- 22:51Dynamic key
- 24:59Offline support
- 25:52Devtools
- 26:08Add Devtools
- 26:38Launch Oracle Devtools
- 27:20Events
- 27:49GraphQL Playground
- 28:27Summary
related talks
19mBut Can Your GraphQL Client Do This? - A Deep-Dive Into urql
01h 12mWorkshop: Cross-Platform GraphQL & State Management with React Native
58mCrafting compelling real-time web experiences with GraphQL and React
31mGraphQL Without GraphQL: Backend Agnostic Requests with GraphQL Style Querying
29mWrite Queries, Not Code
24mBuilding Reactive GraphQL Apps With Apollo
30mGraphQL in the Era of React Server Components
18mGraphQL Will Do To REST What JSON Did To XML