
- بواسطة x32x01 ||
تخيل كده معايا 
أنت مطور Flutter، وخلصت مشروعك أخيرًا بعد مجهود طويل
قعدت في هدوء تشرب كوباية شاي سخنة
، وقلت خلاص التطبيق جاهز للتجربة.
بعت النسخة لفريق الاختبار... وبعد شوية جالك تقرير
"التطبيق تقيل جدًا!"
"الأداء واقع!"
وأنت طبيعي تقول لنفسك:
"أكيد عشان الصور كتير... ومعظمها PNG، بس كده!"
بس المفاجأة؟
الفريق بيرد عليك:
"احنا عايزين تقرير مفصل بالأرقام، وبسرعة!"
وهنا بقى بيظهر البطل الحقيقي اللي هينقذك من الورطة دي...
Dart DevTools!
يعني إيه Dart DevTools؟
هي أداة تحليل قوية جدًا بتساعدك تعرف كل تفصيلة بتحصل جوه تطبيقك Flutter لحظة بلحظة - الأداء، الذاكرة، الشبكة، الـ CPU، حجم التطبيق، وحتى الـ Widgets اللي بتستهلك موارد زيادة 
بتخليك تشوف بعينك ليه التطبيق تقيل، فين التأخير، وإزاي تصلحه خطوة بخطوة.
1. Performance Tab
لو الأداء مش مظبوط، فـ ده أول مكان تدخله.
هتلاقي هنا رسم بياني فيه أعمدة وألوان بتوضحلك كل حاجة عن سرعة التطبيق.
الأعمدة الحمراء (Jank Frames):
لما تشوف أعمدة حمرا كتير، ده معناه إن الـ Frames بتاخد أكتر من 16.7ms، وده بيخلي التطبيق "يقطع"
الحل؟ قلل حجم الصور الكبيرة، راجع الأكواد اللي فيها loops كتير.
الأعمدة الزرقاء (UI & Raster):
بتوضح وقت معالجة واجهة المستخدم والرسم.
لو أقل من 16.7ms يبقى تمام
، لو أكتر شوف العمليات الثقيلة زي الصور أو العمليات الحسابية.
معدل الإطارات (FPS):
لو الـ FPS أقل من 60 فده معناه إن في مشكلة في الخلفية.
أقل من 40؟ يبقى في حاجة لازم تتصلح فورًا
2. Memory Tab
المكان اللي تتابع منه استهلاك الذاكرة وتشوف إذا عندك Memory Leak ولا لأ.
لو شفت التطبيق بيستهلك فوق 100 ميجابايت في الـ Dart Heap، فغالبًا الصور أو الـ Streams مش بتتحرر.
شوف كمان عدد الـ Instances:
لو لقيت عدد ضخم من
نصيحة سريعة؟
استخدم
عشان تقلل حجم الصورة اللي بتتحمل في الذاكرة.
3. Network Tab
لو تطبيقك بيعتمد على الإنترنت، التبويب ده مهم جدًا.
هتقدر تشوف كل API Request والمدة اللي بياخدها.
زمن الاستجابة (Response Time):
لو الطلب بياخد أكتر من 3 ثواني، المشكلة ممكن تكون في السيرفر أو في طريقة استدعاء البيانات.
مثال بسيط؟
لو الطلب ده بيتأخر، ممكن تستخدم Caching أو Pagination لتقليل الضغط.
4. Logs
الـ Logs دي بقى زي الكاميرا الخفية 
كل حاجة بتحصل ورا الكواليس بتتسجل هنا:
مثلاً:
يبقى في مشكلة بالإنترنت أو الـ DNS.
دي فعلاً كنز لأي مطور جاد
5. CPU Usage
لو التطبيق بيهنّج أو بيقطع جامد، بص على استهلاك المعالج.
لو لقيت استهلاك عالي جدًا فغالبًا فيه أكواد بتلف في حلقة لا نهائية
زي مثلًا:
ده نوع الكود اللي يستهلك CPU لآخر نفس 
خليك دايمًا تستخدم
6. أدوات إضافية لازم تجربها
Highlight Repaints:
بتخليك تشوف المناطق اللي بتعيد الرسم أكتر من اللازم.
لو شفتها بتنور كتير، يبقى عندك Widgets بتتعاد رسمها بشكل غير ضروري.
Flutter Inspector:
ده الساحر بتاع التصميمات
بيخليك تستكشف كل Widget وتعرف الـ Padding والـ Constraints والـ Layout.
مثلاً لو عنصر مش ظاهر، ممكن تعرف السبب في ثانية.
7. حجم التطبيق (App Size)
في مشاريع Flutter، حجم التطبيق دايمًا بيكون نقطة ضعف 
لكن ممكن تقلله بخطوات بسيطة جدًا
نصايح سريعة من الخبراء
أداة Dart DevTools مش بس وسيلة تحليل، دي فعلاً درعك الواقي ضد كل مشاكل الأداء في Flutter
هتخليك تعرف فين التطبيق بيبطّأ، تراقب استهلاك الذاكرة، وتحسّن تجربة المستخدم بدون تخمين
استخدمها باستمرار، وهتلاحظ إن مشاكلك قلت، وجودة تطبيقك زادت
وفي المرة الجاية لما حد يقولك "التطبيق تقيل!"، هتبتسم وترد بثقة:
"اديني 5 دقايق مع Dart DevTools
"

أنت مطور Flutter، وخلصت مشروعك أخيرًا بعد مجهود طويل

قعدت في هدوء تشرب كوباية شاي سخنة

بعت النسخة لفريق الاختبار... وبعد شوية جالك تقرير

