RequireJS এর জন্য Advanced Configuration Options

RequireJS একটি শক্তিশালী JavaScript মডিউল লোডার, যা কোড মডিউলারিটির জন্য AMD (Asynchronous Module Definition) প্যাটার্ন ব্যবহার করে। এটি অ্যাসিঙ্ক্রোনাস মডিউল লোডিং, ডিপেনডেন্সি ম্যানেজমেন্ট, এবং স্ক্রিপ্ট বন্ডলিংয়ের জন্য ব্যবহৃত হয়। RequireJS-এর কিছু Advanced Configuration Options আছে যা আপনার অ্যাপ্লিকেশন কনফিগারেশন এবং পারফরম্যান্স অপটিমাইজেশনে সাহায্য করতে পারে।

নিচে RequireJS এর জন্য কিছু Advanced Configuration Options আলোচনা করা হলো:

1. baseUrl:

baseUrl অপশন দিয়ে আপনি মডিউল লোড করার জন্য একটি বেস ডিরেক্টরি নির্ধারণ করতে পারেন। এটি স্ক্রিপ্ট ফাইলের রুট পাথ নির্ধারণ করে এবং আপনার মডিউল ফাইলের জন্য এই পাথ ব্যবহৃত হয়।

Usage:

require.config({
  baseUrl: 'js/lib' // Set base directory for all modules
});

এটি সব মডিউল লোড করার জন্য js/lib ডিরেক্টরিকে বেস ডিরেক্টরি হিসেবে ব্যবহার করবে।

2. paths:

paths অপশন দিয়ে আপনি মডিউলগুলোর পাথ কনফিগার করতে পারেন, যাতে RequireJS আপনার মডিউলগুলোকে নির্দিষ্ট অবস্থান থেকে খুঁজে পায়। আপনি এখানে মডিউল নামের সাথে পাথ কনফিগার করতে পারেন।

Usage:

require.config({
  paths: {
    'jquery': 'libs/jquery.min',
    'underscore': 'libs/underscore'
  }
});

এটি jquery এবং underscore মডিউলগুলোর জন্য নির্দিষ্ট পাথ প্রদান করবে।

3. shim:

কিছু পুরানো লাইব্রেরি বা স্ক্রিপ্ট, যেগুলি AMD স্টাইলে মডিউল তৈরি করে না, সেগুলো লোড করতে shim ব্যবহার করা হয়। shim কনফিগারেশন ব্যবহার করে আপনি non-AMD স্ক্রিপ্টগুলোকে RequireJS এর মাধ্যমে লোড করতে পারবেন।

Usage:

require.config({
  shim: {
    'jquery': {
      exports: '$' // Specify global variables exported by the script
    },
    'underscore': {
      deps: ['jquery'],
      exports: '_'
    }
  }
});

এখানে, jquery এবং underscore মডিউলগুলোর জন্য exports এবং deps সঠিকভাবে কনফিগার করা হয়েছে।

4. urlArgs:

এটি cache busting এর জন্য ব্যবহৃত হয়। ডেভেলপমেন্টে নতুন স্ক্রিপ্ট বা ফাইল লোড হলে ব্রাউজার পুরানো স্ক্রিপ্ট কেচে রাখতে পারে, কিন্তু আপনি চাইলে URL প্যারামিটার যোগ করে এই সমস্যা এড়াতে পারেন।

Usage:

require.config({
  urlArgs: "bust=" + (new Date()).getTime()
});

এটি স্ক্রিপ্ট ফাইলের URL-এ একটি টাইমস্ট্যাম্প যুক্ত করবে, যা ক্যাশে সমস্যা এড়াবে এবং ব্রাউজার সর্বশেষ স্ক্রিপ্ট লোড করবে।

5. config:

এই অপশনটি দিয়ে আপনি কাস্টম কনফিগারেশন ডাটা একটি নির্দিষ্ট মডিউলের জন্য পাস করতে পারেন। এটি মডিউলটির কনফিগারেশন ডেটা সরাসরি পাস করতে ব্যবহৃত হয়।

Usage:

require.config({
  config: {
    'module1': {
      option1: true,
      option2: 'value'
    }
  }
});

এখানে module1 মডিউলটি কনফিগারেশনের মাধ্যমে কিছু কাস্টম অপশন পাবে।

6. map:

map অপশনটি ডিপেনডেন্সি গুলোর উপর কাজ করে এবং আপনি এতে মডিউলগুলোকে নতুন নাম/পথে ম্যাপ করতে পারেন।

Usage:

