React Native 0.80: التحديث الفاصل نحو الاستقرار

تاريخ النشر: 29 سبتمبر 2025
FERAS
فراس وليد
مدون وكاتب مقالات تقنية

 في لحظة تحوّل كبيرة

في عالم تطوير التطبيقات الذي لا يهدأ، كل إصدار يحمل في طيّاته سؤالًا واحدًا: هل هو مجرد ترقية صيانة، أم بداية حقبة جديدة؟ مع React Native 0.80 يبدو أن الجواب يميل بلا شك إلى “حقبة جديدة”.

هذا الإصدار ليس فقط تحديثًا جانبيًا، بل هو إعادة هندسة داخلية لكيفية تعامل المطورين مع المنصة، بقرارات جريئة مثل تجميد المعمارية القديمة (Legacy Architecture)، وتثبيت التوافق مع React 19.1، وفرض قواعد أبسط وأكثر صرامة في الواجهة البرمجية (JavaScript API).

في هذا المقال سنتناول جميع الأبعاد: التقنيات التي تغيّرت، التأثير على المشاريع الحالية، التحديات المحتملة، وخريطة الطريق التي ينبغي للمطورين أن يخطّطوا لها.

1. ما الجديد حقاً في React Native 0.80؟ نظرة شاملة

قبل الدخول في التفاصيل، إليك نظرة عامة على أبرز ما حمله هذا الإصدار:

  • دعم مدمج لـ React 19.1.0 ضمن حزمة React Native. React Native

  • تحذيرات وإلغاء تدريجي لاستيراد Deep Imports من داخل مكتبة react-native الفرعية. React Native+1

  • تقديم Strict TypeScript API كمشروع تجريبي يمكن للمطورين تبنّيه تدريجيًا. React Native+1

  • تجميد المعمارية القديمة (Legacy Architecture)، مع تحذيرات حول استخدام APIs لن تعمل في المستقبل. React Native+1

  • تحسينات في الأداء: تقليص حجم حزمة Android بفضل IPO، وبناء مسبق لبعض مكتبات iOS لتسريع البناء. React Native+1

  • إعلان أن هذا الإصدار هو الأخير الذي يقدّم دعمًا مدمجًا لـ JSC (JavaScriptCore)، وسيتم نقله إلى مكتبة مُجتمعية لاحقًا. React Native

  • تغييرات كسر التوافق (Breaking Changes) في الحقول exports ورفع إصدار Kotlin وبعض الفئات في Android. React Native

هذه النقاط تشكّل المحاور التي سنستعرضها بالتفصيل في الفقرات التالية.

2. React 19.1 — خطوة متقدمة في تطور المنصة

إدراج React 19.1 داخل React Native يمنح عددًا من المزايا ولكن أيضًا يفرض بعض الحذر.

2.1 ما الذي يقدّمه React 19.1؟

من أبرز الميزات التي أُضيفت في React 19.1 هي Owner Stacks، التي تُسهل على المطورين تتبّع مصدر الخطأ في شجرة المكونات (Component Tree) بدقة أعلى. React Native

لكن هناك تحدٍ مهم: عند استخدام Babel plugin مثل @babel/plugin-transform-function-name (وهو مكوّن مفعل في إعدادات React Native الافتراضية)، قد لا تعمل ميزة Owner Stacks كما هو متوقع. React Native+1
الفريق يعمل على معالجة هذا التداخل في الإصدارات القادمة.

2.2 كيف يؤثر ذلك على مشروعك الحالي؟

إذا كنت تعمل على مشروع يستخدم React Native < 0.80، فترقية إلى 0.80 ستجلب لك هذا التوافق التلقائي مع React 19.1. لكن عليك الانتباه إلى:

  • التأكد أن الأكواد والملحقات (plugins) لا تستخدم ميزات تبدّل أسماء الدوال التي قد تكسر تتبع stack.

  • التحقق من الأدوات التي تعتمد عليها إن كانت متوافقة مع React 19.1.

  • اختبار مكثف للواجهات التي قد تتأثر بالتحولات البينية (إن وجدت تغييرات في React نفسها) — على الرغم من أن التغييرات في React 19.1 تُركّز غالبًا على أدوات التطوير وليس التنفيذ الفعلي runtime.