"التطبيق تقيل جدًا!"
"الأداء واقع!"
وأنت طبيعي تقول لنفسك:
"أكيد عشان الصور كتير... ومعظمها PNG، بس كده!"

بس المفاجأة؟
الفريق بيرد عليك:
"احنا عايزين تقرير مفصل بالأرقام، وبسرعة!"

وهنا بقى بيظهر البطل الحقيقي اللي هينقذك من الورطة دي...
Dart DevTools!

يعني إيه Dart DevTools؟
هي أداة تحليل قوية جدًا بتساعدك تعرف كل تفصيلة بتحصل جوه تطبيقك Flutter لحظة بلحظة - الأداء، الذاكرة، الشبكة، الـ CPU، حجم التطبيق، وحتى الـ Widgets اللي بتستهلك موارد زيادة 
بتخليك تشوف بعينك ليه التطبيق تقيل، فين التأخير، وإزاي تصلحه خطوة بخطوة.
1. Performance Tab
لو الأداء مش مظبوط، فـ ده أول مكان تدخله.هتلاقي هنا رسم بياني فيه أعمدة وألوان بتوضحلك كل حاجة عن سرعة التطبيق.

لما تشوف أعمدة حمرا كتير، ده معناه إن الـ Frames بتاخد أكتر من 16.7ms، وده بيخلي التطبيق "يقطع"

الحل؟ قلل حجم الصور الكبيرة، راجع الأكواد اللي فيها loops كتير.

بتوضح وقت معالجة واجهة المستخدم والرسم.
لو أقل من 16.7ms يبقى تمام


لو الـ FPS أقل من 60 فده معناه إن في مشكلة في الخلفية.
أقل من 40؟ يبقى في حاجة لازم تتصلح فورًا

2. Memory Tab
المكان اللي تتابع منه استهلاك الذاكرة وتشوف إذا عندك Memory Leak ولا لأ.
لو شفت التطبيق بيستهلك فوق 100 ميجابايت في الـ Dart Heap، فغالبًا الصور أو الـ Streams مش بتتحرر.

لو لقيت عدد ضخم من
Image Widgets
، يبقى الصور مش بتتحذف من الذاكرة 
نصيحة سريعة؟
استخدم
Image.asset(..., cacheWidth: ...)
عشان تقلل حجم الصورة اللي بتتحمل في الذاكرة.
3. Network Tab
لو تطبيقك بيعتمد على الإنترنت، التبويب ده مهم جدًا.هتقدر تشوف كل API Request والمدة اللي بياخدها.

لو الطلب بياخد أكتر من 3 ثواني، المشكلة ممكن تكون في السيرفر أو في طريقة استدعاء البيانات.
مثال بسيط؟

Code:
final response = await http.get(Uri.parse('[https://api.example.com/users](https://api.example.com/users)'));
print(response.statusCode);
4. Logs
الـ Logs دي بقى زي الكاميرا الخفية 
كل حاجة بتحصل ورا الكواليس بتتسجل هنا:
- أخطاء الاتصال بالـ API
- مكتبات مش متوافقة
- تحذيرات الذاكرة
- Exceptions وقت التشغيل
مثلاً:
SocketException: Failed host lookup
يبقى في مشكلة بالإنترنت أو الـ DNS.
دي فعلاً كنز لأي مطور جاد

5. CPU Usage
لو التطبيق بيهنّج أو بيقطع جامد، بص على استهلاك المعالج.لو لقيت استهلاك عالي جدًا فغالبًا فيه أكواد بتلف في حلقة لا نهائية

زي مثلًا:
Code:
while(true) {
print("Still running...");
}

خليك دايمًا تستخدم
Future.delayed
أو Timer
بدل الحلقات المفتوحة.6. أدوات إضافية لازم تجربها

بتخليك تشوف المناطق اللي بتعيد الرسم أكتر من اللازم.
لو شفتها بتنور كتير، يبقى عندك Widgets بتتعاد رسمها بشكل غير ضروري.

ده الساحر بتاع التصميمات

بيخليك تستكشف كل Widget وتعرف الـ Padding والـ Constraints والـ Layout.
مثلاً لو عنصر مش ظاهر، ممكن تعرف السبب في ثانية.
7. حجم التطبيق (App Size)
في مشاريع Flutter، حجم التطبيق دايمًا بيكون نقطة ضعف 
لكن ممكن تقلله بخطوات بسيطة جدًا

- استخدم WebP بدل PNG أو JPEG - نفس الجودة، بس حجم أقل بكتير.
- وفر نسخ صور مختلفة حسب الشاشة (
mdpi
،xhdpi
...). - احذف المكتبات والخطوط اللي مش مستخدمها.
- افصل موارد Android عن iOS بدل ما تضمهم كلهم مع بعض.
- فعّل Code Shrinking زي Proguard عشان يقلل حجم الكود:
Code:
flutter build apk --release --obfuscate --split-debug-info=build/app/outputs/symbols
نصايح سريعة من الخبراء
- دايمًا جرب التطبيق على أجهزة ضعيفة قبل ما ترفعه.
- استخدم Flutter Performance Overlay عشان تتابع الأداء لحظة بلحظة.
- متنساش تعمل Profile Mode بدل Debug Mode وقت التحليل.
Code:
flutter run --profile
أداة Dart DevTools مش بس وسيلة تحليل، دي فعلاً درعك الواقي ضد كل مشاكل الأداء في Flutter

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

استخدمها باستمرار، وهتلاحظ إن مشاكلك قلت، وجودة تطبيقك زادت

وفي المرة الجاية لما حد يقولك "التطبيق تقيل!"، هتبتسم وترد بثقة:
"اديني 5 دقايق مع Dart DevTools

التعديل الأخير: