المدونة
مقالات عملية مرتبة حسب المجال والمستوى، اختر المجال المناسب واقرأ من مستوى مبتدئ إلى محترف.
Event Loop في JavaScript للمتوسط: ليه await Promise.resolve() بيسبق setTimeout(0)
لو سألك حد في interview ليه await Promise.resolve() بينفّذ قبل setTimeout(0) رغم إن الاتنين بيأجّلوا التنفيذ، الإجابة مش في JavaScript نفسه، الإجابة في إن فيه طابورين منفصلين داخل Event Loop. مقال للمتوسط بمثال موظف المكتب للمبتدئ، شرح علمي من WHATWG HTML Spec قسم 8.1.7، 4 قواعد تحسم الترتيب بكود JS شغّال على V8 و Node 22، أرقام قياس فعلية (queueMicrotask 0.018ms vs setTimeout(0) 1.4ms، فرق 60×)، تحذير من Microtask Starvation اللي بيجمّد الـ UI، 4 trade-offs خفية، ومتى مش لازم تشغّل بالك بالموضوع أصلاً.
Tool Use في Claude للمتوسط: ربط النموذج بـ 6 أدوات بدون hallucinated function calls
لو ربطت Claude بـ 6 functions في chatbot شركتك ولقيت إنه بيخترع أسماء functions مش موجودة (مثل get_user_info بدل fetch_user_profile)، المشكلة مش في النموذج. المشكلة في descriptions الأدوات. مقال للمتوسط بمثال موظف الاستقبال للمبتدئ، شرح علمي من ورقة Toolformer (Schick 2023)، كود Python في 32 سطر شغّال على anthropic SDK 0.49+ و Claude Sonnet 4.6، أرقام مقاسة على 2,400 request في chatbot fintech عربي (نسبة الـ hallucination من 14.2% لـ 0.7%)، 4 trade-offs خفية في التكلفة والـ latency والـ maintenance، ومتى Tool Use بيكون قرار غلط.
اعمل OG Image دايناميكي بـ Satori على Cloudflare Workers في 80 سطر
المصمم بيقعد 12 ساعة أسبوعياً يصمم صور Open Graph يدوياً. Satori على Cloudflare Workers بيخلّيها تتولّد لحظياً من URL parameters بـ 80 سطر TypeScript، 47 مللي ثانية cold start، وبصفر تكلفة تحت 100K طلب يومياً. دليل تنفيذي للمتوسط بمثال المطبعة للمبتدئ، شرح علمي لـ Yoga layout و resvg-wasm، كود كامل قابل للنسخ على wrangler 3.x، أرقام مقاسة من 90 يوم إنتاج على blog عربي بـ 38K زيارة شهرياً، 4 trade-offs خفية في CSS subset والـ fonts والـ cache invalidation، ومتى Puppeteer لسه الاختيار الأنسب.
Function Calling في Claude للمتوسط: من 64% إلى 97% دقة في استدعاء APIs شركتك
لو chatbot شركتك بيرد بـ JSON فيه field اسمه customer_name بدل customerName اللي API بتاعك بيستقبله، انت بتدفع تكلفة 5% من الـ requests بتفشل في صمت. Function Calling في Claude Sonnet 4.6 بيرفع دقة الـ JSON structure من 64.3% لـ 97.1% على 1,200 طلب فعلي من workload فينتك عربي. مقال للمتوسط بمثال المحاسب اللي بيملا نموذج، شرح علمي من Anthropic Tool Use Docs و ورقة Toolformer (Schick 2023)، كود Python في 45 سطر شغّال على anthropic SDK 0.49+ و Claude Sonnet 4.6، أرقام مقاسة (latency overhead +120ms، tokens overhead +14%)، 4 trade-offs خفية بتظهر في الإنتاج، ومتى Tool Use بيكون overkill.
Decorators في Python للمتوسط: من 14 دالة بتعيد نفس الكود لـ @ واحد
لو فريقك بيكرّر نفس 8 سطور التحقق من JWT في 14 endpoint، انت بتدفع ضريبة DRY مرتين. Python Decorators بـ @ واحد بيخلّي السطور دي تتكتب في مكان واحد، وكل endpoint بيحطها قبله بسطر. مقال للمتوسط بمثال حارس المبنى للمبتدئ، شرح علمي من PEP 318، 4 decorators شغّالة (@timer, @retry, @cache, @auth) على Python 3.12 و FastAPI 0.110، أرقام مقاسة من خدمة fintech عربية (1,840 سطر مكرر → 230 سطر)، 4 trade-offs خفية، ومتى Decorator بيكون اختيار غلط.
اعمل MCP Server بـ Python للمتوسط: خلّي Claude يستعلم على SQLite بتاعك في 80 سطر
لو بتنسخ بيانات من SQLite بإيدك وتلصقها في Claude كل مرة، Model Context Protocol بيخلّي Claude يفتح الـ DB ويستعلم مباشرةً. مقال للمتوسط بمثال موظفي المكتب وتعريفين علميين من توثيق Anthropic و JSON-RPC 2.0، سيرفر Python كامل في 80 سطر شغّال على mcp-sdk 1.2 و aiosqlite 0.20، خطوات تركيب على Claude Desktop، أرقام مقاسة على 200 استعلام (دقة اختيار الـ tool 96.5%، متوسط latency 1.4 ثانية)، 4 trade-offs خفية، ومتى MCP بيكون مبالغة هندسية.
WeakMap و WeakSet للمتوسط: امنع Memory Leaks في الـ Caches و Event Listeners
لو تطبيق الـ React عندك بياكل 1.4GB RAM بعد ساعة شغل وفي 12 ألف Detached DOM node في الـ heap snapshot، المشكلة في Map عادي ماسك references لـ objects ما عادتش محتاجة. مقال للمتوسط بمثال أوراق المكتبة للمبتدئ، تعريف من ECMAScript 2024 Spec قسم 24.3، كود JavaScript شغّال، أرقام مقاسة من dashboard React (1.42GB → 187MB، توفير 86%)، 4 trade-offs خفية، ومتى WeakMap بيبقى اختيار غلط.
Closures في JavaScript للمتوسط: ليه الدالة بتفتكر متغيرات الـ scope
لو شفت stale closure في React review أو كتبت debounce بدون ما تفهم ليه الـ timer بيفضل محفوظ، انت بتستخدم Closures من غير ما تعرفها. مقال للمتوسط بمثال الدفتر الشخصي للموظف للمبتدئ، تعريف علمي من ECMAScript 2024 Spec قسم 9.4، 4 استخدامات واقعية بكود قابل للنسخ (event handlers, debounce, module pattern, React hooks)، قياس فعلي يقارن Closure بـ Class على مليون instance (138MB vs 96MB)، الفخ الشائع لـ memory leak، 4 trade-offs خفية، ومتى تتجنب Closures.
AbortController في JavaScript للمتوسط: ألغِ طلبات fetch قبل ما تخنق الـ Backend
صندوق بحث live بيبعت طلب fetch مع كل حرف بيهدر 80% من ضغط الـ Backend على نتائج فات وقتها. شرح للمتوسط بمثال حارس باب السينما للمبتدئ، تعريف من DOM Standard، كود React hook شغّال، أرقام مقاسة (5 طلبات → 1، توفير 80%)، Pattern الـ timeout، 4 trade-offs خفية، ومتى AbortController يبقى اختيار غلط.