Caching

التخزين المؤقت (Caching)

Intermediateperformance1 min read
cachebrowser cacheserver cacheredis cachenext cachecache invalidation

Definition

Storing copies of computed results or fetched data so future requests for the same data are faster.

تخزين نسخ من النتائج المحسوبة أو البيانات المجلوبة حتى تكون الطلبات المستقبلية لنفس البيانات أسرع.

Why It Matters

Glossary term pages in 404Fault can be cached at CDN level for hours since terms rarely change. Knowledge graph data can be cached per-term for minutes. Caching dramatically reduces Firestore read costs.

صفحات مصطلحات القاموس في 404Fault يمكن تخزينها مؤقتًا على مستوى CDN لساعات نظرًا لندرة تغيير المصطلحات. بيانات الرسم البياني للمعرفة يمكن تخزينها لكل مصطلح لدقائق. التخزين المؤقت يُقلّل بشكل كبير تكاليف قراءة Firestore.

Full Definition

Caching stores results of expensive operations so they can be returned instantly on repeat requests. Layers: browser cache (Cache-Control headers), CDN cache, Next.js fetch cache (30s default for server components), Redis for computed values. Cache invalidation — knowing when to clear a cache — is notoriously hard. Next.js App Router aggressively caches server component fetches; use `{ cache: 'no-store' }` to opt out for real-time data.
التخزين المؤقت يحتفظ بنتائج العمليات المكلفة حتى يمكن إعادتها فورًا عند الطلبات المتكررة. الطبقات: ذاكرة التخزين المؤقت للمتصفح (ترويسات Cache-Control)، ذاكرة CDN، ذاكرة Next.js fetch (30 ثانية افتراضية للمكونات الخادمية)، Redis للقيم المحسوبة.

Example Usage

// Opt out of Next.js cache for real-time data: const snap = await fetch('/api/live-data', { cache: 'no-store' }); // Revalidate every 60s: const snap = await fetch('/api/glossary', { next: { revalidate: 60 } });

// الخروج من ذاكرة Next.js المؤقتة للبيانات الفورية: const snap = await fetch('/api/live-data', { cache: 'no-store' }); // إعادة التحقق كل 60 ثانية: const snap = await fetch('/api/glossary', { next: { revalidate: 60 } });

Knowledge Graph

Avoid these mistakes when using Caching:

1

Over-caching authenticated user data — cache is shared and leaks private data to other users

2

Not setting cache headers on API routes — they default to no-cache which misses CDN opportunities

Sign in to unlock guided AI explanations from AI Teacher.

Generate a Prompt

Copy this prompt and use it directly with any AI model — no setup needed.

Ready-to-Use Prompt
Help me build a project using Caching.

Explain:
1. What is Caching and why it matters
2. The core architecture and required tools
3. Step-by-step implementation plan
4. Common mistakes to avoid: Over-caching authenticated user data — cache is shared and leaks private data to other users, Not setting cache headers on API routes — they default to no-cache which misses CDN opportunities
5. Best practices and production tips

Official Resources