Performance tuning in EC site with GraphQL
summary
E‑commerce site using GraphQL + React + SSR shows 20s first‑load per Speed Insights and a Lighthouse score in the single digits; team uses DataDog APM to find slow resolvers, then: trim bundles and add lazy‑loading, set proper HTML cache headers and separate user‑specific fragments, fix GraphQL N+1 by batching/resolving server side and use fragment co‑location to stop over‑fetching. Result: page load and score improve to roughly the high 40s; work continues.
AI-written summary · about
chapters (10)
- 0:00Introduction
- 6:32GraphQL in EC site
- 9:46Frontend tuning
- 14:314-step performance
- 16:30Bundle size optimization
- 18:22Backend improvement points
- 23:53Solving N+1 queries
- 27:30Using fragments
- 30:41Future outlook and cache strategy
- 35:11Summary
related talks
22m5 Antipatterns that Made Our React/GraphQL App Slow (And How We Fixed Them)
26mBuild a performance-optimized GraphQL API
44mTop 10 Tips to Speed Up Your Adobe Experience Manager Site
39mGraphQL Accelerated
34mOptimizing Performance in Large-Scale React & Node.js Applications
22m5 Antipatterns that Made Our React/GraphQL App Slow (And How We Fixed Them)
22mOptimally using third-party services with Next.js
31mReact Server Components Elevating Speed, Interactivity, and User Experience