DEV Community

Cover image for JavaScript Deep Dive Series – Part 1: JS Engine & Runtime 🚀
Md Nazmus Shakib
Md Nazmus Shakib

Posted on

JavaScript Deep Dive Series – Part 1: JS Engine & Runtime 🚀

This topic helps you understand how JavaScript actually runs behind the scenes.

আমরা প্রতিদিন JavaScript নিয়ে কাজ করি। কিন্তু যে ভাষা দিয়ে এত কাজ করি, সেটাকে যদি ভেতর থেকে না জানি তাহলে কি ঠিক হয়? সেই চিন্তা থেকেই শুরু করলাম JavaScript Deep Dive Series। চলুন ধীরে ধীরে JavaScript-এর ভেতরের মেকানিজমগুলো বুঝে নেওয়া যাক।

JavaScript Engine কী?
JavaScript-এর আসল কাজ করে JavaScript Engine নামের একটি প্রোগ্রাম।
এর মূল কাজ হলো:
JavaScript code read করা
code compile করা
এবং শেষ পর্যন্ত execute করা

কিন্তু এখানে একটা মজার ব্যাপার আছে। Browser নিজে কিন্তু JavaScript language বুঝতে পারে না। তাহলে browser-এ JavaScript কিভাবে চলে?
সমাধান হলো JavaScript Engine। এই engine JavaScript code কে machine code-এ convert করে, যাতে browser সেটাকে execute করতে পারে।

জনপ্রিয় JavaScript Engines
বিভিন্ন browser তাদের নিজস্ব JavaScript engine ব্যবহার করে।
Chrome → V8
Firefox → SpiderMonkey
Safari → JavaScriptCore
Edge → V8

আর আমাদের পরিচিত backend runtime Node.js ও V8 engine ব্যবহার করে।
সুতরাং, Chrome এবং Node.js — দুটোই V8 engine ব্যবহার করে JavaScript execute করে।

JavaScript Engine Architecture
এখন প্রশ্ন হলো — JavaScript Engine এর ভেতরে কী আছে?
Engine-টা ভেঙে দেখলে মূলত দুইটা প্রধান অংশ দেখা যায়:
JavaScript Engine
├── Memory Heap
└── Call Stack

Memory Heap
Memory Heap হলো মেমোরির এমন একটি অঞ্চল যেখানে JavaScript dynamically ডেটা সংরক্ষণ করে।
যেমন:
Objects
Arrays
Functions
Closures
DOM elements
সহজভাবে বললে এটাকে একটি বড় storage warehouse হিসেবে ভাবা যায়, যেখানে program execution চলাকালীন ডেটা তৈরি, বড় বা ছোট হতে পারে।

Memory Heap কেন দরকার?
JavaScript program চলাকালীন ক্রমাগত নতুন ডেটা তৈরি হয়।
যেমন:
Object
Array
Function
Closure
DOM element
এই ডেটাগুলোর নির্দিষ্ট আকার থাকে না, তাই এগুলো stack-এ রাখা যায় না।
এই কারণে JavaScript এগুলোকে Heap memory-তে store করে, যেখানে memory dynamically expand করতে পারে।

উদাহরণ:
const user = {
name: "Alex"
}
এখানে
{name: "Alex"}
এই object টি Heap memory-তে store হয়।

Call Stack
Call Stack হলো JavaScript-এর একটি data structure যা function execution track করতে ব্যবহার হয়।

সহজভাবে বললে:
যখন কোনো function run হয়
➡️ সেটি Call Stack-এ push হয়

কাজ শেষ হলে
⬅️ সেটি pop হয়ে বের হয়ে যায়

Call Stack structure
Call Stack কাজ করে LIFO (Last In, First Out) principle-এ।
অর্থাৎ: যেটা শেষে ঢুকবে সেটাই আগে বের হবে।

Call Stack কেন দরকার?
JavaScript engine (যেমন V8) কে জানতে হয়:
কোন function বর্তমানে execute হচ্ছে
কোন function আগে execute হয়েছে
function শেষ হলে কোথায় ফিরে যেতে হবে
এই সব information Call Stack-এ track করা হয়।

চলবে…
পরবর্তী পর্বে আমরা দেখবো:
Call Stack কীভাবে কাজ করে
Stack overflow কীভাবে হয়
এবং Execution Context কী

hashtag#Follow the series if you want to truly understand JavaScript from the inside out.

Top comments (0)