Solving Real World Data Fetching Challenges: A Pragmatic Case Study
summary
A fintech case study reduces five parallel 1,000‑user API calls into a single Next.js BFF request and reduces payload from 2.3MB to 666 bytes (≈99.9%), avoiding 429s and cutting Wi‑Fi download from ~210ms to ~0.6ms and 3G from ~9.5s to ~7.6ms. The implementation uses Next.js BFF proxy + TanStack Query for caching, retries and prefetching, adds server‑side aggregation, 500ms server timeout with client fallback, and practical demos that prove the numbers.
AI-written summary · about
chapters (11)
- 0:00Introduction
- 3:28Performance in web dev
- 11:31Case study problem
- 13:20Naive data fetching
- 17:30Backend for frontend
- 19:56Optimizing payloads
- 22:19Data transfer costs
- 24:25TanStack Query caching
- 26:51Query resilience
- 27:54Prefetching recovery
- 28:36Summary
related talks
45mSolving Real-World Data Fetching Challenges with Next.js and TanStack Query: A Pragmatic Case Study
44mSolving Real-World Data Fetching Challenges with Next.js and TanStack Query: Case Study
26mData Fetching Unleashed: Next.js, React Query and their BFF
23mMicro-Frontends Performance and Centralised Data Caching
21mEnhance and improve user experience with BFF
11mFrontend Development With BFF (Backend for Frontend)
38mBFF vs GraphQL: A critical perspective
21mEnhance and improve user experience with BFF