জাভাস্ক্রিপ্ট কি এবং কিভাবে ব্রাউজারে কাজ করে?

জাভাস্ক্রিপ্ট কি?

জাভাস্ক্রিপ্ট একটি স্ক্রিপটিং প্রোগ্রামিং ল্যাঙ্গুয়েজ যা ওয়েব ডেভেলপমেন্ট এর জন্য ব্যবহার করা হয়। এটি অনেক হাল্কা, বিভিন্ন ক্রস প্লাটফর্ম এ ব্যবহার করা যায় এবং এটি ইন্টারপ্রিটেড কম্পাইলার অথবা just-in-time কম্পাইলড পদ্ধতিতে দ্রুত কোড সম্পাদনা /এক্সিকিউয়েশন করে।  বর্তমানে  জাভাস্ক্রিপ্টকে ক্লায়েন্ট (DOM) এবং সার্ভার (Nodejs) উভয় প্ল্যাটফর্মের ডেভেলপমেন্টের জন্যই ব্যবহার করা যায়।

জাভাস্ক্রিপ্ট ইঞ্জিন কিভাবে গঠিত?

সব প্রোগ্রামিং ল্যাঙ্গুয়েজ এরই কম্পাইলেশনের জন্য নিজস্ব ইঞ্জিন অথবা কম্পাইলেশন প্রসেস আছে, জাভাস্ক্রিপ্ট এর ব্যতিক্রম নয়। জাভাস্ক্রিপ্টের ইঞ্জিন টি একটি কম্পিউটার প্রোগ্রামের মতোই যা কোড গুলোকে interpreted করে এবং execution করে। জাভা স্ক্রিপ্টের অনেকগুলো ইঞ্জিন আছে এর মধ্যে অন্যতম হচ্ছে গুগল ক্রোমের v8 ইঞ্জিনটি। এছাড়াও  মজিলার স্পাইডার মানকি, মাইক্রোসফটের চরকা উল্লেখযোগ্য। আসলে এই জাভাস্ক্রিপ্ট তার যে ইঞ্জিনটি আছে সেটির মাধ্যমে কিভাবে ব্রাউজারে কাজ করে অথবা আমরা বলতে পারি কিভাবে কম্পাইলেশন করে তা জানা প্রয়োজন। পড়ুন কম্পাইলার (Complier) Vs ইন্টারপ্রিটর (Interpreter)

ইঞ্জিনটি দুইটি মূল কাঠামো নিয়ে গঠিত, একটি হচ্ছে মেমোরি হিপ (Memory Heap), আরেকটি হচ্ছে call stack

মেমোরি হিপ

এটি মূলত একটি আন-স্ট্রাকচার্ড ডাটা স্ট্রাকচার যেখানে জাভা স্ক্রিপ্টের সমস্ত ডায়নামিক ডাটাগুলো জমা হয়ে থাকে। ডাটা জমা হওয়ার সাথে সাথেই মেমোরিতে সংযুক্ত (allocate) হয়ে যায়। প্রত্যেকটি ডাটা হিপে খুব সুন্দর ভাবে সাজানো থাকে এবং asynchronous পদ্ধতিতে কাজের সাথে সমন্বয় করে heap থেকে ছাড়া হয়। কোড সম্পাদনা হয়ে গেলেও এ ডাটাগুলো হিপে থেকে যেতে পারে, প্রয়োজন অনুযায়ী গার্বেজ কালেক্ট এর মাধ্যমে সরানো হয়ে থাকে।

Call stack

Call stack - এটিও একটি আন-স্ট্রাকচারড ডাটা স্ট্রাকচার যা মূলত স্ট্রাক এর মূলনীতি লাস্ট ইন ফাস্ট আউট সংক্ষেপে লিফো (LIFO) এই নীতি অনুসরণ করে চলে । এখানে ফাংশন ডেফিনেশন গুলো থাকে এবং এখান থেকেই ফাংশন গুলো এক্সিকিউট হয়ে যায়।

যেভাবে কোড সম্পাদনা/রান হয়

জাভা স্ক্রিপ্ট এর সোর্স কোডগুলো রিড (parsed) করে এবং অ্যাবস্ট্রাক্ট সিনট্যাক্স ট্রিতে (Abstract Syntax Tree) পরিণত করে। স্ক্রিপ্টিং ল্যাঙ্গুয়েজ সাধারণত interpreter এর সাহায্যে কোড সম্পাদনা (execute) করে। প্রাথমিকভাবে জাভাস্ক্রিপ্টের ইঞ্জিনে একটি বেজলাইন কমপাইলার রয়েছে, যা জাভাস্ক্রিপ্ট এর সোর্স কোডকে বাইট কোডে পরিণত করে এবং এই বাইট কোড interpreter এর মধ্যে সেট হয়ে কোড সম্পাদনা হয়। কিন্তু আমরা জানি কম্পিউটার মেশিন কোড (বাইনারি - 0, 1) ছাড়া কিছুই বোঝেনা, তাই এই interpreter কোড গুলোকে মেশিন কোডে পরিণত করে যা মূলত আমাদের কম্পিউটারে রান হয়ে থাকে।

যখন কোড রান হয় তখন একটি রান টাইম environment (runtime environment) তৈরি হয় এবং এই environment কিভাবে কাজ করে তাহলে? একটি জিনিস সবসময় মনে রাখতে হবে যে, জাভাস্ক্রিপ্ট ব্রাউজারের রান টাইম environment এ রান হয়ে থাকে। এসময় জাভাস্ক্রিপ্ট এর ইঞ্জিন, সমস্ত ওয়েব এপিআই এবং একটি কলব্যাক কিউ একত্রে গঠিত হয়।  ওয়েব এপিআই এবং অন্যান্য ফাংশনগুলো ইঞ্জিনে সরবরাহ করা হয়ে থাকে কিন্তু তা আসলে জাভাস্ক্রিপ্ট ল্যাঙ্গুয়েজ এর কোন অংশ না। এতে করে ব্রাউজারে যদি কোন আপডেট থাকে বা পরিবর্তন থাকে তা সংঘটিত হয়, যেমন এপিআই দিয়ে ডেটা কল করা, Dom এ কোন পরিবর্তন করা। 

কলব্যাক কিউতে মূলত যে কল ব্যাক ফাংশনগুলো থাকে তা এক্সিকিউট করা হয় এবং এক্ষেত্রে কিউ এর যে মূল ধারণা ফাস্ট ইন ফাস্ট আউট (FIFO) অনুসরণ করা হয়।

অপটিমাইজেশন

আমরা উপরে একটি বিষয় খেয়াল করি, অপটিমাইজেশন একটি বিষয় আছে। মূলত interpreter এ যখন কোড রান হয় তা আসলে লাইন বাই লাইন কোড ধরে হয়, যা মূলত খুবই ধীরগতির প্রক্রিয়া। কিন্তু কম্পাইলেশন আবার খুব দ্রুত হয়ে থাকে। যে কারণে জাভাস্ক্রিপ্ট এই দুটো জিনিসকেই একত্রে একই সময়ে ঘটিয়ে থাকে দ্রুত কাজ করার জন্য, যাকে আমরা বলি just-in-time কম্পাইলেশন।