الكثير يتسأل احيانا ليش الأداء في التطبيق بطيء وخاصة إذا كان هناك بيانات كبيرة وتعرضها على اي نوع من انواع list
سواء listView او gridView ....
وهذا السبب يعود إلى أن اي نوع من الأنواع السابقة الذي ذكرت هي تبني جميع العناصر الموجودة في list مرة واحدة مما يسبب بطئ في التطبيق
ولحل هذه المعظلة استخدم
lazily build
مثل
infinite scrolling مثل.
Pagination
بحيث فقط تعطي او تبني فقط العناصر بحجم الشاشة وعند ال scroll تعطي فقط عناصر او items ما يقابل ارتفاع الشاشة ولا تعمل build لجميع العناصر الموجودة في list
هذا يساعد في تحسين أداء التطبيق بواسطة عدم بناء جميع العناصر مرة واحدة واستهلاك الموارد مثل الذاكرة وبناء وعرض فقط مايكون ضروري .
كما يحسن أداء ال smooth scrolling أيضا يضيف خاصية scalability عندما تكون البيانات من قاعدة بيانات كبيرة بدون تأثير على الأداء.

من المواضيع المهمه الذي يجب التركيز عليها عند تصميم الواجهات موضوع
Responsive and Adaptive
طيب
ايش الفرق بينهم ؟
راح اقول لك با اختصار الفرق

1-Responsive
انو تصميمك يكون تصميم واحد ينعرض بنفس الشكل والترتيب سواء كانت الشاشة شاشه موبايل او تابلت او جهاز كمبيوتر او اكبر
2- Adaptive
هنا بيكون الموضوع شوي مختلف بحيث انو كل منصه او يحتاج لها تصميم مختلف عن غيرة
فمثلا تريد تصميم للموبايل يختلف عن تصميم التابلت والكمبيوتر وغيرها من المنصات
وكذلك نفس الحال مع بقيه المنصات

طيب السؤال هنا كيف اقدر احقق موضوع responsive و Adaptive

بالنسبة الفلاتر هناك الكثير من الأدوات الذي تساعدنا لتحقيق هذا الهدف
أولا Adaptive
في widget تقدر تعرض من خلالها تصميم لكل منصه اسم الودجيت LayoutBuilder
من خلال هذه وبمساعده ال Mediaquery تقدر تحقق هذا الموضوع

ثانيا responsive
فلاتر وفرت الكثير من الأدوات لتحقيق هذا الموضوع وهذه أغلب الأدوات استخداما
Expanded
FitedBox
Felixable
AspectRatio
MediaQuery
هذه بعض الادوات ولكن يجب عليك معرفه متى وين يجب عليك استخدام كل اده وماهي المشاكل المترتبة عليها اذا استخدمتها بشكل خاطئ

تحسين بناء و هيكلة widgets في flutter يجب الانتباه عليه أثناء عملية التطوير لانه يحسن من الأداء و الكفائة في التطبيق .
هناك عدة اشياء يجب الانتباه عليها لتحقيق هذا الشي :
1-استخدام stateless widgets في اي مكان يمكن استخدامها خاصة إذ widgets لا تتطلب حالات بناء كثيرة تعتبر اكثر كفائة لأنها تبني فقط مرة واحدة ولا تحتاج ل اعادة بناء مادام parents widget تم إعادة بناتها.
2- حاول انك تقلل استخدام setState اقل قدر ممكن ولا تستخدمها الا عند الضرورة او استخدام state management مثل bloc,provider... لأنها تعتبر اكثر كفائة من setState.
3- استخدم keys بعناية شديدة.
4- تجنب اعاده بناء rebuild ل اي widget ثابته ولا تحتاج إلى تغيير
وأفضل حل انك تحط قبلها const هذا يخبر flutter ان هذه ال widget ثابته وغير قابلة للتغيير.

