𝗖𝗮𝗰𝗵𝗶𝗻𝗴 𝗦𝗵𝗼𝗽𝗶𝗳𝘆 𝗚𝗥𝗔𝗣𝗛𝗤𝗟: 𝗔 𝗣𝗿𝗮𝗰𝘁𝗶𝗰𝗮𝗹 𝗚𝘂𝗶𝗱𝗲
GraphQL does not work like REST. You cannot cache by URL. In REST, one endpoint equals one cache entry. In GraphQL, one endpoint handles everything. Two requests to the same URL return different data.
To cache GraphQL correctly, your cache key must include:
- The query
- The variables
- The user context (locale or buyer segment)
Use layers to build a fast system:
- Client cache: For session reuse in the browser.
- Edge cache: For public storefront pages.
- App cache: For shared data on your server.
- Persisted queries: For stable, hash-based keys.
Match your cache time to how fast data changes.
Cache these items for a long time:
- Product details
- Collections
- Shop settings
Cache these items for a short time:
- Pricing
- Inventory availability
Never cache these items:
- Carts
- Checkout processes
- Customer-specific pricing
If you serve B2B stores, you must include the company ID in your cache key. If you fail, Customer A might see Customer B's contract price.
Use these three methods to manage freshness:
- TTL (Time-based): Set an expiration time. It is simple but you are often guessing.
- Webhooks (Event-based): This is the most accurate. When a product updates, Shopify sends a webhook. Use that webhook to delete your old cache entry.
- Stale-while-revalidate: Serve old data instantly while you refresh the cache in the background.
Build reliable webhook handlers. If a webhook fails, your cache stays stale. Use retries to prevent this.
Focus on these metrics to see if your strategy works:
- Hit ratio: Aim for a high number of hits.
- Latency: Your response time should drop.
- API calls avoided: Higher hits mean lower costs.
- Stale incidents: Your goal is zero wrong prices or stock reports.
Layer your caches. Match expiration times to data volatility. Use webhooks to clear old data. Build keys that respect personalization.
Source: https://dev.to/masadashraf/caching-shopify-graphql-a-practical-guide-for-developers-33k8