3. وداعًا للاستيراد العميق (Deep Imports) — ترتيب لواجهة برمجية أنظف

من أقوى التغيرات في 0.80 هو التحذير من استخدام Deep Imports (الاستيراد من المسارات الداخلية للمكتبة) وتوجيه المطورين لاستخدام الاستيراد من الجذر فقط.

3.1 ما هي Deep Imports ولماذا كان يستخدمها المطورون؟

Deep Imports هي استيرادات من ملفات داخلية في مكتبة react-native، مثل:

import { SomeInternalModule } from 'react-native/Libraries/SomeInternalModule';

أحيانًا كان المبرمجون يلجؤون إليها للحصول على وظائف أو أنواع غير مُصدَّرة رسميًا، أو لتحقيق اختراقات (hacks) للوصول إلى خصائص غير مدعومة رسميًا.

لكن هذا أسلوب خطير: أي تغيير داخلي قد يخلّ بوصلة الاستيراد العميق دون أن يدرك المطوّر.

3.2 التحذيرات والإلغاء التدريجي

في 0.80، إضافة ESLint rule (مثل @react-native/no-deep-imports) تعمل على إنذارك إذا استخدمت استيرادًا عميقًا في كود المشروع. React Native+1
بإمكانك إيقاف التحذيرات عبر تكوين Babel:

// babel.config.js
module.exports = {
presets: [
['module:@react-native/babel-preset', { disableDeepImportWarnings: true }]
],
};

لكن هذا ليس حلاً دائمًا؛ الهدف هو إزالة هذه الاستيرادات نهائيًا في إصدار 0.82 على الأقل كما أُشير في الوثائق. React Native+1

3.3 كيف تبدأ بالتحول؟

  • ابحث في مشروعك عن عبارات react-native/Libraries/... أو مشابهة، واستبدلها بالاستيراد من الجذر إن كانت متوفرة.

  • إذا لم يكن الكود المُراد استيراده متاحًا عند الجذر، شارك في النقاش المجتمعي (GitHub issue) لطلب أن يُصدَّر رسميًا.

  • اختبر بعد كل تعديل وتأكد أن الكود لا يزال يعمل كما هو.

4. Strict TypeScript API: طوق أمان لبيئة الكود

مع التحول نحو TypeScript في مشاريع React Native، تأتي ميزة Strict TypeScript API في 0.80 كجزء من جهود استقرار الواجهة البرمجية.

4.1 ما هو Strict TypeScript API؟

هو مجموعة جديدة من تعريفات TypeScript تُولَّد من الشيفرة المصدرية للمكتبة نفسها، بدلاً من الاعتماد على تعريفات يدوية قديمة. React Native+1
الميزة الأساسية هي أن هذه الأنواع ستكون أكثر دقة، وستقتصر على الواجهات المصدَّرة رسميًا من react-native، وليس على الأجزاء الداخلية أو غير المُصدَّرة.

على سبيل المثال، API مثل Linking أصبح يُصدَّر كواجهة موحّدة وليس تصديرات متعددة كما في الماضي. React Native

4.2 كيف تفعلها في مشروعك؟

في ملف tsconfig.json:

{
"extends": "@react-native/typescript-config",
"compilerOptions": {
// باقي الإعدادات
"customConditions": ["react-native-strict-api"]
}
}

عند التفعيل، سيبدأ TypeScript في استخدام التعريفات الجديدة بدلاً من القديمة. React Native

