Headless 360Advancedreactssrserver-componentscaching
Fetch Salesforce data in React Server Components with cache strategy
Real World Scenario
Headless marketing site in Next.js App Router hammers Experience Cloud CMS and CRM APIs causing rate limit errors during traffic spikes.
Expected Answer
• Use React Server Components fetching Salesforce data server-side only—no tokens in client bundle
• Apply fetch cache directives aligned to content freshness: static CMS vs dynamic inventory
• Implement stale-while-revalidate pattern for semi-static product merchandising content
• Centralize Salesforce API client in server module with connection pooling and retry backoff
• Tag-based revalidation triggered by Salesforce webhooks on content publish events
• Separate read replicas or cached BFF responses for anonymous vs authenticated fetches
• Monitor API quota consumption per page template and optimize N+1 RSC fetch patterns
Follow-Up Questions & Answers
Click to expand — each follow-up includes a direct, interview-ready answer
Direct answer: Use React Server Components fetching Salesforce data server-side only—no tokens in client bundle Also consider: Apply fetch cache directives aligned to content freshness: static CMS vs dynamic inventory In practice: Implement stale-while-revalidate pattern for semi-static product merchandising content Optimize for scale and operational observability.
Architect Perspective
RSC plus Salesforce requires deliberate cache taxonomy—treating all CRM calls as static ISR invites stale data and rate limits alike.