اختيار إطار عمل JavaScript الأمثل لمشروع جديد يمكن أن يكون عملية صعبة ومرهقة. ففي كل سنة تظهر إطارات جديدة تكتسب شعبية بين المطورين، والإطارات الأخرى السابقة لا يبدو أنها تفقد بريقها هي أيضًا!

ومع ذلك، من الضروري أن تعثر على المنصة الملائمة لتطبيقك. قد لا تكون الشعبية وحدها مؤشرًا كافيًا لتحديد إطار العمل الأفضل، ولكنّ إلقاء نظرة على الاطارات الأكثر شعبية قد يمنحك فكرة أولية عن الخيار الذي يناسب متطلبات مشروعك. في هذه المقالة، سنلقي نظرة على إطارات عمل JavaScript الأكثر شيوعًا لعام 2019!

React.js

React هو إطار عمل تم إنشاؤه، وتتم صيانته، من قِبل Facebook. هذا الإطار مناسب لبناء المواقع الكبيرة والقابلة للتوسيع. كما يتميز بالاستقرار والثبات مقارنة بالعديد من الإطارات الجديدة.

نقاط يجب مراعاتها:

• تتولى فيسبوك صيانة هذا المشروع
• الانتشار الكبير والنمو المستمر لهذا الإطار يعني أنه سيكون من السهل العثور على مطور React مؤهل، إضافة إلى المكوِّنات الخارجية، والمساعدة والدعم.
• يسمح اعتماد صياغة JSX بهيكلة المُكوِّنات التي ستُصرَّف (compile) إلى JS React. ويُمكن عند تشغيلها على الخادم أن تحسّن السيو (SEO) الخاص بصفحات الويب بشكل أفضل من إطارات جافاسكريبت الأخرى، إذ أنّ الشيء الوحيد الذي يراه العميل في تلك المرحلة هو صفحات HTML المُنشأة.
• يمكن لـ React Native أن يوفر تجربة استخدام سلسة على الهواتف، إلى جانب تطبيقات الويب.

تقييمي لإطار العمل React.js

React إطارُ عمل رائع، وأداة عظيمة. فبالنسبة للمشاريع الكبيرة والشاملة، فإنه الخيار الأمثل. بيْد أنّ ما يقلقني كمطور يعتمد على React، هو الشيء نفسه الذي يجعل نجاحًا ساحقًا، وهو Facebook. فهناك مخاوف بشأن شروط استخدام React، وكذلك إمكانية أن توقف Facebook التحديثات، أو تُغيّر الترخيص. قد يرى البعض أنّي أبالغ، وأنّ هذه المخاوف ليست كافية للتوقف عن استخدام هذا الإطار، ولكن بالنسبة لمطورين آخرين، فقد يكون هذا السبب كافيًا ليتجنبوا استخدام React كإطار عمل أمامي.

في عام 2019، حصل React على أعلى درجات الرضى من قبل المطورين. ما يجعل React أحد أفضل الإطارات للمطورين في عام 2019.

Angular.js 2

Angular لا يقل في الشهرة والذيوع عن React، حيث يُعد من أكثر إطارات عمل JavaScript استخدامًا. لقد استغرق الإطار Angular 2+‎ سنوات من التطوير، فقد تعلم المطورون الكثير من الدروس من Angular.js، والتي ساعدت في تطوير الإصدار Angular 2، والإصدارات المستقبلية.

نقاط يجب مراعاتها:

• يستخدم إطار العمل Angular لغة البرمجة TypeScript، وهي مجموعة شاملة (superset) من JavaScript يمكن تصريفها (compile) إلى Vanilla JS. يجد الكثيرون أنّ هذه الميزة تعطي Angular أفضلية كبيرة.
• التصيير المسبق (Pre-rendering) للمحتوى على الخادم يمكن أن يؤدي إلى تحسين محركات البحث، وتحسين سرعة التصفح.
• Angular هو خلاصة سنوات من الخبرة، من Angular إلى Angular 2 وما بعدهما.
• Angular 2 غني بالميزات المفيدة، مثل إدراج التبعيات (dependency injection)، والقوالب، والنماذج، والمزيد.
• نظرًا لأنّ Google تشرف بنفسها على صيانة Angular، فهذا يجعل المستخدمين يشعرون بالثقة بأنّ هذا الإطار سيستمر لفترة طويلة.

تقييمي للإطار Angular.js 2

تقييمي للإطار Angular 2 يشبه إلى حد بعيد تقييمي للإطار React. إن كنت تريد منصة كبيرة وغنية بالميزات، فيُعد Angular 2 خيارً مثاليا. هناك الكثير من المحتويات المفيدة هنا. بالمقابل، سيكون عليك التعامل مع ضخامة هذه المنصة، وحقيقة أنّ صيانتها تقع على عاتق شركة قوية مثل جوجل، التي، من الناحية النظرية، يمكن أن توقف دعمها له في أي وقت، على الرغم من أن هذا يبدو مستبعدًا للغاية.

