تكرار السؤال: …
الإجابة المختصرة
في Client-Side Routing يتم تبديل المكونات وتحديث الـ URL داخل المتصفح عبر History API دون إعادة تحميل الصفحة كاملاً، بينما Server-Side Routing يرسل طلباً للخادم ليرد بصفحة HTML جديدة كلياً.
الشرح
تطبيقات الصفحة الواحدة (SPAs) تقوم بتحميل حزمة الـ JavaScript مرة واحدة، وعند تنقل المستخدم بين الروابط، يقوم الراوتر (مثل React Router) باعتراض الرابط وتحديث واجهة المستخدم والـ URL محلياً، مما يوفر تجربة مستخدم فورية وشبيهة بتطبيقات سطح المكتب دون وميض إعادة تحميل الشاشة.
مثال بالكود
// التنقل من جانب العميل بدون إعادة تحميل كاملة
import { Link } from 'react-router-dom';
function Navbar() {
return (
<nav>
{/* Link يعترض النقر ويستخدم history.pushState */}
<Link to="/dashboard">لوحة التحكم</Link>
</nav>
);
}أخطاء شائعة
- استخدام وسم <a href="/path"> العادي داخل تطبيق SPA مما يؤدي لإعادة تحميل الصفحة ومسح كامل حالة التطبيق في الذاكرة.