4.3 ملاحظات هامة

  • هذا التفعيل لا يؤثر على التنفيذ في وقت التشغيل (runtime)، بل فقط على التحقق بالنوع (type checking).

  • يُمكن التحول تدريجيًا: يُمكن تشغيل المشروع مع النوعين، والتبديل حسب الحاجة. React Native

  • بعض التعريفات قد تغيرت أو أُدمجت. عليك مراجعة الكود الذي قد يعتمد على الأنواع القديمة والتأكد من استمرارية التوافق.

5. تجميد المعمارية القديمة (Legacy Architecture) — نقطة فارقة

إعلان تجميد المعمارية القديمة يُعدّ من القفزات الاستراتيجية التي لن تُمحى بسهولة.

5.1 ما يعنيه “تجميد المعمارية” عمليًا؟

  • لن تُضاف ميزات جديدة أو إصلاحات عامة إلى المعمارية القديمة. فقط أعطال أمنية أو حالات قصوى قد تُعالج. React Native

  • لن تُختبر المعمارية القديمة ضمن سير عملية الإصدارات المستقبلية. React Native

  • DevTools ستبدأ بإظهار تحذيرات عند استخدام APIs التي ستُلغى في المعمارية الجديدة. React Native+1

5.2 لماذا اتُخذ هذا القرار؟

  • دعم معمارية قديمة على قدم المساواة مع الجديدة يُشكّل عبئًا كبيرًا على صيانة الكود.

  • التركيز على المعمارية الحديثة يُسهل إدخال تحسينات كبيرة على الأداء، التقارب بين المنصات، والابتكار في البنى الأساسية.

  • يشكّل ضغطًا إيجابيًا للمجتمع للتحديث المبكر، مما يُقلل من الأعباء المتراكمة لاحقًا.

5.3 ماذا على المطورين أن يفعلوا؟

  • قم بتمكين المعمارية الجديدة إن لم تفعل ذلك بالفعل، وتأكد من أن مشروعك يعمل بسلاسة عليها.

  • راجع المكتبات التي تعتمد على الواجهات أو السلوك القديم، وتحقق من أن لديها دعمًا أو فروعًا تتوافق مع المعمارية الجديدة.

  • تعامل بجدية مع التحذيرات في DevTools وابدأ استبدال استخدامات الـ APIs القديمة.

6. تحسينات الأداء والبناء: صقل التجربة البرمجية

ما الفائدة من التغييرات الكبيرة إذا لم يكن هناك تحسين ملحوظ على الأداء؟ في 0.80، تم العمل بجد في هذا الجانب.

6.1 Android — تقنية IPO لتقليل حجم الحزمة

تم تفعيل Interprocedural Optimization (IPO) في كل من React Native وHermes على منصة Android.
النتيجة؟ تقليص في حجم حزمة الـ APK بحوالي 1 ميغابايت تقريبًا — وهو رقم قد لا يبدو كبيرًا، لكنه مهم في بيئات ذات موارد محدودة. React Native

هذا التحسين يحدث تلقائيًا عند الترقية إلى 0.80، دون الحاجة لتعديلات في الكود. React Native

6.2 iOS — بناء مسبق (Prebuild) لمكتبات الطرف الثالث

لبناء أولي أسرع لتطبيقات iOS، تم تقديم فكرة بناء مسبق (prebuild) لبعض مكتبات الطرف الثالث بصيغة XCFramework، مثل Folly وGLog، بحيث لا تحتاج إلى تجميعها على جهاز المطور في كل مرة. React Native+1

في اختبارات على جهاز بمعالج Apple Silicon (M4)، لوحظ تحسّن بنسبة ~12٪ في زمن البناء الأولي مقارنة بالبناء الكامل من المصدر. React Native+1

لتفعيل هذه الميزة، تستخدم:

RCT_USE_RN_DEP=1 bundle exec pod install

أو تضيف السطر:

ENV['RCT_USE_RN_DEP'] = '1'

داخل ملف Podfile. React Native+1

6.3 New App Screen: تقليل الكود المبدئي

