هل الـ Bundle Size بيأثر على أداء الموقع؟ 🚀
.
.
لو اشتغلت قبل كده على أي مشروع Front-End كبير، أكيد عدى عليك مصطلح "Bundle Size" سواء في PR review، أو وأنت بتعمل debugging، أو وأنت بتعمل optimization للـ Core Web Vitals… السؤال هنا:

⚠️ هل فعلًا حجم الـ Bundle بيفرق في الأداء؟ ولا مجرد رقم وخلاص؟

تعال ندردش شوية عن الـ Bundle Size...

———

📍 LinkedIn:
https://www.linkedin.com/posts/dev-alisamir_frontend-frontenddevelopment-frontenddeveloper-activity-7332478712065478656-Ei8l

📍 Qabilah:
https://qabilah.com/posts/yj5QcLiuaNo

Build & Sell n8n AI Agents (8+ Hour Course, No Code)
https://youtu.be/Ey18PDiaAYI

What's new in Angular

https://youtu.be/eIeJmYdYMQo

How to Think Like a Software Engineer – Not Just a Coder 🚀

Are you writing code, or are you engineering solutions?

That one question separates thousands of frustrated "coders" from software engineers who design robust, scalable systems and get paid more for their work.

If you've ever written a function that worked… until it didn’t, or pushed code that passed QA but fell apart at scale, you’ve tasted the gap between coding and engineering.

In this article, we’ll bridge that gap.

———

🔗 https://dev.to/alisamir/how-to-think-like-a-software-engineer-not-just-a-coder-396f

يعني إيه Buffer في Node.js؟ 🤔
.
.
أغلب الوقت وإحنا بنكتب كود في Node.js، بنتعامل مع البيانات اللي راجعه من الـ APIs أو من الـ Database أو من الـ Files على هيئة Strings أو JSON. تمام كده؟ لكن، لو هنتعامل مع حاجات زي الصور، الملفات الصوتية، الفيديو، أو أي Data غير نصيّة (non-text)، وقتها الـ JavaScript ما تعرف تتعامل مع النوع ده بشكل مباشر.

وهنا ييجي دور الـ Buffer.

———

📍 LinkedIn:
https://www.linkedin.com/posts/mentoor-io_nodejs-nodejsdeveloper-backend-activity-7333185574079479808-MTLZ

📍 Facebook:
https://www.facebook.com/share/p/18xr3AkpWk

📍 Qabilah:
https://qabilah.com/posts/CPSnhdZfJqU

مفهوم الـ Concurrent Rendering في React 💡
.
.
لو بتشتغل بـ React، أكيد لاحظت إن أحيانًا التطبيقات بتبقى بطيئة أو بتتجمد لما المستخدم بيبدأ يتفاعل معاها، زي لما يكتب في فورم أو يعمل scroll.

المشكلة دي بتحصل لأن React في الأساس بتعالج كل حاجة مرة واحدة وبشكل متسلسل، وده بيخلي الـ UI يهنج أو يعلق.

علشان كده React قدمت حاجة جديدة اسمها Concurrent Rendering واللي بتتحكم في إزاي React بتتعامل مع تحديثات الشاشة.

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

تعال ندردش شوية عن الـ Concurrent Rendering...

———

📍 LinkedIn:
https://www.linkedin.com/posts/dev-alisamir_react-reactdeveloper-reactjs-activity-7333204185569476608-tb-5

📍 Qabilah:
https://qabilah.com/posts/va9J6gDEwqU

🚨🔥 BREAKING: Angular v20 is HERE! 🔥🚨

🎉 Angular just dropped v20, and it's PACKED with updates that'll make your dev life smoother, faster, and more reactive than ever! ⚡️🧠💻

كورس شرح بPHP متكامل في 6 ساعات | PHP Full Course in 6 Hours (Arabic)

https://youtu.be/qmvjwRbtNww

فرصة ذهبية لتعلم تقنيات Red Hat مجانًا!

هل ترغب في تعزيز مهاراتك في Linux، الحوسبة السحابية، أو الذكاء الاصطناعي؟

منصة Red Hat تُقدم لك اشتراكًا تجريبيًا مجانيًا لمدة 90 يومًا في منصتها التعليمية الرائدة!

🎯 ما الذي ستحصل عليه؟

- دورات تعليمية شاملة في:
✅ Red Hat Enterprise Linux
✅ OpenShift
✅ Ansible Automation
- الذكاء الاصطناعي والحوسبة السحابية
- مختبرات عملية سحابية لتطبيق ما تعلمته
- فرصة لتعلم مهارات مطلوبة في سوق العمل
- إمكانية التحضير لشهادات معتمدة من Red Hat
- تجربة تعليمية مرنة تناسب جدولك

