شرح صفوف ومحتوى الفقرة
في التفاعلات السريعة كتبديل حالة إنجاز مهمة أو حفظ عنصر في المفضلة، قد يبدو انتظار استجابة الشبكة بطيئاً. يعتمد نمط التحديث المتفائل (Optimistic UI) على تحديث الحالة المحلية في الواجهة فوراً، مع الاحتفاظ المسبق بنسخة المرجع الأصلي const previousTasks = tasks.
فإذا فشل الطلب في الخلفية أو رد الخادم بخطأ، نستعيد النسخة السابقة فوراً عبر setTasks(previousTasks) ونعرض تنبيهاً صادقاً يوضح تعذر الحفظ الفعلي.
HTML
const snapshot = tasks;
setTasks((prev) =>
prev.map((t) =>
t.id === id ? { ...t, done: !t.done } : t
)
);
const res = await fetch(url, { method: 'PUT', body });
if (!res.ok) {
setTasks(snapshot);
setRollbackNotice('Save failed — reverted!');
}