CommonJS এবং ES মডিউল এর মধ্যে পার্থক্য

BabelJS এর কনফিগারেশন - বেবেলজেএস (BabelJS) - Web Development

332

JavaScript এ মডিউল ব্যবস্থাপনা দুটি প্রধান ধরনের রয়েছে: CommonJS এবং ES মডিউল (ECMAScript Modules)। প্রতিটি মডিউল সিস্টেম আলাদাভাবে কোডের পুনঃব্যবহারযোগ্যতা এবং কোডের ভাগ করার পদ্ধতি নির্ধারণ করে। এখানে CommonJS এবং ES মডিউল এর মধ্যে প্রধান পার্থক্যগুলো আলোচনা করা হয়েছে।


১. প্রবর্তন (Introduction)

  • CommonJS: এটি Node.js এর জন্য প্রথম তৈরি করা হয়েছিল এবং এটি সিঙ্ক্রোনাস (synchronous) মডিউল লোডিং সিস্টেম ব্যবহার করে। মূলত এটি server-side JavaScript এর জন্য ব্যবহৃত হয়।
  • ES মডিউল (ECMAScript Modules): এটি ECMAScript 2015 (ES6) এর অংশ হিসেবে স্ট্যান্ডার্ডাইজড হয়েছে এবং অ্যাসিনক্রোনাস (asynchronous) মডিউল লোডিং সিস্টেম ব্যবহার করে। এটি ক্লায়েন্ট-সাইড এবং সার্ভার-সাইড উভয় জায়গায় ব্যবহৃত হতে পারে।

২. সিনট্যাক্স (Syntax)

CommonJS

CommonJS মডিউল সিস্টেমে মডিউলগুলোকে require() এবং module.exports ব্যবহার করে ইমপোর্ট এবং এক্সপোর্ট করা হয়।

  • ইমপোর্ট: require()
  • এক্সপোর্ট: module.exports
উদাহরণ: CommonJS

myModule.js

// মডিউল এক্সপোর্ট
module.exports = function greet(name) {
  console.log(`Hello, ${name}!`);
};

main.js

// মডিউল ইমপোর্ট
const greet = require('./myModule');
greet('World');

ES মডিউল (ESM)

ES মডিউল সিস্টেমে import এবং export কিওয়ার্ড ব্যবহার করা হয়। এটি একটি আধুনিক, প্রমিসড মডিউল সিস্টেম।

  • ইমপোর্ট: import
  • এক্সপোর্ট: export
উদাহরণ: ES মডিউল

myModule.js

// মডিউল এক্সপোর্ট
export function greet(name) {
  console.log(`Hello, ${name}!`);
}

main.js

// মডিউল ইমপোর্ট
import { greet } from './myModule';
greet('World');

৩. লাদিং (Loading) টাইম

  • CommonJS: CommonJS মডিউল সিস্টেম সিঙ্ক্রোনাস (synchronous) লোডিং ব্যবহার করে, অর্থাৎ, মডিউলগুলি ততক্ষণে লোড হয় না যতক্ষণ না সেগুলো ব্যবহার করা না হয়। এটি সাধারণত সার্ভার সাইডে ব্যবহৃত হয় যেখানে মডিউলগুলি সাধারণত ডিস্ক থেকে দ্রুত লোড হয়।
  • ES মডিউল: ES মডিউল সিস্টেম অ্যাসিনক্রোনাস (asynchronous) লোডিং সমর্থন করে, যেহেতু মডিউলগুলিকে ব্রাউজারে নেটওয়ার্ক থ্রুপুট বা সার্ভার রেসপন্স টাইমের জন্য অপেক্ষা করতে হতে পারে। এই কারণে, ES মডিউলগুলো সাধারণত ওয়েব ব্রাউজার এবং আধুনিক JavaScript পরিবেশে ব্যবহৃত হয়।

৪. ডাইনামিক ইমপোর্ট (Dynamic Import)

  • CommonJS: CommonJS মডিউল সিস্টেমে ডাইনামিক ইমপোর্ট করার কোনো ধারণা নেই। মডিউলগুলি সাধারণত require() এর মাধ্যমে সিঙ্ক্রোনাসভাবে ইমপোর্ট করা হয়।
  • ES মডিউল: ES মডিউল সিস্টেমে ডাইনামিক ইমপোর্ট সমর্থিত, যার মাধ্যমে মডিউলগুলো রানটাইমে প্রয়োজনে লোড করা যায়। এটি import() ফাংশনের মাধ্যমে করা হয়।
উদাহরণ: ডাইনামিক ইমপোর্ট
// ডাইনামিক ইমপোর্ট
import('./myModule.js').then(module => {
  module.greet('World');
});

৫. লুপ/ডিপেনডেন্সি (Circular Dependencies)

  • CommonJS: CommonJS সিস্টেমে circular dependencies এর ক্ষেত্রে কিছু সমস্যার সৃষ্টি হতে পারে। যখন মডিউল A মডিউল B এর ওপর নির্ভরশীল এবং মডিউল B মডিউল A এর ওপর নির্ভরশীল হয়, তখন একে একে লোড হতে সময় নিতে পারে।
  • ES মডিউল: ES মডিউল সিস্টেমে circular dependencies সাধারণত সমস্যা তৈরি করে না, কারণ এটি স্ট্যাটিকলি লোড হয় এবং এটির ইন্টারনাল ডিপেনডেন্সি রেজল্যুশন আরো সঠিকভাবে পরিচালিত হয়।

৬. সাপোর্ট এবং কম্প্যাটিবিলিটি (Support and Compatibility)

  • CommonJS: এটি মূলত Node.js পরিবেশে ব্যবহৃত হয়, যদিও কিছু ব্রাউজারও এটি সাপোর্ট করে, তবে পুরোপুরি ব্রাউজারে কাজ করার জন্য আরো প্যাকেজ বা ট্রান্সপাইলার যেমন Browserify বা Webpack এর প্রয়োজন হয়।
  • ES মডিউল: ES মডিউল ব্রাউজার এবং Node.js উভয় জায়গায় সাপোর্ট করা হয় (Node.js 12 এবং পরবর্তী সংস্করণ থেকে)। আধুনিক JavaScript পরিবেশে এটি ব্যবহৃত হয় এবং এতে কোনো অতিরিক্ত টুল বা প্যাকেজের প্রয়োজন হয় না।

৭. মডিউল ফাইল এক্সটেনশন

  • CommonJS: সাধারণত .js এক্সটেনশন ব্যবহার করা হয়।
  • ES মডিউল: ES মডিউল ফাইলের জন্য .mjs এক্সটেনশন ব্যবহৃত হয়, তবে যদি আপনি type: "module" কনফিগারেশন ব্যবহার করেন, তাহলে .js ফাইলও ES মডিউল হিসেবে কাজ করতে পারে।

৮. টপ-লেভেল ওয়্যার (Top-Level Await)

  • CommonJS: CommonJS মডিউল সিস্টেমে top-level await এর সাপোর্ট নেই, অর্থাৎ await শুধুমাত্র অ্যাসিনক্রোনাস ফাংশনের ভিতরে ব্যবহার করা যায়।
  • ES মডিউল: ES মডিউল সিস্টেমে top-level await সমর্থিত, অর্থাৎ await কোডের যে কোনো জায়গায় (যদি এটি একটি ES মডিউল হয়) ব্যবহার করা যেতে পারে।

৯. মডিউল এক্সপোর্টের ধরন (Module Export Types)

  • CommonJS: CommonJS এক্সপোর্টের জন্য module.exports বা exports ব্যবহার করা হয়। এটি কোনো একটি একক মান বা অবজেক্ট এক্সপোর্ট করতে পারে।

    module.exports = function greet(name) {
      console.log(`Hello, ${name}`);
    };
    
  • ES মডিউল: ES মডিউল এক্সপোর্টের জন্য export এবং export default ব্যবহৃত হয়। default এক্সপোর্ট করা হলে, একটি মডিউল থেকে একটিই ডিফল্ট এক্সপোর্ট করা যেতে পারে।

    // Named Export
    export function greet(name) {
      console.log(`Hello, ${name}`);
    }
    
    // Default Export
    export default function greet(name) {
      console.log(`Hello, ${name}`);
    }
    

সারাংশ

বৈশিষ্ট্যCommonJSES মডিউল (ESM)
লোডিং টাইমসিঙ্ক্রোনাস (Synchronous)অ্যাসিনক্রোনাস (Asynchronous)
ইমপোর্ট এবং এক্সপোর্টrequire() এবং module.exportsimport এবং export
ডাইনামিক ইমপোর্টসমর্থিত নয়import() মাধ্যমে সমর্থিত
সাপোর্টNode.js এর জন্য তৈরিব্রাউজার এবং Node.js উভয় জায়গায় সাপোর্ট
ফাইল এক্সটেনশন.js.mjs (বা .js যদি type: "module" ব্যবহার করা হয়)
টপ-লেভেল awaitসমর্থিত নয়সমর্থিত

CommonJS প্রধানত Node.js এর জন্য ব্যবহৃত হয় এবং এটি সিঙ্ক্রোনাস মডিউল লোডিং ব্যবহার করে, যেখানে ES মডিউল আধুনিক JavaScript স্ট্যান্ডার্ড যা অ্যাসিনক্রোনাস লোড

িং সমর্থন করে এবং ব্রাউজার ও Node.js উভয় পরিবেশেই ব্যবহার করা যায়।

Content added By
Promotion

Are you sure to start over?

Loading...