5 Antipatterns that Made Our React/GraphQL App Slow (And How We Fixed Them)
summary
Lists five concrete antipatterns with concrete fixes: over-fetching — remove unused fields to shrink payload by 31% size and cut latency by 22% time; fragment bloat from a centralized fragments.graphql that silently over-fetches; under-fetching that turns one request into 80 queries instead of using server-side filters/pagination; not using mutation return values and optimistic updates to avoid extra fetches; and wrong cache choice — React Query has no normalized cache, prefer Apollo or URQL.
AI-written summary · about
chapters (8)
- 0:00React/GraphQL performance issues
- 1:18Over-fetching in GraphQL
- 4:49Fragments causing over-fetching
- 7:55Under-fetching and requests
- 11:45Mutation return values
- 14:54Optimistic updates
- 17:20Caching library choice
- 20:52Summary and fixes
related talks
22m5 Antipatterns that Made Our React/GraphQL App Slow (And How We Fixed Them)
53mHelp! My React app is slowwwww!
27mReact State Management In a GraphQL Era
52mState management in a GraphQL era
25mOptimizing GraphQL Applications
26mBuild a performance-optimized GraphQL API
30mReact & GraphQL - Bringing Simplicity and Correctness to Client Side Development
34mCreate Flexible React Applications Using GraphQL APIs