أي إطار عمل JavaScript للاختيار

تهدف هذه المقالة إلى شرح أكثر أطر عمل JavaScript شيوعًا من جانب العميل. أيهما "الأفضل" بالنسبة لك هو سؤال آخر.

إطار العمل هو هيكل تطبيق. يتطلب منك التعامل مع تصميم البرنامج بطريقة محددة وإدخال منطقك الخاص في نقاط معينة. عادةً ما يتم توفير وظائف مثل الأحداث والتخزين وربط البيانات لك. يختلف JavaScript Framework عن مكتبة JavaScript في تدفق التحكم الخاص بها:

[1] تقدم المكتبة وظائف يتم استدعاؤها من خلال رمزها الأصلي ، بينما يحدد إطار العمل تصميم التطبيق بالكامل.
[2] لا يستدعي المطور إطار عمل ؛ بدلاً من ذلك ، فإن إطار العمل هو الذي سيستدعي الكود ويستخدمه بطريقة معينة.

تتبع بعض أطر عمل JavaScript نموذج النموذج - العرض - المتحكم المصمم لفصل تطبيق الويب إلى وحدات متعامدة لتحسين جودة الكود وقابلية صيانته. أمثلة: AngularJS و ReactJs و Ember.js.

لماذا نحتاج إلى استخدام الأطر؟

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

يمكن أن تساعد أطر عمل جافا سكريبت في تصميم الكود الخاص بنا بحيث يكون معياريًا (وبالتالي يمكن إعادة استخدامه) وجاف وقابل للقراءة وفعّال وآمن والأهم من ذلك أنه متماسك وسهل الفهم. jQuery ليس إطار عمل ، لذلك فهو لا يساعد في هذه الأمور. تسمح مجموعة من أطر العمل الآن بتحديد نموذج البيانات وستقوم بإنشاء واجهة برمجة تطبيقات لنا. في بعض الأحيان يكون من الممكن أن تأخذ رمز العميل ومع القليل من التعديلات يتم التحويل إلى تطبيق الهاتف باستخدام PhoneGap.

يوفر إطار عمل JavaScript الحديث عادةً واجهة برمجة تطبيقات للتعامل مع الجوانب عالية المستوى التالية لتطوير التطبيق أحادي الصفحة:

• التوجيه والقوالب - ربط هياكل عناوين URL المعقدة بالعروض و / أو الحالات
• الخدمات - مكونات تفاعل واجهة برمجة التطبيقات عبر HTTP أو مآخذ التوصيل
• التبعيات - القدرة على تتبع تبعيات الكود وتسهيل إعادة الاستخدام
• المساعدون - وظائف بسيطة لتسهيل المهام الشائعة باستخدام JavaScript

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

الزاوي Js :

AngularJS هو إطار عمل JavaScript قوي جدًا ومفتوح المصدر. يتم استخدامه في مشاريع تطبيق الصفحة الواحدة (SPA). إنه يوسع HTML DOM بسمات إضافية ويجعله أكثر استجابة لإجراءات المستخدم. AngularJS هو برنامج مفتوح المصدر ومجاني تمامًا ويستخدمه آلاف المطورين حول العالم. تم ترخيصه بموجب ترخيص Apache الإصدار 2.0. تمت كتابة Angular 2 في TypeScript وإطار عمل من نوع MVC . يمكننا استخدامه لأي نوع من التطبيقات ، ولكن سيكون من الجيد تنفيذ هذا الإطار المحدد لبناء تطبيقات أمامية معقدة للغاية ، على الرغم من أنه يمكننا استخدامه للواجهة الخلفية أيضًا. من الأفضل عند تنفيذه لتطوير تطبيقات الواجهة الأمامية التي تأتي مع إطار عمل معياري فردي. تم تطوير AngularJs بواسطة Google. للتعلم أو العمل مع AngularJs ، يجب أن نكون على دراية بـ HTML و CSS و Javascript و AJAX.

مقترح الوظيفة: أفضل أطر PHP - كل ما تحتاج إلى معرفته

رد فعل شبيبة :

React هي مكتبة واجهة أمامية تم تطويرها بواسطة Facebook. تم تصميم React Js لإنشاء واجهات مستخدم تفاعلية. يتم استخدامه للتعامل مع طبقة العرض لتطبيقات الويب والجوال. يتيح لنا ReactJS إنشاء مكونات قابلة لإعادة الاستخدام لواجهة المستخدم. إنها حاليًا واحدة من أكثر مكتبات JavaScript شيوعًا ولها أساس قوي ومجتمع كبير وراءها. الآن السبب وراء اختيار رد الفعل على إطار العمل الآخر هو أن التطبيقات التي تم إنشاؤها في React يمكنها التعامل مع التحديثات المعقدة ولا تزال تشعر بالسرعة والاستجابة. ReactJs هو نظام معياري ، فبدلاً من كتابة ملفات كبيرة وكثيفة من التعليمات البرمجية ، يمكننا كتابة ملفات أصغر قابلة لإعادة الاستخدام.
تعمل React بشكل أفضل عندما تكون البرامج الكبيرة التي تعرض الكثير من البيانات المتغيرة. React Js قابلة للتطوير ومرنة.