تم نقل شاشة المشروع الافتراضي (New App Screen) إلى حزمة مستقلة وتحسينها، مما يقلل من الكود المبتدئ (boilerplate) ويجعل البداية أنظف من ذي قبل، خصوصًا عند استخدام القوالب المجتمعية (Community CLI). React Native+1

7. أخيراً: نهاية الدعم المدمج لـ JSC

إصدار 0.80 هو آخر إصدار يقدم دعمًا مدمجًا لمحرك JavaScriptCore (JSC) كخيار افتراضي في React Native. React Native
بعد ذلك، سيُحوَّل الدعم إلى مكتبة مجتمعية منفصلة هي @react-native-community/javascriptcore. React Native

هذا التوجه يُثبت أن Hermes يزداد مركزية في مستقبل React Native، كما أن التخلي عن JSC المدمج يُسهل تبسيط البنية الأساسية للمشروع.

8. تغييرات كسر التوافق (Breaking Changes) — ما الذي قد يتعطّل؟

مع كل تحديث كبير، تأتي الأخطار والتحديات. إليك قائمة مفصّلة بما قد يُكسر في مشروعك:

8.1 الحقل exports في package.json

تمّت إضافة الحقل "exports" في الحزمة الرئيسية لـ react-native لتحديد المسارات المسموح بها للاستيراد. React Native+1

  • في Metro bundler، قد لا يتم توسيع الامتدادات الخاصة بالمنصات تلقائيًا. React Native+1

  • في Jest، استدعاءات mock لبعض المسارات العميقة قد تتأثر وتحتاج لضبط جديد. React Native

8.2 رفع إصدار Kotlin وتحويل فئات في Android

  • تم ترقية Kotlin إلى الإصدار 2.1.20. React Native

  • بعض الفئات التي كانت ظاهرة (public) أصبحت داخلية (internal)، مما يُلزم المكتبات الخارجية بعدم الاعتماد عليها: مثل StateWrapperImpl, ChoreographerCompat, ModuleDataCleaner. React Native

  • بعض فئات الإدخال النصي (مثل ReactEditText, ReactTextInputManager) تم ترحيلها إلى Kotlin، وقد تغيّر مفهوم nullable parameters أو أنواعها. React Native

8.3 تغييرات في iOS

  • تمت إزالة التعريف RCTFloorPixelValue من RCTUtils.h. React Native

  • الاعتماد على المكتبات المسبقة (prebuilt) قد يواجه مشاكل في بعض التكوينات الخاصة أو المخصصة.

8.4 تغييرات في الأنواع (TypeScript / Flow)

  • في Strict API، بعض الأسماء أو الأشكال (shapes) للأنواع تغيرت أو دمُجت، مثل Linking. React Native+1

  • أي كود يعتمد على استيراد عميق لأنواع قد يواجه أخطاء أثناء التحقق بالنوع.

  • تحديث eslint-plugin-react-hooks من الإصدار 4.6.0 إلى 5.2.0 قد يُنتج أخطاء lint جديدة تحتاج إصلاحًا. React Native

9. كيف تُحدّث مشروعك إلى 0.80 خطوة بخطوة

إليك دليل مقترح لترقية سلسة:

الخطوة الوصف
1 استخدم React Native Upgrade Helper للاطلاع على التغييرات بين الإصدار الحالي و0.80. React Native
2 عدّل الاستيرادات العميقة إلى استيراد من الجذر، أو قدّم طلبات دعم إن لم تكن موجودة.
3 اختبر تشغيل مشروعك مع toleration للتحذيرات حتى تستبدل الكود القديم.
4 فعّل Strict TypeScript API تدريجيًا واختبر أن كل شيء يعمل بشكل صحيح.
5 فعل المعمارية الجديدة إن لم تفعلها مسبقًا، وتأكد من تكامل المكتبات معها.
6 في iOS، اختبر تفعيل البناء المسبق (prebuilt) عبر RCT_USE_RN_DEP=1 وقم بتشغيل pod install.
7 اختبر التطبيق على بيئات وأجهزة مختلفة (Android، iOS، محاكيات حقيقية) بدقة شاملة.
8 راجع التحذيرات في DevTools والمعمارية القديمة وابدأ في استبدال الأكواد المهدّدة.
9 أعد بناء التطبيق النهائي وراقب الأداء، خصوصًا حجم الحزم وسرعة التشغيل.
10 راقب إصدار 0.82 وما بعده للتأكد أنك جاهز للتحولات المستقبلية (إزالة Deep Imports نهائيًا، دعم جديد).

10. سيناريوهات واقعية: ماذا سيواجه المطورون؟

سيناريو أ: مشروع قديم يعتمد على Deep Imports

لنفترض مشروعًا عمره سنوات، يعتمد على استيراد داخلي مثل:

import { SomeInternal } from 'react-native/Libraries/XYZ/SomeInternal';

بعد الترقية، ستظهر تحذيرات أو أخطاء في TypeScript أو ESLint. الحل: محاولة استبداله بـ:

import { SomeInternal } from 'react-native';

وإذا لم يكن مُصدَّرًا، إما أن تقدم طلبًا ليتم تصديره رسميًا، أو تكتب كود بديل في التطبيق.

سيناريو ب: مكتبة طرف ثالث غير محدثة

إذا اعتمدت على مكتبة (فتح المصدر) تستخدم Legacy APIs أو تستخدم deep imports في داخلها، فربما لن تعمل بسلاسة مع 0.80. الخيار هنا:

  • التحقق ما إذا كان هناك فرع (branch) مُحدّث يدعم 0.80 والمعمارية الجديدة.

  • المساهمة في تحديث المكتبة بنفسك إن كنت تملك الخبرة.

  • البحث عن بديل حديث يدعم البنية الجديدة.

سيناريو ج: مشروع React Native + Expo

قد لا تكون جميع ميزات 0.80 متاحة فورًا في Expo. قد تحتاج إلى استخدام إصدار Canary من Expo أو الانتظار حتى تدعم SDK الخاص بـ Expo هذا الإصدار بالكامل.

11. نظرة نحو المستقبل: ما الذي ينتظر React Native بعد 0.80؟

  • إزالة Deep Imports تمامًا (من المتوقع في 0.82) بعد فترة من التحذيرات والتدرج. React Native+1

  • جعل Strict TypeScript API هو الوضع الافتراضي، وإلغاء الأنواع القديمة تدريجيًا.

  • التخلص الكامل من دعم المعمارية القديمة، وتحويل تركيز المنصة لتحديثات المعمارية الجديدة فقط.

  • توسعة استخدام المكتبات المسبقة (prebuild) لتشمل أجزاء أكثر من مكتبة React Native الأساسية.

  • تشجيع المجتمع والمكتبات على مواكبة هذه التغييرات وتسريع التحديثات لدعم المشاريع الحديثة.

 0.80 ليس مجرد تحديث — إنها نقطة فاصلة

بما أننا نقف عند هذا الحدّ، لا يمكن إنكار أن React Native 0.80 هو أكثر من مجرد ترقية. إنه خطوة جريئة نحو كود أنظف، أداء أفضل، وواجهة برمجية أكثر استقرارًا.

لكن التحدي الحقيقي ليس في قراءة ما الجديد، بل في تنفيذ التغيير داخل مشاريع حقيقية، خاصة تلك التي تراكمت فيها الممارسات القديمة لسنوات.
للمطورين الطموحين، فإن الوقت المثالي للبدء هو الآن: راجع استيراداتك، فعّل المعمارية الجديدة، وجرب Strict Types تدريجيًا.

المصادر : 

React Native 0.80 – React 19.1, JS API Changes, Freezing Legacy Arch and much more

https://reactnative.dev/blog/2025/06/12/react-native-0.80

 

الاشارات

مقالات ذات صله

أعمال نتشرف بها

    خطوات سهلة لتبدأ طلبك الآن

    فقط قم بتعبئة البيانات التالية وسنكون على تواصل