المقدمة :

في عالم التطبيقات اليوم، لم تعد مهمة مطور التطبيقات أن يبني تطبيق يعمل فقط بل صار التحدي الحقيقي: هو كيف نضمن أنه أن يعمل بكفاءة ؟
وراء كل تطبيق سلس وسريع، مطور يسأل نفسه: لماذا يبدو التطبيق ثقيلاً؟ وهنا تبدأ رحلة الغوص خلف الكواليس.

في جلسة ملهمة استضافتها مؤسسة سند الشباب التنموية، اصطحبنا المهندس نزار أبو هايلة بتاريخ 12 أيلول 2025 في جولة داخل أدوات (Flutter DevTools) “الحقيبة السحرية لكل مطوّر Flutter طموح”
أوضح لنا كيف تتحول تجربة التطوير من مجرد كتابة كود إلى رحلة استكشاف: تراقب الأداء، تكتشف استهلاك الذاكرة، تتابع تغيّر الحالة لحظة بلحظة، وتواجه المشاكل قبل أن تصل للمستخدم.

ما قدّمه المهندس نزار لم يكن مجرد شرح لأداة، بل دعوة لتغيير نظرتنا كمطورين: أن نكون أكثر وعياً بما يجري “تحت الغطاء”، وأن نطوّر بثقة، نحلّل بذكاء، ونبدع بتجربة مستخدم لا تُنسى.

تناولت الجلسة كيفية استخدام أدوات Flutter DevTools لتحليل الأداء، تتبع الأخطاء، وإدارة الذاكرة، وذلك بأسلوب عملي يساعد المطورين على تحسين جودة تطبيقات الموبايل بكفاءة.

الفهرس :

1- نظرة عامة ومقدمة عن Flutter DevTools

2- أوضاع البناء (Build Modes) في Flutter

3- مفتش الواجهات (Widget Inspector)

4- أداء التطبيق وتحليل وحدة المعالجة المركزية (Performance & CPU Profiler)

5- عرض وإدارة الذاكرة (Memory View & Memory Management)

6- أدوات التصحيح (Debugger) وعرض الشبكة (Network View)

7- التسجيل (Logging) وأداة تحليل حجم التطبيق (App Size Tool)

8- إضافة DevTools (DevTools Extension)

محاور الجلسة :

أولاً : نظرة عامة ومقدمة عن DevTools

• Flutter DevTools هي مجموعة أدوات قوية توفرها Google لمطوري Flutter، تتيح لك مراقبة وتحليل أداء تطبيقك، تتبع الأخطاء، فحص الواجهات (Widgets)، وإدارة الذاكرة بشكل فعّال.
  تُستخدم هذه الأدوات خلال وقت التشغيل لتمنحك رؤية أعمق حول سلوك التطبيق، مما يساعدك على تحسين تجربة المستخدم وضمان كفاءة الأداء عبر مختلف مراحل التطوير.

• في بيئة تطوير Flutter ، الأداء وتجربة المستخدم هما كل شيء ، وهنا يأتي دور Flutter DevTools كأداة لا غنى عنها لأي مطوّر جاد، استعرض المهندس أهمية أدوات “Flutter DevTools ” في 4 نقاط رئيسية :

1- قدرات تصحيح متقدمة (Enhanced Debugging Capabilities)
Flutter DevTools توفّر أدوات قوية لتتبع الأخطاء والتصرفات غير المتوقعة في التطبيق، مثل:

• تتبع الـ Widget Tree لحظة بلحظة.
• تحديد أي Widget يعيد بناء نفسه باستمرار (Rebuilds).
• تتبع التفاعل مع الحالة (state changes) بشكل مرئي وسلس.

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

2- تحسين أداء التطبيق (Optimized App Performance)
Flutter DevTools توفّر أدوات تحليل الأداء (Performance Profiler) تعرّفنا على :

• زمن تنفيذ كل Frame
• ما إذا كان التطبيق يعاني من تقطيع (jank )
• الـ CPU و GPU المستخدمة خلال الزمن

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

3- إدارة فعّالة للذاكرة (Efficient Memory Management)
مع Flutter DevTools نستطيع مراقبة استخدام الذاكرة ومعرفة :

