📋 محتويات الصفحة
📖 الوصف
React DevTools هي إضافة متصفح رسمية من فريق React لتصحيح وفحص مكونات React. تتيح لك عرض شجرة المكونات، فحص الـ props و state، ومراقبة الأداء.
🎯 يستخدم في
مجالات استخدام هذه الأداة
فحص مكونات React
تعديل props و state مباشرة
مراقبة أداء الـ components
تتبع إعادة الرندر (re-renders)
فحص Profiler
✨ المميزات
أبرز مميزات هذه الأداة
عرض شجرة المكونات
تعديل props/state مباشرة
Profiler لتحليل الأداء
تتبع hooks
Component filters
دعم React Native
Dark mode
⚠️ العيوب
نقاط يجب مراعاتها
يعمل فقط مع React
قد يبطئ التطبيق
لا يظهر كل التفاصيل الداخلية
💻 مثال على الاستخدام
كيفية استخدام هذه الأداة
# تثبيت
# Chrome: الإضافات > React Developer Tools
# Firefox: الإضافات > React Developer Tools
📚 أدوات أخرى في DevTools
قد يعجبك أيضاً
Charles
⭐أداة intercept و debug لشبكة HTTP/HTTPS
Charles Proxy
⭐أداة Intercept و Debug لبروتوكول HTTP/HTTPS
Chrome DevTools
⭐أدوات مطوري الويب المتكاملة
Firefox DevTools
⭐أدوات مطوري الويب في Firefox
JSON Server
⭐مولد REST API وهمي (Mock REST API Generator)
Lighthouse
⭐أداة تحليل أداء وجودة المواقع