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

ما هو CommonJS؟

CommonJS عبارة عن مجموعة من المعايير المستخدمة لتنفيذ الوحدات النمطية في JavaScript من جانب الخادم، وخاصة بيئات Node.js. في هذا النظام، يتم تحميل الوحدات بشكل متزامن، مما يعني حظر تنفيذ البرنامج النصي حتى يتم تحميل الوحدة. يؤدي هذا إلى اتباع نهج مباشر، ولكن الجانب السلبي هو الأداء السيئ إذا كنت تحاول التحميل في مجموعة من الوحدات المختلفة حيث سيتعين عليها تحميل واحدة تلو الأخرى قبل تشغيل أي شيء آخر.

عند استخدام CommonJS، يمكنك استخدام Module.exports لتصدير الوظائف واستخدام require() لاستيرادها.

إليك مثال لما سيبدو عليه في التعليمات البرمجية.

// In file multiple.js

module.exports = function multiply(x, y) {
    return x * y;
};

// In file main.js

const multiply = require(‘./multiply.js’);

console.log(multiply(5, 4)); // Output: 20

ما هو ECMAScript (ES6)؟

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

إليك نفس المثال من قبل ولكن هذه المرة نستخدم الاستيراد والتصدير.

// In file multiply.js

export const multiply = (x, y) => x * y;

// In file main.js

import { multiply } from ‘./multiply.js’;

console.log(multiply(5, 4)); // Output: 20

الاختلافات الرئيسية: تتطلب الاستيراد مقابل

require() جزءًا من نظام وحدة CommonJS بينما يعد الاستيراد جزءًا من نظام وحدة ES6. ستشاهد استخدام require()‎ في بيئات Node.js للتطوير من جانب الخادم، خاصة في المشاريع القديمة التي لم تعتمد ES6 حتى الآن. ستشاهد استخدام الاستيراد في كل من تطوير جانب الخادم والواجهة الأمامية، وخاصة المشاريع الأحدث ومع أي من أطر عمل الواجهة الأمامية مثل React أو Vue.

لماذا يعتبر الاستيراد أفضل من الطلب؟

كما ذكرنا سابقًا، الاستيراد غير متزامن، مما قد يؤدي إلى أداء أفضل، خاصة في التطبيقات الكبيرة. بالإضافة إلى ذلك، نظرًا لإمكانية تحليل الاستيراد بشكل ثابت، يمكن لأدوات مثل أدوات الفرز والمجمعات تحسين التعليمات البرمجية بشكل أكثر فعالية وتنفيذ اهتزاز الشجرة مما يؤدي إلى أحجام حزم أصغر وأوقات تحميل أسرع. كما أن بناء الجملة أسهل في القراءة ثم require()‎ مما يوفر تجربة أفضل للمطورين، ونحن جميعًا نريد ذلك!

متى ستستخدمه يتطلب استيراد Vs

يمكنك استخدام require() عندما:

• أنت تعمل على مشروع Node.js القديم الذي بدأ قبل ظهور ES6 ولم يتم تحديثه.

• تحتاج إلى تحميل الوحدات ديناميكيًا في وقت التشغيل، كما هو الحال في ملف التكوين، أو إذا كنت بحاجة إلى تحميل الوحدات بشكل مشروط.

يمكنك استخدام الاستيراد عندما:

• في أي وقت آخر لأن هذا هو المعيار الآن وأكثر كفاءة.

ملخص

بشكل عام، يوصى باستخدام الاستيراد كلما أمكن ذلك، لأنه يوفر المزيد من الفوائد وهو نظام الوحدات الأحدث والأكثر اعتماداً على نطاق واسع. ومع ذلك، قد تكون هناك حالات حيث لا يزال require() هو الخيار الأفضل، اعتمادًا على متطلباتك المحددة والبيئة التي تعمل فيها.

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