• التسريبات المحتملة في الذاكرة (Memory Leaks)
• حجم الكائنات (Objects)
• أحداث تحرير الذاكرة ( Garbage Collection Events)

4- مراقبة وتحليل الشبكة (Network Monitoring and Insights)

Flutter DevTools يسمح لنا بمراقبة جميع طلبات HTTP الصادرة من التطبيق حيث يمكننا أن :

• نقارن بين الطلبات ونفهم الأداء من جهة الخادم (backend).
• معرفة زمن كل طلب واستجابته
• نستعرض الـ Headers والـ Payload

ثانياً: أوضاع البناء (Build Modes) في Flutter

تكلم المهندس عن ثلاثة أوضاع رئيسية لبناء وتشغيل التطبيقات ضمن flutter :

Debug، Profile، وRelease => كل وضع مصمّم لهدف مختلف خلال دورة تطوير التطبيق.

“Debug Mode” :

يُستخدم هذا الوضع أثناء مرحلة التطوير، ويوفّر لك أدوات قوية لتتبع الأخطاء، مثل:

• Hot Reload لتحديث واجهة المستخدم لحظياً.
• رسائل debug في الـ console.
• أدوات تتبع الأداء و stack traces.

“Profile Mode” :

يُستخدم هذا الوضع لـ تحليل الأداء مع الحفاظ على أقل قدر ممكن من التأثير على سرعة التطبيق.

“Release Mode” :

هذا الوضع المُستخدم عند نشر التطبيق للمستخدمين النهائيين، سواء على متجر Google Play أو App Store.
في هذا الوضع:

• يتم تعطيل جميع أدوات التطوير والتصحيح.
• يتم تحسين أداء التطبيق بالكامل عبر تقنيات مثل tree shaking وcode shrinking.
• لا يتم تضمين أي رسائل Debug أو أدوات مراقبة.
• حجم التطبيق يكون أصغر، وأداؤه أعلى.

مقارنة تفصيلية للأوضاع الثلاثة :

الميزة	(Debug Mode)	(Profile Mode)	(Release Mode)
Performance	بطيء (بسبب عمليات التحقق)	محسن لتحليل الأداء	مُحسن بدرجة عالية
Hot Reload	متوفر	غير متوفر	غير متوفر
دعم DevTools	دعم كامل	دعم محدود	لا يوجد دعم لـ DevTools
Code Optimization	بدون تحسين	تحسين جزئي	تحسين كامل
Debugging	وصول كامل للسجلات ونقاط التوقف	وصول محدود للسجلات	لا يوجد إمكانية للتصحيح

ثالثاً : مفتش الواجهات (Widget Inspector)

Widget Inspector هو أداة قوية جداً ضمن Flutter DevTools تتيح لك :

1. عرض مباشر لشجرة الـ Widgets :
   تُمكّنك الأداة من رؤية شجرة الواجهة كاملة (Widget Tree) في الزمن الحقيقي، بحيث يمكنك تتبع تسلسل وتركيب العناصر في واجهتك بدقة ،واستكشاف بنية واجهة المستخدم (UI) أثناء تشغيل التطبيق، لحظة بلحظة .
2. فهم بنية وتصميم الواجهة :
   من خلال تتبع العلاقات بين العناصر، يمكنك معرفة كيف تُبنى الشاشة، وما العناصر التي تحت أي عنصر، مما يسهل التعديل أو التحسين.
3. تصحيح وتحسين الواجهة بسهولة حيث تعتبر الأداة أساسية عند مواجهة مشاكل في التصميم

رابعاً : ما هو Performance و CPU Profiler في Flutter DevTools؟

أداتا Performance و CPU Profiler هما من أهم الأدوات المتاحة لمطوري Flutter لفهم وتحليل أداء التطبيق بشكل دقيق وتحسينه.

أولاً: Performance View – عرض الأداء

يساعدك تبويب Performance على تتبع كيف يقوم تطبيقك برسم الإطارات (Frames) أثناء التشغيل، ويُظهر مدى استجابته وسلاسته في التفاعل مع المستخدم.