5- استخدام البناء بشرط Conditional builds استخدام if الشرطية لبناء فقط اي widget باستخدام شرط معين.
6-استخدام lazy loading مثل listview.builder.
7- عند استخدام صور او ملفات احفظها في chache مثل استخدام مكتبه ChacheNetworkImage لحفظ الصور في الذاكرة المؤقتة.
8-تجنب استخدام listener و callback الغير ضرورية.
9-استخدام flutter Devtools لتحليل أداء widgets في التطبيق بحيث اذا كان هناك استهلاك للموارد او مشكلة تقدر تتبعها بسهولة تامه.
10-تجنب إفراط الاستعمال لل animation واستخدمه في أماكن لا تؤثر على أداء التطبيق .
11-استخدام مكاتب لا ادارة الحالة تبع التطبيق مثل bloc اوprovider بحيث انها ذات كفائة لا ادارة الحالة وأقل rebuild لل widgets وتعمل rebuild فقط للحاجات الضرورية.

هذه من أهم الأشياء الذي يجب النظر والاهتمام بها خلال مرحلة التطوير وان شاء الله راح نتكلم على كل بند بالتفصيل.
#yahya

أكيد معظم المبرمجين سمعوا عن GitHub Copilot والمميزات الرهيبة الي تقدمها الأداة من توليد الكود حتى الوصول الى إنشاء comment عند رفع الكود الى GitHub ، بس اعتقد معظم المبرمجين ما استطاعوا يجربوا GitHub Copilot بسبب انها مدفوعة ،
في منشور سابق تحدثت عن البديل عن copilot في المساعدة في توليد واقتراح كتابة الكود بشكل مجاني تقدر تشوف المنشور هنا .
https://t.me/DES_Fiction/1874
مع Blackbox.AI، لن تضطر أبدًا إلى كتابة commit غامضة أو غير كافية. بدلاً من ذلك، ستحصل على ملخصات مفصلة تغطي جميع التغييرات الرئيسية، مثل إزالة الكود غير الضروري، تحديث استخدام widget، إضافة الملفات الجديدة ، وغيرها الكثير. هذه الرسائل الموجزة تجعل من السهل توثيق تاريخ الكود وتتبع التغييرات.

اهم الأدوات الذي يجب أن تستخدمها ك مطور تطبيقات

1- codemagic
وهذه اداه لطيفه تسمح لك بإعداد تطبيقك للمتجر وبناء نسخه iso مع إمكانية اختبار التطبيق .
2- Vysor
وهو عبارة عن تطبيق تثبته على جهازك وتربطه بموبايل وتقدر تتابع التغيرات في التطبيق وتنفيذ التطبيق علية.
3-shorebride
وهذا أداة تسمح لك بتحديث المحتوى تبع تطبيقك في المتجر بدون عمل rebuild للتطبيق
4- Agora
وهذا ببساطه عبارة عن sdk يسمح لك بعمل real time ل اي media مثل audio او video او podcast.
5-GenyMotion
وهذا عبارة عن tool تسمح لك بتثبيت جهاز افتراضي على حاسوبك وهذا الجهاز منفصل تماما عن البيئة وهذا ما يجعل أدائها عالي جدا.
6- one signal
وهذه بديلة firebase notification وهي تعتبر مكتبه تقدر من خلالها عمل إشعارات للمستخدمين حسب ماتريد .
7-codeium
وتعتبر من ادوات AI المجانية والتي تقوم بعمل إكمال تلقائي للكود وتسهم في توفير الوقت والجهد في كتابة الكود.

🔥 كيف تستفيد من Tricks بسيطة لتحسن أداء تطبيقاتك Flutter!

كلنا بنعرف إنه الأداء والتجربة المميزة للمستخدم شي مهم، صح؟ 🤔 خلوني أشارككم كذا نقطة سريعة ممكن تفرق معاك كثير:

1. التعامل مع الصور بذكاء
بدل ما تحط صور ضخمة تستهلك الرام والمعالج، استخدم الـ ResizeImage عشان تتحكم في حجم الصورة وتقلل استهلاك الذاكرة

2. قلل الـ rebuilds باستخدام `const`
أي ويدجيت ما بتحتاج تتغير، حطها كـ const. الحركة البسيطة تفرق جدا بأداء التطبيق وتقلل الـ rebuilds غير الضرورية