Ember Js :

Ember.js هو إطار عمل JavaScript مفتوح المصدر من جانب العميل يستخدم لتطوير تطبيقات الويب. يستخدم نمط هندسة MVC (نموذج - عرض - متحكم). في Ember.js ، يتم استخدام المسار كنموذج وقالب للمقود كعرض ووحدة تحكم تتعامل مع البيانات في النموذج.

شبيبة العمود الفقري:

BackboneJS هو إطار عمل JavaScript خفيف الوزن يسمح بتطوير وهيكلة التطبيقات من جانب العميل التي يتم تشغيلها في متصفح الويب. إنه يوفر إطار عمل MVC الذي يلخص البيانات في النماذج ، DOM (نموذج كائن المستند) في العروض ويربط هذين باستخدام الأحداث. يأتي Backbone Js بتبعية واحدة فقط — Underscore.js ، والتي توفر القوالب الأساسية التي ينشئ Backbone.js منها. يعد Backbone.js خفيفًا للغاية ، كما أن مساحة الذاكرة الصغيرة الخاصة به تجعله رائعًا لتطوير تطبيقات ويب ذات صفحة واحدة سريعة وعالية الأداء. بينما يفتقر إلى المزيد من الميزات المتقدمة مثل ربط البيانات ثنائي الاتجاه.

فانتوم شبيبة :

PhantomJS هو متصفح خفيف الوزن بدون رأس مبني على WebKit. يطلق عليه اسم مقطوعة الرأس لأن التنفيذ لا يحدث على المتصفح ولكن على الجهاز. Phantom Js هو الحل لـ:

1. اختبار موقع الويب بدون رؤوس: قم بإجراء اختبارات وظيفية باستخدام أطر مثل Jasmine و QUnit و Mocha و Capybara و WebDriver وغيرها الكثير.
2. التقاط الشاشة: التقاط محتويات الويب برمجيًا ، بما في ذلك SVG و Canvas. إنشاء لقطات موقع مع معاينة الصورة المصغرة.
3. أتمتة الصفحة: الوصول إلى صفحات الويب والتعامل معها باستخدام واجهة برمجة تطبيقات DOM القياسية ، أو باستخدام المكتبات المعتادة مثل jQuery.
4. مراقبة الشبكة: مراقبة تحميل الصفحة وتصديرها كملفات HAR قياسية. أتمتة تحليل الأداء باستخدام YSlow و Jenkins

بابل شبيبة:

Babylon.js هو محرك ثلاثي الأبعاد قائم على WebGL يركز على تطوير اللعبة وسهولة الاستخدام. كمحرك ثلاثي الأبعاد ، فإنه يحتوي على الأدوات اللازمة لإنشاء شبكات وعرضها وتركيبها في الفضاء ، وإضافة مصادر ضوئية وكاميرات. نظرًا لأنه يركز على اللعبة ، فإن Babylon.js لديه بعض الميزات الإضافية التي لا يتطلبها محرك ثلاثي الأبعاد عادي. لديها دعم أصلي لاكتشاف الاصطدام وجاذبية المشهد والكاميرات الموجهة نحو الألعاب (على سبيل المثال ، كاميرا متابعة تتعقب جسمًا متحركًا) ، بالإضافة إلى دعم أصلي لـ Oculus Rift وأجهزة الواقع الافتراضي الأخرى (VR). يحتوي على نظام مكون إضافي لمحرك فيزيائي ، ودعم صوتي أصلي ، ومدير إجراءات يعتمد على إدخال المستخدم وأكثر من ذلك بكثير.

تغليف

الإطار المذكور أعلاه هو أطر عمل شائعة ولكن هناك المزيد من الأطر الموجودة. يعتمد الإطار الأنسب للتطوير على نوع موقع الويب أو تطبيق الويب الذي تقوم بتطويره. على سبيل المثال ، إذا كنا نعمل على تطوير موقع ويب من صفحة واحدة ، فإن Angular Js مفيد لنا لأنه باستخدام Angular Js يمكننا توفير التنقل الكامل وجميع الميزات التي نريد الحصول عليها دون إعادة تحميل الصفحة. كل JavaScript Frameworks لها مزاياها الخاصة.