https://www.redhat.com/en/blog/introducing-90-day-red-hat-learning-subnoscription-trial

إزاي تنفذ الـ Caching في Node.js؟ 🤔
.
.
لو أنت شغال بـ Node.js، فـ أكيد قابلت في يوم مشكلة إن الـ API عندك بيبقى بطيء بسبب requests كتير أو عمليات تقيلة زي queries على database، وبدأت تفكر:
"ليه كل مرة أجيب نفس الداتا؟ طب مفيش حل أسرع؟"

الإجابة هي: Caching.

وده اللي هنتكلم عنه اليوم بالتفصيل....

———

📍 LinkedIn:
https://www.linkedin.com/posts/mentoor-io_node-nodedeveloper-nodejs-activity-7334639130842128385-NThv

📍 Facebook:
https://www.facebook.com/share/p/1WNtVnqmVy

إزاي نضمن إن المشروع شغّال زي ما العميل متوقع؟
.
.
الـ Testing مش مجرد خطوة بنعملها في الآخر "علشان نطمن"، ولا هي بس كام Test Case بنكتبهم والسلام.

الموضوع أعمق من كده بكتير...
واللي بيحدد شكله وتوقيته وطريقته هو نوع الـ Software Development Methodology اللي المشروع شغال بها.

———

🎯 أولًا.. يعني إيه Software Testing؟

باختصار، الـ Testing هو الطريقة اللي بنكتشف بها الـ bugs قبل ما توصل للمستخدم.

وكمان بنقيس هل الـ software بيحقق الـ requirements ولا لا؟
هل قابل للاستخدام؟
هل بيشتغل كويس تحت الضغط؟
هل الـ UI سهل وواضح؟

كل دي أنواع مختلفة من الـ Testing...

———

🧭 إزاي الـ Methodology بتأثر على الـ Testing؟

تعال نعرف الفرق...

1. الـ Waterfall Model:

في الـ Waterfall، الـ Testing بييجي في الآخر بعد ما كل حاجة تخلص.

يعني:
Requirements ➡️ Design ➡️ Development ➡️ Testing


📌 ده معناه إنك مش هتبدأ تختبر غير لما المشروع كله يكون جاهز.

وده بيخلي الـ Testing عبارة عن Quality Gate: لو الكود فيه مشاكل، بنرجع خطوة ورا، ونصلح.

⚠️ العيب هنا؟ لو فيه bug في البداية، هتكتشفه متأخر جدًا، وهتكلفك كتير.

———

2. الـ Agile Methodology:

موجود في معظم الشركات دلوقتي.

هنا بنشتغل في Sprints قصيرة (أسبوعين غالبًا)، والـ Testing بيكون جزء من كل Sprint.

📌 الـ Testing بيحصل مع كل ميزة جديدة.
والـ QA بقى جزء من التيم من أول يوم.

🎯 النتيجة؟

- بتقدر تكتشف الـ Bugs بدري
- كمان تقدر تاخد Feedback من العميل بشكل مستمر علشان لو فيه تعديل
- وطبعًا التكلفة هتكون أقل

———

3. الـ DevOps / Continuous Integration:

لما الـ testing يتحول لجزء من الـ pipeline نفسها.

📌 هنا بنستخدم Tools زي Jest أو Cypress أو Selenium، وغيرها، نكتب بها Automated Tests
وأول ما الـ developer يعمل Push، الـ Tests بتشتغل أوتوماتيك.

🔥 ده بيخلي الـ Testing جزء من حياة الكود، مش خطوة منفصلة.

———

✅ لازم تبقى فاهم نوع الـ methodology اللي المشروع ماشي بها، علشان تعرف إمتى وإزاي تختبر.

✅ بلاش تعتمد بس على الـ QA، أنت كـ Developer مسؤول عن كتابة Unit Tests على الأقل.

✅ كل ما تكتب Tests أكتر، كل ما الكود بتاعك هيبقى أسهل في الـ Refactor، وأقل Bugs.

———

أنت شايف إن الـ Testing مسؤولية الـ Developer؟ ولا لازم يكون فيه QA Team دايمًا؟

———

وفقكم الله لكل خير 🌿

لو شغال على أي مشروع TypeScript/JavaScript، وعايز الـ VS Code يشيل الـ imports غير المستخدمة تلقائيًا أول ما تعمل Save، كل اللي عليك تضيف الجزء ده في إعدادات VS Code 👆