Vue.js

بعد مُضِيِّ سنوات على إطلاقه، صار إطار العمل Vue ناضجًا ومتكاملًا، ولكن لا يزال الكثيرون ينظرون إليه كلاعب جديد في المشهد. كما أنّ نمو مجتمع مستخدميه سريع وهائل.

نقاط يجب مراعاتها:

• يتميز إطار العمل Vue بصِغَر حجمه، مما يسهل تضمينه في المشاريع دون الخوف من إبطائها.
• تعلُّم Vue أسهل نسبيًا من تعلم بعض الإطارات الأخرى الأكبر، كما يتوفر الإطار على توثيق رائع لمساعدة الأشخاص الذين ليست لهم خبرة في إطارات عمل JS، والمحترفين على حد سواء.
• من السهل إدماجه في التطبيقات ولغات البرمجة الأخرى. على سبيل المثال، Vue.js يندمج مع Laravel بسلاسة لإنشاء واجهات أمامية لتطبيقات Laravel.
• يستخدم Vue صياغة تستند إلى HTML، مما يسمح للمطورين بكتابة المكونات بسرعة وسهولة.

تقييمي للإطار Vue.js

لقد أحببت Vue دائما. أنا أوصي به للأشخاص الذين بدأوا للتو في استخدام إطارات عمل JavaScript، أو الذين يحتاجون إلى إطار خفيف لمشروع معين. لا يحتوي دائمًا على كل الميزات والخصائص التي يملكها بعض المنافسين الأكبر، لكنك لا تحتاجها دائمًا. ميزاته أٌقل، وهذا يعني أيضا أنه أقل تقييدا للمطورين.

Meteor.js

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

نقاط يجب مراعاتها:

• كما قلنا من قبل Meteor هو إطار متكامل، ما يتيح للمطورين استخدامه لبناء كل جوانب تطبيقاتهم. كما أنه خيار جيد للمطورين الجدد الذين يبحثون عن وظائف في مشاريع متكاملة، حيث يُمكِّنهم Meteor من تسريع وتحسين إنتاجيتهم.
• يأتي Meteor مع مجموعة متنوعة من "الحزم الذكية" المفيدة والمتاحة لجميع أنواع الاستخدامات، ويسمح بإدراج حزم مخصصة (custom packages) لأولئك الذين يرغبون في إنشاء حزم خاصة بهم.
• مجتمع Meteor نشط للغاية ومتفاعل، ويوفر الدعم والمساعدة في المنتديات، وينشئ ويصون حزمًا متاحة للجميع.

تقييمي للإطار Meteor.js

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

Ember.js

يركز إطار العمل Ember.js على إنجاز الأمور بسرعة وفعالية. إطار العمل Ember إطار موجّه، إذ يوجّه المطورين للعمل وفق أفضل الممارسات. هذا يسهّل البدء في المشاريع، ولكن البعض قد لا يحب تلك القيود. كما يوفر العديد من الأدوات الخارجية لمساعدة المطورين.

نقاط يجب مراعاتها:

• اعتماد Ember على أفضل الممارسات يسهّل عملية التطوير - طالما كنت على استعداد للعمل وفق طريقة Ember. إن لم تكن مستعدا لذلك، فقد لا يكون Ember الأداة المناسبة لمشروعك.
• تفتح حزمة أدوات سطر الأوامر "ember-cli" عالما جديدًا من الأدوات المفيدة للمطورين.
• تسهل أداة Ember Inspector عملية استقصاء (inspection) كائنات Ember في المتصفح. يمكن استخدام ذلك أثناء التطوير، أو أثناء تصحيح الأخطاء.

تقييمي للإطار Ember.js

Ember.js أداة رائعة لجعل تطبيقك يدخل بسرعة في مرحلة الإنتاج، وكذلك التعامل مع المشاكل، واستكشاف الأخطاء وإصلاحها. إنه ليس الإطار الوحيد الذي يحتوي على إضافة للاستقصاء، أو واجهة سطر أوامر (CLI)، لكنه يتميز، بالإضافة إلى أساليبه الصارمة، بالفعالية وتوفير تجربة تطوير سريعة ورائعة.

Backbone.js

إطار العمل Backbone موجود منذ فترة طويلة (منذ بدايات إطارات عمل JavaScript)، ولكنه لا يزال سائدًا وذا شعبية جارفة، سواء في التطبيقات القديمة، أو في المشروعات الحديثة التي تحتاج إلى إطارات عمل أو مكتبات أبسط وأقل تقييدًا.

نقاط يجب مراعاتها:

• إنّ نضج وعراقة هذه المنصة يعني أنه قد تم تمحيصها، ورصد العديد من مشاكلها وحلها، وأن موارد المجتمع ودعمه ممتازان.
• يعتمد Backbone بنية عمل واسعة وغير مقيدة. كما أنه خفيف جدًّا، فحجمه أصغر من معظم الإطارات في هذه القائمة. كما أنه يوفر هيكلًا مجردًا، مما يسمح للمطورين ببناء ما يحتاجون إليه بسهولة.
• لا يفرض أي محرك قوالب (templating engine)، ويترك ذلك للمطور. ومع ذلك، فإنّه يعتمد على Underscore كتبعية (dependency)، مما يجعله القالب الافتراضي الأسهل.

تقييمي للإطار Backbone.js

شعبية Backbone آخذه في التراجع، ربما بسبب قدمه وبساطته، لكنه لا يزال أداة قوية إن استُخدِم في الأوجه الصحيحة. من السهل العمل به، وإذا كنت تريد إطار عمل يتيح لك إنشاء تطبيقك بالطريقة التي تراها مناسبة، مع تزويدك بنواة أساسية للبناء عليها، فإن Backbone يعد اختيارًا ممتازًا.

Aurelia.js

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

نقاط يجب مراعاتها:

• يوفر Aurelia تجربة حديثة لتطوير التطبيقات، حيث توفر بنيته التحتية المعيارية للمطورين العديد من الخيارات المفيدة، ولكن دون تقييدهم.
• تعلم Aurelia سهل نسبياً، مما يتيح للمطورين فرصة تسريع عملية التطوير وتحسين إنتاجيتهم.
• يتم استخدام بنية MV*‎ مبسَّطة، كما أنه سهل الإعداد. قد يبدو في هذا تقييدًا لبعض المطورين، لكن الكثير منهم يرحبون بالتبسيط الناتج عنه.
• دعم ES5 و ES 2015 و ES 2016 و TypeScript يمنح للإطار Aurelia إمكانية استخدامه في عدة مجالات تطويرية بلغة JavaScript.

تقييمي للإطار Aurelia.js

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

Polymer

اPolymer هو إطار عمل خفيف تدعمه Google، تقوم فلسفته على التركيز على الامتثال للمعايير القياسية.

نقاط يجب مراعاتها:

• كما هو الحال مع الأُطُر الأخرى التي تشرف عليها الشركات الكبرى، فإن حقيقة كون Google تصون وتشرف على Polymer هو أمر جيد في الغالب. هذا يعني أنه سيحصل على الدعم والتطوير المستمر، لكن بالمقابل قد يتردد البعض في استخدام إطار يعتمد ويخضع لشروط عملاق التكنولوجيا جوجل.
• يساعد التركيز على التوافق مع المعايير القياسية على ضمان طول عمر التطبيق، وكذلك التوافق مع مختلف التطبيقات والمنصات الأخرى.
• تتوافق Polymer بشكل جيد مع تطبيقات الويب التقدمية (Progressive Web Apps)، التي تعد موضع تركيز متزايد من قبل المطورين، الذين يسعون إلى ربط تجربة الهاتف المحمول بتجربة مستخدمي برامج سطح المكتب.
• Polymer يتميز أيضا بكونه خفيفًا، مما يجعل وقت تحميله أقصر بكثير من الإطارات الأكبر.

تقييمي للإطار Polymer.js

يوفر Polymer بديلاً ممتازًا لأولئك الذين يريدون إطارًا أخف وأسرع، وأكثر تكاملاً، ومدعومًا من قبل لاعب كبير في مجال تكنولوجيا الويب. فمع وقوف Google وراءه، يمكن أن يحصل Polymer.js على حصة سوقية أكبر بكثير من حصته الحالية، مع الحفاظ على خفته وبساطته أمام منافسيه الأقدم.

Mithril.js

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

نقاط يجب مراعاتها

• بحجم يقارب 8kb (مضغوطًا)، يُعد Mithril أحد أخف إطارات العمل الموجودة حاليا، مما يتيح تحميلًا سريعا جدا.
• يوفر Mithril مجموعة ممتازة من الأدلة والمستندات للبدء، ويُقدّر البعض بأنه يمكن للمطور أن يبدأ العمل عليه في غضون عشر دقائق فقط.
• لقد قام مطوروا Mithril بالتخلي عن الكثير من الميزات الكمالية لأجل الوصول إلى هذا الحجم. حيث يرشدونك إلى كيفية القيام بالاستيثاق (authentication)، وتحميل الملفات، واستخدام ES6 أو JSX - وهي ميزات سيحتاجها جزء كبير من المستخدمين.

تقييمي للإطار Mithril.js

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

استنتاج

السؤال الآن هو: أيٌّ من إطارات JavaScript التي عرضناها في الأعلى أفضل لمشروعي؟ الجواب، بالطبع، معقد. خياري الشخصي المفضل هو Vue.js. رغم أنه متعلق بالمشروع (project-specific).

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