3. في حال الأنيميشن استخدم AnimatedBuilder بدل الـ setState 🎬
لو عندك أنيميشن معقد، بدل ما تستخدم setState، استخدم AnimatedBuilder لتحديث واجهة الأنيميشن بشكل سلس وأسرع

4. تجنب استخدام Widgets زائدة عن الحاجة
خليك بسيط، وقلل استخدام ويدجتس لا فائدة منها. مثلًا، ما تحتاج Column داخل Column عشان توزع المسافات، استخدم فقط padding و Expanded او Spacer بشكل ذكي

كيف تنشئ شاشة Responsive تدعم كل الأجهزة في Flutter؟

لو بتطور تطبيق بـ Flutter وعايزه يظهر بشكل ممتاز على كل الأجهزة سواء كانت موبايلات صغيرة، تابلت، أو حتى شاشات كبيرة، لازم تعتمد على تصميم متجاوب Responsive Design. في Flutter، عندك أكتر من طريقة لتحقيق ده بسهولة واحترافية.

1. استخدام MediaQuery
MediaQuery بتديك معلومات عن حجم الشاشة الحالية، وبتساعدك تضبط العناصر بناءً على الطول والعرض.

2. استخدام LayoutBuilder
LayoutBuilder بيسمح لك تقسّم الشاشة بناءً على القياسات المتاحة، وده مفيد جدًا لتغيير التصميم حسب حجم الشاشة.

3. استخدام مكتبة ScreenUtil
ScreenUtil مكتبة قوية جدًا لتصميم واجهات متجاوبة بسهولة. بتحتاج تضيف المكتبة في المشروع:

٤.استخدام Flex Widgets: زي Row وColumn مع Expanded أو Flexible لتنظيم العناصر.

حاول دائمًا تستخدم النسب أو القيم الديناميكية بدل الأرقام الثابتة.

جرب التطبيق على شاشات بأحجام مختلفة باستخدام Device Preview .

التصميم المتجاوب مش بس تحسين للتجربة، لكنه كمان بيعكس احترافية التطبيق. سواء استخدمت MediaQuery، LayoutBuilder، أو مكتبة زي ScreenUtil، المهم إنك تضمن إن التطبيق هيظهر بأفضل صورة على كل الأجهزة! 🚀

تحديث إطار العمل Flutter
اصبح متاح الان 3.27.0

•
A new #flutter #version 3.27.0 is available 🕊️😍

• Changelog
• Flutter release notes
• Flutter Public Announcements

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



شعرت بفراغ شديد وصعوبة بتجميع الأفكار وقليل من الحسرة . ف تبداء المقارنة بين هذا العام والعام الماضي، وبين الخطط بين العامين التي تم تنفيذها والتي تم إهمالها، لم استطع الوصول إلى انجاز يكتب ويرضي نفسي التي تريد حقاً معرفة ماذا انجزت، فتذكرت أن الله اكرمني لفكرة اني مستمر منذ العام السابق ب العمل 10-12  ساعه في اليوم، في التخصص وفي بناء المهارات  الاخرى .

وأصل حينها إلى قناعة تامة ورضاء نفسي كبير وشكرٌ لله على هذه النعمة .

أيقنت أن هناك الكثير من النعم التي اعتدنا عليها وإنجازات خطية لا نستطع أن نحكم عليها الا من زاوية اخرى.

بجد من أعظم النعم أن يهيئ الله لك الأسباب لشغل وقتك، وجهدك وسنين عمرك في العمل والتعلم، نعمة قد تكون منجية من سؤال وشبابه فيما افناه. 

لذلك إن مررت بحالتي و لم تستطع أن تكتب إنجازات السنه ذي؛ ففكر ف وقتك كيف قضيته وفيما قضيته ومن خلاله تستطيع أن تحكم على الجزء الخفي الذي لايُكتب ولن يجد ذلك الجمهور الذي يعجب به .

#space

The new #flutter #video "Flutter Web with Wasm: How close can we get to native speeds? 🚀" has arrived ▶️🍿

أصبحت تطبيقات الويب الخاصة بـ Flutter متوافقة الآن مع Wasm. وهذا يعني أداءً أسرع، يضاهي أداء التطبيقات الأصلية. شاهد المزيد .

Flutter web apps are now Wasm compatible. That means faster performance, comparable to native app performance. Watch more ...

10 خدمات مجانية لا غنى عنها لكل مطوّر Flutter 🔥

إذا كنت عم تطوّر تطبيقات بـ Flutter وبدك توفر وقتك ومجهودك، هالخدمات المجانية رح تكون كنز حقيقي! 👇



1️⃣ Strapi
نظام إدارة محتوى مفتوح المصدر ومرن جدًا. بتقدر تبني واجهات API بسهولة وبدون وجع راس، وبتتكامل مع Flutter لبناء تطبيقات قوية وسريعة.

2️⃣ Notion API
لو كنت بتشتغل على تطبيقات إدارة مهام أو تنظيم بيانات، Notion API بيوفرلك نظام قوي لجلب وتنظيم البيانات بمرونة.

3️⃣ Firecamp
أداة مجانية لاختبار الـ APIs بأنواعها (REST - GraphQL - WebSocket) بسهولة. بتوفر عليك وقت طويل بالتجربة.

4️⃣ Heroku
استضافة مجانية لتطبيقاتك وخدمات الـ API. خيار مثالي للمشاريع الصغيرة والمتوسطة وبتعطيك خطة مجانية بتكفي للانطلاقة.

5️⃣ OneSignal
إذا بدك ترسل إشعارات Push Notifications لتطبيقك، OneSignal هو الحل المجاني والأكثر احترافية، وبيوفر ميزات تخصيص ممتازة.

6️⃣ DartPad
محرر كود مباشر على المتصفح. جرّب أكواد Flutter وDart بدون ما تنزل أي أدوات أو بيئات عمل، مثالي للتجربة السريعة.

7️⃣ Gravatar
خدمة مجانية بتساعدك بإضافة صور ملفات المستخدمين عبر البريد الإلكتروني بشكل تلقائي، وبتعطي طابع احترافي للتطبيق.

8️⃣ RapidAPI
مكتبة ضخمة من الـ APIs المجانية والمدفوعة. سواء كنت بحاجة لخدمة ترجمة، طقس، أو حتى خدمات ذكاء اصطناعي، هالمنصة بتوفرها كلها.

9️⃣ Firebase Test Lab
بدك تتأكد إن تطبيقك شغال بدون مشاكل؟ هاي الأداة بتخليك تختبر تطبيقك على أجهزة حقيقية افتراضية وتكشف الأخطاء قبل الإطلاق.

🔟 GitHub Pages
لو عندك توثيق أو موقع بسيط لتطبيقك، GitHub Pages بيسمحلك تعمل استضافة مجانية لموقعك بطريقة احترافية وسريعة.



💡 الملخص
ما في داعي تدفع مبالغ ضخمة لخدمات الباك ايند أو الاختبارات، هالخدمات بتغطي كل احتياجاتك وبتساعدك تطوّر تطبيقات Flutter بجودة عالية وبدون تكلفة.

جرّبها وخليك دايمًا سابق بخطوة في مشاريعك! 🚀

🚀 Flutter Developer | 3+ Years of Experience | Cross-Platform App Expert

Hello! I’m a Flutter developer with over 3 years of experience designing and developing scalable, high-quality mobile applications for Android and iOS. I specialize in creating modern, responsive UIs backed by clean architecture and solid performance.

✅ Skilled in Dart, Flutter, Firebase, RESTful APIs,
✅ State Management: Bloc/Cubit, Provider, Riverpod, GetX
✅ Experience delivering full-cycle app development — from concept to deployment
✅ Focused on performance, maintainability, and great user experience
✅ Reliable communication and on-time delivery

If you’re looking for a dedicated Flutter developer who can bring your app idea to life, I’d love to discuss how I can help. Let’s build something impactful together!

📩 Feel free to message me to discuss your project or get a quick quote.
@yousef_hajeb