لماذا يهم هذا الدرس؟

فهم أساسيات Cache واستخدامه بصورة صحيحة داخل مشروع App Router. يحدد Server Data Fetching والCaching متى تُقرأ البيانات وتُعاد الاستفادة منها وتُحدث. Freshness متطلب Product وليس Default نخمنه.

كيف تفكر فيه؟

  • في درس أساسيات Cache، النتيجة التي يجب أن تتحقق: حدد سياسة التحديث المناسبة للبيانات بدل افتراض أن كل مصدر يحتاج السلوك نفسه.
  • في سياق أساسيات Cache، الخطر الذي يجب أن يبقى تحت السيطرة: Caching لبيانات متغيرة أوخاصة بالمستخدم دون فهم Scope قد يعيد بيانات قديمة أوغير مناسبة، وتعطيل كل Cache يهدر السعة.
  • تطبيق أساسيات Cache: اجلب Resource على الخادم ووثق Freshness Requirement ثم اختر Revalidation مناسبة واختبرها.

تطبيق عملي

في التطبيق الخاص بدرس أساسيات Cache: حدد سياسة التحديث المناسبة للبيانات بدل افتراض أن كل مصدر يحتاج السلوك نفسه.

app/posts/page.tsxtsx
export default async function PostsPage() {
  const response = await fetch('https://example.com/api/posts');
  if (!response.ok) throw new Error('Failed to load posts');
  const posts = await response.json();
  return <PostList posts={posts} />;
}

جرّب بنفسك

Practice

تمرين أساسيات Cache

اجلب Resource على الخادم ووثق Freshness Requirement ثم اختر Revalidation مناسبة واختبرها.

  • سجل النتيجة المتوقعة قبل التنفيذ
  • اختبر حالة صحيحة وحالة فشل مرتبطة بالدرس
  • اشرح في سطرين أين يوجد الحد المسؤول عن القرار

الخلاصة