ماذا يمكنك أن تراقب؟

• عدد الإطارات في الثانية (FPS).
• مدة كل إطار: هل تتجاوز الحد المقبول (16ms)؟
• وجود أي تقطيع (Jank) أو بطء في الـ UI.
• المدة التي تستغرقها العمليات في الـ UI thread وGPU thread.

فائدته: يساعدك على معرفة ما إذا كانت واجهة المستخدم ثقيلة أو فيها مشاكل رسومية تحتاج تحسين.

ثانياً: CPU Profiler – محلل أداء المعالج

أداة CPU Profiler تركّز على قياس استهلاك المعالج وتحليل العمليات التي تستهلك وقتاً كبيراً من التنفيذ.

ماذا يمكنك أن تكتشف؟

• تتبع أداء الوظائف (functions) في الوقت الحقيقي.
• معرفة ما هي الدوال أو العمليات التي تسبب بطء في الأداء.
• تحليل التفاصيل باستخدام Flame Chart أو Call Tree.

فائدته: ممتاز في كشف عنق الزجاجة (Bottlenecks) داخل الكود، سواء في عمليات ثقيلة أو استدعاءات غير ضرورية.

خامساً:عرض وإدارة الذاكرة (Memory View & Memory Management)

تحدث لنا المهندس نزار عن أهمية مراقبة استخدام التطبيق للذاكرة حتى لا نعاني من مشاكل مثل التقطيع أو تسرب الذاكرة

Memory View في Flutter DevTools هو تبويب يُستخدم لتحليل حالة الذاكرة أثناء تشغيل التطبيق. يسمح لنا بـ:

• مشاهدة كمية الذاكرة المستخدمة لحظياً.
• مراقبة إنشاء وتدمير الكائنات (Objects).
• تتبع أحداث تحرير الذاكرة (Garbage Collection Events).
• اكتشاف تسريبات الذاكرة (Memory Leaks).
• أخذ Heap Snapshots لمقارنة الحالة في لحظات مختلفة.

وقال عن هذه الأداة أنها مهمة عندما نريد تحسين الأداء أو التأكد أن تطبيقنا لا يستهلك ذاكرة أكثر من اللازم.

أخبرنا عن نموذج Object-Oriented Memory Model الذي تستخدمه دارت و هذا النموذج يعني أن كل شيء في التطبيق يتم التعامل معه على أنه كائن (Object) الأرقام، النصوص، القوائم، وحتى الدوال

وبالنسبة لأنواع الذاكرة في dart :

1- Stack (المكدس)

• يُستخدم لتخزين المتغيرات واستدعاءات الدوال.
• يتمتّع بإدارة تلقائية ،عندما تنتهي الدالة، يتم تحرير الذاكرة تلقائياً.
• سريع وخفيف جداً لأنه يعتمد على تسلسل زمني واضح (LIFO).

2- Heap (الكومة)

• يُستخدم لتخزين الكائنات الديناميكية مثل Widgets، Lists، Maps .
• يتم إدارتها باستخدام نظام (Garbage Collector) لأن عمر هذه الكائنات قد يكون طويل أو غير معروف مسبقاً.

Garbage Collector (GC) – مدير الذاكرة الذكي في Dart:

Dart يستخدم نموذج الجيلين (Generational GC Model) لتحسين كفاءة إدارة الذاكرة.
ويتم تقسيم الكائنات في الذاكرة إلى قسمين:

الجيل الجديد (Young Generation)

• يحتوي على الكائنات التي تم إنشاؤها حديثاً.
• يتم فحصه باستمرار لأن أغلب الكائنات تُستخدم لفترة قصيرة ثم تُهمل.
• عندما يُكتشف أن كائن لم يعد له مرجع، يتم حذفه فوراً لتحرير الذاكرة.

الجيل القديم (Old Generation)

• يحتوي على الكائنات طويلة العمر التي نجت من عدة عمليات GC.
• يتم فحصه بمعدل أقل لتقليل استهلاك الأداء.
• مفيد لتجنب التكرار في فحص كائنات يتم استخدامها بشكل مستمر (مثل theme أو navigator).

الخلاصة:

المفهوم	التوضيح
Memory View	أداة لرؤية ومراقبة استخدام الذاكرة في التطبيق أثناء التشغيل.
Stack	ذاكرة مؤقتة للمتغيرات المحلية يتم إدارتها تلقائياً وسريعة جداً.
Heap	ذاكرة للكائنات الديناميكية تتطلب GC لحذف ما لم يُستخدم.
Garbage Collector	نظام ذكي يحرر الذاكرة من الكائنات غير المستخدمة تلقائياً.
Young Generation	للكائنات الجديدة، يتم فحصها باستمرار وحذف غير الضروري منها بسرعة.
Old Generation	للكائنات طويلة العمر، يتم فحصها أقل لتقليل الضغط على النظام.

أنواع الكائنات في الذاكرة :

1- disposable object
هو أي كائن في Dart يعرّف دالة dispose()، وتُستخدم هذه الدالة لتحرير الموارد المرتبطة بالكائن يدوياً قبل التخلص منه.
غالبًا ما نستخدم هذا النوع من الكائنات مع عناصر مثل TextEditingController أو AnimationController، ويجب استدعاء dispose() في الوقت المناسب لتجنّب بقاء الكائن في الذاكرة بعد انتهاء الحاجة إليه.

2- memory-risky object
هو كائن قد يُشكّل خطراً على إدارة الذاكرة إذا لم يتم التخلص منه بشكل صحيح.
في بعض الحالات، حتى بعد استدعاء dispose () ، قد يبقى الكائن في الذاكرة إذا كان لا يزال هناك مرجع له، مما يمنع garbage collector من إزالته.

هذا النوع من الكائنات قد يؤدي إلى memory leak، خصوصاً إذا كان ضخماً و يستخدم موارد كثيرة وظل مرتبطاً بكائنات أخرى غير مُفرَّغة.

مفاهيم أساسية في إدارة الذاكرة في Dart

root object
كل تطبيق Dart يقوم بإنشاء كائن أساسي يُعرف باسم root object. هذا الكائن يمثّل نقطة البداية التي ترتبط بها (مباشرة أو غير مباشرة) جميع الكائنات الأخرى التي يُنشئها التطبيق.
ما لم يكن هناك رابط للكائن من هذا الجذر، لن يكون للكائن معنى بالنسبة إلى النظام، مما يسهل التخلص منه لاحقاً.

reachability
عند لحظة معينة أثناء تشغيل التطبيق، إذا توقف root object عن الإشارة إلى كائن معين تم تخصيصه في الذاكرة، يصبح ذلك الكائن “غير قابل للوصول”.
عندما لا يعود هناك أي مرجع إليه، يُرسل هذا الكائن إشارة إلى garbage collector بأنه يمكن تحرير ذاكرته.

retaining path
هو المسار الكامل من root object حتى الوصول إلى كائن معين، عبر سلاسل من المراجع.
هذا المسار يُعرف بـ retaining path، لأنه ما يُبقي الكائن في الذاكرة.
طالما هناك مسار واحد على الأقل يصل إلى الكائن، يُعتبر الكائن “قابلاً للوصول”، ولن يتم حذفه من الذاكرة.
كائن واحد يمكن أن يكون له أكثر من retaining path، وهذا ما يفسّر أحياناً لماذا لا يتم جمع بعض الكائنات تلقائياً.

ما هو الـ Memory Leak؟

كما أخبرنا المهندس نزار، فإن (Memory Leak) يُعدّ من أكثر المشكلات شيوعاً التي قد نواجهها أثناء تطوير التطبيقات، لا سيما في المشاريع الكبيرة أو التي تتطلب إدارة معقّدة للواجهة والتفاعل مع البيانات.

في بيئة Flutter، نعتمد على ما يُعرف بـ (Garbage Collector)، وهو المسؤول عن تحرير الذاكرة من الكائنات التي لم نعد بحاجة إليها ، ولكن، في بعض الحالات ،يقوم المطورين بأخطاء تؤدي إلى بقاء هذه الكائنات في الذاكرة رغم أننا لم نعد نستخدمها ، مما يتسبب في تسرّب الذاكرة.