require.config({
  map: {
    '*': {
      'module1': 'newModule1'
    }
  }
});

এটি module1 কে newModule1 নাম দিয়ে ম্যাপ করবে, অর্থাৎ যখন module1 লোড হবে, তখন আসলে newModule1 লোড হবে।

7. deps:

deps অপশনটি দিয়ে আপনি একটি মডিউল লোড হওয়ার আগে অন্য মডিউলগুলো লোড করতে পারেন। এটি একটি অ্যারের মাধ্যমে নির্দিষ্ট করে দেয় যে কোন মডিউলগুলো আগে লোড হবে।

Usage:

require.config({
  deps: ['module1', 'module2'], // Define dependencies to load first
  callback: function() {
    console.log('Modules are loaded');
  }
});

এটি module1 এবং module2 লোড হওয়ার পর, ক্যালব্যাক ফাংশনটি চালু করবে।

8. waitSeconds:

এই অপশনটি স্ক্রিপ্ট লোডের জন্য অপেক্ষা করার সময় সীমা নির্ধারণ করে। যদি একটি মডিউল নির্ধারিত সময়ের মধ্যে লোড না হয়, তাহলে এটি একটি ত্রুটি দেখাবে।

Usage:

require.config({
  waitSeconds: 15 // Wait 15 seconds before timing out
});

এটি নির্দেশ করে যে স্ক্রিপ্টটি 15 সেকেন্ডের মধ্যে লোড না হলে একটি ত্রুটি দেখাবে।

9. callback:

callback অপশনটি ব্যবহার করে আপনি যখন সব মডিউল লোড হবে, তখন একটি কাস্টম ক্যালব্যাক ফাংশন চালু করতে পারেন। এটি মডিউল লোড শেষ হলে এক্সিকিউট হবে।

Usage:

require.config({
  callback: function() {
    console.log('All modules are loaded');
  }
});

এটি সমস্ত মডিউল লোড হওয়ার পর একটি কাস্টম ফাংশন চালু করবে।

10. scriptType:

এই অপশনটি <script> ট্যাগের type অ্যাট্রিবিউট নির্ধারণ করে। সাধারণত application/javascript ব্যবহৃত হয়, তবে আপনি এর মান পরিবর্তন করতে পারেন।

Usage:

require.config({
  scriptType: 'text/javascript'
});

এটি স্ক্রিপ্ট ট্যাগের টাইপ নির্ধারণ করে এবং মডিউল লোড করার জন্য ব্যবহৃত হবে।

11. jsonp:

যখন আপনি cross-domain মডিউল লোড করতে চান, তখন JSONP অপশন ব্যবহার করা হয়। এটি আপনার অ্যাপ্লিকেশনকে বিভিন্ন ডোমেইন থেকে মডিউল লোড করতে সাহায্য করে।

Usage:

require.config({
  jsonp: true // Enable JSONP support for cross-domain loading
});

এটি JSONP সাপোর্ট সক্ষম করে এবং cross-domain মডিউল লোডিংকে সক্ষম করে।

12. onError:

onError হ্যান্ডলার ব্যবহার করা হয় যখন কোনো মডিউল লোড করার সময় ত্রুটি ঘটে। আপনি এটি দিয়ে লোডিং ত্রুটি হ্যান্ডল করতে পারেন এবং কাস্টম এরর মেসেজ দেখাতে পারেন।

Usage:

require.config({
  onError: function(err) {
    console.error('Error loading module:', err);
  }
});

এটি মডিউল লোড না হলে ত্রুটি ধরে এবং কাস্টম এরর মেসেজ দেখাবে।

RequireJS এর Advanced Configuration Options আপনাকে আপনার অ্যাপ্লিকেশনকে আরও কার্যকরী এবং স্কেলেবেল করতে সাহায্য করে। উপরের কনফিগারেশন অপশনগুলোর মাধ্যমে আপনি:

1. মডিউল পাথ কনফিগার করতে পারেন,
2. Non-AMD স্ক্রিপ্ট কনফিগার করতে পারেন,
3. Lazy loading, cache busting, deps, shim এবং jsonp এর মতো গুরুত্বপূর্ণ অপশন ব্যবহার করতে পারেন,
4. অ্যাপ্লিকেশন ডিপেনডেন্সি ম্যানেজমেন্ট এবং মডিউল লোডিং আরও অপটিমাইজ করতে পারেন।

এই কৌশলগুলো আপনাকে বৃহত্তর এবং জটিল অ্যাপ্লিকেশন তৈরি করতে সাহায্য করবে এবং কোড ম্যানেজমেন্ট সহজ করবে।