React/faq internals

ما هو DOM الافتراضي (Virtual DOM)؟

DOM الافتراضي (أو اختصارًا VDOM) هو مفهوم برمجي نحتفظ فيه بالتمثيل المثالي أو الافتراضي لواجهة المستخدم ضمن الذاكرة مع مزامنته مع DOM الحقيقي عن طريق مكتبة مثل React DOM. تُدعى هذه العمليّة بالمطابقة (reconciliation).

تُمكِّن هذه الطريقة واجهة برمجة التطبيق التصريحية في React، حيث تُخبِر React الحالة التي تريد أن تكون بها واجهة المستخدم لديك، فتحرص React على مطابقة DOM مع تلك الحالة. يُجرِّد هذا التعامل مع الخاصيّات، ومعالجة الأحداث، وتحديث DOM اليدوي الذي يجب عليك استخدامه لبناء تطبيقك.

لمّا كانت كلمة DOM الافتراضي عبارة عن نمط أكثر من كونها تقنيّة محدّدة، فأحيانًا يقول بعض الناس هذه الكلمة ليقصدوا بها أشياء مختلفة. يرتبط المصطلح DOM الافتراضي في عالم React بعناصر React بما أنّها عبارة عن كائنات تُمثِّل واجهة المستخدم. على أيّة حالة تستخدم React أيضًا كائنات الداخليّة تُدعى بالألياف (fibers) للاحتفاظ بمعلومات إضافيّة حول شجرة المكونات. قد تُعتبر هذه الألياف جزءًا من تنفيذ DOM الافتراضي في React.

هل DOM الخيالي (Shadow DOM) هو نفسه DOM الافتراضي (Virtual DOM)؟

لا، إنّهما مختلفان. حيث إنّ DOM الخيالي هو تقنية في المتصفّح مُصمَّمة بشكل أساسي لتحديد نطاق المتغيّرات وCSS في مكوّنات الويب. أمّا DOM الافتراضي هو مفهوم مُنفَّذ عن طريق مكتبات في JavaScript بناءً على واجهات برمجة تطبيق المتصفّح.

ما هو React Fiber؟

Fiber هو مُحرِّك المطابقة الجديد في React 16. هدفه الأساسي هو تمكين التصيير التراكمي في DOM الافتراضي. اقرأ المزيد من هنا.

انظر أيضًا

• المصطلحات
• استخدام AJAX مع React
• أسئلة حول Babel، و JSX، وخطوات بناء التطبيقات
• تمرير الدوال إلى المكونات
• حالة المكونات
• التنسيق واستخدام CSS مع React
• سياسة الإصدارات المتبعة في React
• بنية ملفات المشروع

مصادر

• صفحة DOM الافتراضي والكائنات الداخلية في توثيق React الرسمي.