على سبيل المثال: عندما نستخدم كائناً مثل AnimationController أو StreamSubscription وننسى أن نستدعي دالة dispose() عند مغادرة الصفحة ، فإن تلك الكائنات تظل نشطة داخل الذاكرة، لأنها لا تزال مرتبطة بالحالة القديمة ،رغم أن المستخدم لم يعد يتفاعل معها.

هذا يؤدي إلى استهلاك زائد للذاكرة، وتراجع في أداء التطبيق، وفي بعض الحالات قد يتسبب في إغلاق التطبيق بشكل مفاجئ أو استنزاف بطارية الجهاز.

ولهذا، من الضروري أن يكون المطور على دراية تامة بكيفية إدارة دورة حياة الكائنات، وأن يحرص دائماً على تنظيف الموارد التي لم يعد يستخدمها. بسبب هالتسريب، التطبيق بيبدأ يستهلك ذاكرة أكبر وأكبر بشكل غير مبرر، وهذا ممكن يؤدي إلى:

كيف يحدث Memory Leak في Flutter؟

بسبب:

• نسيان إزالة الـ listeners أو الـ subscriptions
• الاحتفاظ بمراجع لكائنات ما عدت بحاجة إلها (مثل TextEditingController ، أو Streams، أو أي كائن يتطلب تنظيف)
• سوء إدارة حالة الـ widgets أو استخدام الذاكرة بطرق غير صحيحة مثل الاحتفاظ بكائنات في قوائم أو متغيرات ثابتة بدون تحكم

الخلاصة:

دائماً يجب أن نحرص على تنظيف الموارد التي نستخدمها (عن طريق dispose() مثلاً في Widgets التي تستخدم StatefulWidget ونتأكد ان كل كائن غيرضروري يجب تحريره. هذا سيضمن أداء سلس وثابت للتطبيق بعيداً عن مشاكل استهلاك الذاكرة الزائد.

سؤال !

“طالما أن (GC) يتولى إدارة الذاكرة، فهذا يعني أننا لم نعد بحاجة للقلق بشأن الذاكرة بعد الآن، أليس كذلك؟ “

لا

• الدائرة الخضراء تمثل الكائنات الموجودة في الـ heap (الذاكرة الديناميكية) التي لا زالت مراجعها موجودة في الـ stack (الذاكرة المؤقتة). يعني هذه الكائنات ما زالت مستخدمة ويمكن الوصول إليها.
• الدائرة الحمراء تمثل الكائنات الموجودة في الـ heap والتي لا يتم استخدامها حالياً. من المفترض أن يقوم الـ Garbage Collector (GC) بإزالة هذه الكائنات غير المستخدمة لتفريغ الذاكرة، لكن هذا لا يحدث دائماً.
• الـ GC (Garbage Collector) يزيل فقط الكائنات التي لم تعد مراجعها موجودة في الـ stack. هذا الجزء يمثّل الجزء غير المتقاطع من الدائرة الحمراء.
• في بعض الحالات، قد تبقى بعض الكائنات غير المستخدمة في الـ heap لكنها ما زالت لديها مراجع موجودة في الـ stack (أي أنه لا يتم إزالة هذه المراجع حتى لو لم تعد هناك حاجة فعلية لها). هذه الحالة هي ما يسمى بـ Memory Leak.
• الـ Memory Leak يعني فشل التطبيق أو نظام إدارة الذاكرة في إزالة الكائنات التي تحتل الذاكرة رغم أنها لا تُستخدم فعلياً، مما يؤدي إلى استهلاك زائد للذاكرة.

ما هو الفرق بين Memory Leak و Memory Bloat

Memory Bloat ، فهو يعني استخدام كمية كبيرة من الذاكرة أكثر مما هو مطلوب لتحقيق الأداء الأمثل. مثال على ذلك: تحميل صور بحجم ضخم وغير مهيأ (غير مضغوطة أو غير مناسبة للدقة المطلوبة)، أو الاحتفاظ بتدفقات بيانات (Streams) مفتوحة طوال عمر التطبيق دون داعٍ.

في تسرب الذاكرة (Memory Leak)، يقوم التطبيق باستهلاك الذاكرة بشكل تدريجي بسبب عدم تحرير الموارد بعد الانتهاء من استخدامها. على سبيل المثال: عند إنشاء مستمع (Listener) بشكل متكرر دون التخلص منه (dispose) بعد الانتهاء منه، يظل هذا المستمع في الذاكرة دون حاجة، مما يؤدي إلى تراكم غير ضروري يستهلك الذاكرة على المدى الطويل.

رغم أن كلا الحالتين — سواء leak أو bloat — يمكن أن تؤدي في النهاية إلى انهيار التطبيق بسبب استنزاف الذاكرة (Out-of-Memory error)، إلا أن تسرب الذاكرة يُعتبر أكثر خطورة، لأن تسرب صغير، إذا تكرر عدة مرات خلال دورة حياة التطبيق، قد يؤدي إلى انهيار حتمي، بينما انتفاخ الذاكرة غالباً ما يكون تأثيره تدريجياً ويمكن التنبّه له مبكراً.

الرسالة هنا: GC وحده لا يكفي، وعلى المطور المحترف أن يدير الموارد بحكمة ويتتبع سلوك الذاكرة باستمرار.

متى نستخدم Memory View؟

تُستخدم أداة Memory View عندما تلاحظ مؤشرات تدل على وجود مشكلات في إدارة الذاكرة داخل تطبيقك. ومن أبرز الحالات التي تستدعي فتح هذه الأداة ما يلي:

1. عند تعطل التطبيق بسبب نفاد الذاكرة (Out of Memory): إذا بدأ التطبيق في الانهيار بشكل مفاجئ دون وجود أخطاء واضحة في الكود، فمن المحتمل أن المشكلة مرتبطة بالاستهلاك الزائد للذاكرة.
2. عند ملاحظة بطء في الأداء أو تجمّد في واجهة المستخدم: إذا بدأ التطبيق في التباطؤ أو أصبح غير مستجيب، فغالباً ما تكون هناك كائنات غير ضرورية عالقة في الذاكرة، تؤثر على أداء المعالج والذاكرة.
3. عند إغلاق التطبيق تلقائياً بسبب تجاوزه حد الذاكرة المسموح به من النظام: بعض أنظمة التشغيل، خاصة على الأجهزة المحمولة، تفرض حدودًا صارمة على استخدام الذاكرة. تجاوز هذه الحدود يؤدي إلى إغلاق التطبيق بالقوة.
4. عند الاشتباه بوجود تسرب في الذاكرة (Memory Leak): إذا كنت تلاحظ زيادة تدريجية في استهلاك الذاكرة مع مرور الوقت دون مبرر، أو شعرت أن بعض الكائنات لا يتم تحريرها بعد الانتهاء من استخدامها، فهنا يكون Memory View أداة حاسمة للكشف عن هذه التسريبات.

سادساً : أدوات التصحيح (Debugger) وعرض الشبكة (Network View)

ما هو Debugger ؟

كما أخبرنا المهندس عن أداة الـ Debugger والتي هي هي واحدة من الأدوات الأساسية في تطوير التطبيقات، حيث تتيح لك إيقاف تنفيذ التطبيق مؤقتاً في أي نقطة زمنية أثناء التشغيل. هذا التوقف يمكننا من فحص قيم المتغيرات الحالية، ومتابعة سير تنفيذ الكود خطوة بخطوة، مما يساعد في فهم سلوك التطبيق بشكل دقيق أثناء وقت التشغيل.

باستخدام الـ Debugger، يمكنك تحليل تدفق التنفيذ، تحديد موقع الأخطاء البرمجية، ومراقبة كيفية تأثير التغييرات في الكود على أداء التطبيق ، هذه العملية تُعتبر جوهرية في تصحيح الأخطاء وتحسين جودة التطبيق قبل النشر، فهي تمنحك رؤية واضحة لما يحدث داخل التطبيق في الوقت الحقيقي، مما يجعل عملية تطوير التطبيقات أكثر كفاءة واحترافية.

لماذا نستخدم خاصية Network View ؟

تُعد خاصية Network View أداة مهمة جداً عند تطوير التطبيقات، وسبب استخدامها يتمحور حول عدة نقاط رئيسية:

1. تتبع طلبات HTTP: تقوم هذه الأداة بتسجيل كل طلبات الشبكة التي يرسلها التطبيق، مع عرض التفاصيل المهمة مثل عنوان الـ URL، نوع الطلب (GET أو POST) ، وكذلك رموز الحالة التي تُشير إلى نجاح أو فشل الطلب.
2. قياس زمن الاستجابة والكمون: تقيس الأداة الوقت الذي يستغرقه الطلب للوصول إلى الخادم، وكذلك الوقت اللازم لاستلام الرد، مما يساعدنا على تحديد المكالمات الشبكية البطيئة التي قد تؤثر سلباً على تجربة المستخدم.
3. المراقبة في الوقت الحقيقي: تتيح هذه الخاصية مشاهدة نشاط الشبكة مباشرة أثناء تشغيل التطبيق، مما يسهل عملية تشخيص المشكلات مثل فشل استدعاءات الـ API أو استجابات غير متوقعة.

وهكذا نجد أن، استخدام Network View يمكّننا من فهم وتحليل تفاعل التطبيق مع الشبكة بشكل دقيق، ويساعد على تحسين الأداء واكتشاف الأخطاء بسرعة وكفاءة خلال مرحلة التطوير.

سابعاً: التسجيل (Logging) وأداة تحليل حجم التطبيق (App Size Tool)

ما هي أداة Logging View ؟

أداة Logging View تتيح للمطورين إمكانية تتبع وعرض سجلات التطبيق التي يتم إنشاؤها أثناء تشغيله ،هذه الأداة مهمة لأنها تقدم لنا رؤية واضحة حول كيفية تنفيذ التطبيق من خلال عرض مجموعة من الرسائل المتنوعة مثل الأخطاء ،التحذيرات ،المعلومات العامة ورسائل التصحيح (debug) التي يطبعها التطبيق أثناء عمله.

باستخدام Logging View، يصبح بإمكاننا مراقبة سلوك التطبيق بدقة ، التعرف على المشاكل أو الحالات غير المتوقعة، وفهم سير العمليات الداخلية بطريقة مفصلة. هذه القدرة تساعد المطورين على تشخيص الأخطاء وتحسين جودة التطبيق بشكل فعال خلال فترة التطوير.

ما هي أداة App Size Tool ؟

كما أخبرنا المهندس عن أداة App Size Tool التي تساعد المطورين على تحليل حجم تطبيق Flutter الخاص بهم، وتحديد الأجزاء التي تساهم بشكل أكبر في زيادة حجم التطبيق الكلي. هذه الأداة تعتبر ذات أهمية كبيرة لأنها تتيح لنا فهم مكونات التطبيق التي تستهلك أكبر مساحة تخزين.

هذا التحليل ضروري لتحسين حجم التطبيق، خاصةً على الأجهزة المحمولة التي تكون مساحة التخزين فيها محدودة. من خلال تقليل حجم التطبيق وتحسينه، نتمكن من توفير تجربة مستخدم أفضل، حيث يصبح التطبيق أخف وزناً ، أسرع في التحميل، ويستهلك موارد أقل.

ملاحظة :

معلومات الحجم (Size information) تعني بيانات مفصلة حول حجم تطبيق Flutter الخاص بك، وتشمل جميع مكوناته مثل كود Dart، الكود الأصلي ، بالإضافة إلى العناصر غير البرمجية مثل حزمة التطبيق (application package) ،الموارد (assets)، والخطوط (fonts).

هذه المعلومات تساعدنا في فهم كيف يُوزّع حجم التطبيق بين مكوناته المختلفة، مما يمكّننا من تحسين الحجم الكلي وتقليل استهلاك التخزين.

كيف نحصل على ملف معلومات الحجم Size information؟

يمكن الحصول على هذه البيانات من خلال تشغيل أمر البناء (build) مع خيار --analyze-size في Flutter، مع تحديد المنصة المستهدفة.

بعض الأمثلة على الأوامر:

• flutter build apk --analyze-size لبناء ملف APK مع تحليل الحجم.
• flutter build appbundle --analyze-size لبناء حزمة التطبيقات (App Bundle).
• flutter build ios --flavor dev -t lib/main_dev.dart --analyze-size لبناء تطبيق iOS مع flavor مخصص وتحليل الحجم.
• وكذلك لبناء تطبيقات أنظمة التشغيل مثل Linux، macOS، وWindows بنفس الخيار --analyze-size.

ثامناً : إضافة DevTools (DevTools Extension)

ما هي DevTools Extensions ؟

تُعتبر DevTools Extensions وسيلة تمكّن المطورين من توسيع قدرات أداة Flutter DevTools من خلال إضافة ميزات وأدوات مخصصة تناسب احتياجات مشروعهم أو حالة الاستخدام الخاصة بهم.

هذه الإضافات هي بمثابة Plugins تُضاف إلى DevTools، وتتيح إنشاء لوحات عرض جديدة، أو طرق عرض إضافية، أو إمكانيات تصحيح متقدمة لا تتوفر بشكل افتراضي في الأداة.

باستخدام هذه الإضافات، يمكن تخصيص بيئة التطوير لتكون أكثر توافقاً مع متطلبات المشروع، مما يعزز من فعالية عملية التصحيح والتحليل ويُسهل إدارة تفاصيل التطبيق بشكل أعمق وأدق.

في عالم تطوير تطبيقات Flutter، توجد عدة إضافات (Extensions) شهيرة تضاف إلى أدوات DevTools لتوسيع وظائفها وتسهيل عملية التطوير، منها:

1. Provider Extension: تساعد في مراقبة وإدارة حالة الـ State التي تُدار باستخدام مكتبة Provider، مما يسهل تتبع التغيرات في البيانات داخل التطبيق.
2. Shared Preferences Extension: تُستخدم لعرض وتعديل البيانات المخزنة محلياً باستخدام Shared Preferences، وهي مفيدة لفحص إعدادات التطبيق أو البيانات الصغيرة المخزنة على الجهاز.
3. Firebase Messaging Devtool (ليس حزمة رسمية): إضافة غير رسمية تساعد في مراقبة وإدارة رسائل و أشعارات (Push Notifications) أثناء تطوير التطبيق.
4. Patrol UI Testing Framework: إطار عمل لاختبارات واجهات المستخدم (UI)، يساعد على كتابة وتنفيذ اختبارات تلقائية وتحليلها ضمن بيئة DevTools.
5. Drift: إضافة خاصة بقاعدة بيانات Drift ، تساعد في مراقبة استعلامات قاعدة البيانات وتحليلها بشكل مباشر أثناء تطوير التطبيق.

الختام :

في نهاية هذا العرض، يتّضح أن إدارة الذاكرة في تطبيقات Flutter ليست مسؤولية (GC) وحده، بل هي جزء لا يتجزأ من مسؤوليات المطوّر المحترف. فالفهم العميق لمفاهيم مثل تسرب الذاكرة (Memory Leak) وMemory Bloat ، واستخدام أدوات مثل DevTools لتحليل الأداء، لا يساعد فقط في تجنّب الأخطاء الحرجة، بل يعزز من كفاءة واستقرار التطبيق على المدى الطويل

من خلال ممارسات تطوير واعية مثل التخلص من المستمعات بعد استخدامها، وتحميل الموارد بحجم مناسب، وتحليل حجم التطبيق باستخدام أوامر --analyze-size — يمكننا الحفاظ على تطبيقات خفيفة، سريعة، وتعمل بسلاسة على مختلف الأجهزة.

الاهتمام بالذاكرة ليس رفاهية، بل ضرورة لضمان تجربة مستخدم قوية، تقليل احتمالات الانهيار، وتحقيق منتج عالي الجودة يُعتمد عليه.

في بيئة تطوير سريعة النمو كـ Flutter، تبقى مراقبة الأداء وإدارة الموارد بحكمة هي المفتاح لبناء تطبيقات متينة، فعّالة، وقابلة للتوسع بثقة.

ألبوم الصور:

الجلسة الثالثة عشرة 12 تموز 2025