Electron এর আর্কিটেকচার মূলত দুইটি প্রধান প্রক্রিয়ার (Processes) উপর ভিত্তি করে গঠিত: Main Process এবং Renderer Process। এদের মধ্যে কাজ ভাগ করে Electron অ্যাপ্লিকেশন চালানো হয়। নিচে এই দুটি প্রক্রিয়া সম্পর্কে বিস্তারিত আলোচনা করা হলো:
Main Process
Main Process Electron অ্যাপ্লিকেশনের কেন্দ্রীয় নিয়ন্ত্রক। এটি অ্যাপ্লিকেশনের পুরো জীবনচক্র (Lifecycle) নিয়ন্ত্রণ করে এবং Node.js API এর সম্পূর্ণ সমর্থন পায়।
বৈশিষ্ট্য
- একটি অ্যাপ্লিকেশনে কেবল একটি Main Process থাকে।
- Main Process BrowserWindow তৈরি এবং নিয়ন্ত্রণ করে।
- এটি Node.js মডিউল এবং ইভেন্ট-ড্রিভেন প্রোগ্রামিং সমর্থন করে।
- Main Process IPC (Inter-Process Communication) এর মাধ্যমে Renderer Process এর সাথে যোগাযোগ করে।
উদাহরণ
const { app, BrowserWindow } = require('electron');
let mainWindow;
app.on('ready', () => {
mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true,
},
});
mainWindow.loadFile('index.html');
});
ভূমিকা
- অ্যাপ্লিকেশনের উইন্ডো তৈরি এবং পরিচালনা করা।
- অ্যাপ্লিকেশনের মেনু, নোটিফিকেশন, এবং নেটওয়ার্ক অপারেশন পরিচালনা করা।
Renderer Process
Renderer Process হলো Electron অ্যাপ্লিকেশনের ভিজ্যুয়াল ইন্টারফেস রেন্ডার করার জন্য দায়ী। এটি প্রতিটি BrowserWindow এর জন্য আলাদা আলাদা কাজ করে।
বৈশিষ্ট্য
- প্রতিটি উইন্ডোর জন্য একটি Renderer Process থাকে।
- Chromium দ্বারা HTML, CSS, এবং JavaScript রেন্ডার করা হয়।
- এটি Main Process থেকে আলাদা এবং সীমিত Node.js ফিচার ব্যবহার করে।
- Renderer Process Web APIs সমর্থন করে।
উদাহরণ
index.html ফাইল:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Renderer Process</title>
</head>
<body>
<h1>Electron Renderer Process</h1>
</body>
</html>
ভূমিকা
- UI রেন্ডার এবং ইন্টারেকশন পরিচালনা করা।
- Main Process থেকে আসা ডেটা প্রদর্শন করা।
- ব্যাকএন্ড এবং ফ্রন্টএন্ডের মধ্যে ব্রিজ হিসেবে কাজ করা।
Main Process এবং Renderer Process এর পার্থক্য
| বৈশিষ্ট্য | Main Process | Renderer Process |
|---|---|---|
| কাজের ধরন | অ্যাপ্লিকেশনের লাইফসাইকেল নিয়ন্ত্রণ। | UI রেন্ডার এবং ইউজার ইন্টারঅ্যাকশন। |
| সংখ্যা | একটি অ্যাপ্লিকেশনে একটিই থাকে। | একাধিক থাকতে পারে (প্রতি উইন্ডোর জন্য)। |
| API অ্যাক্সেস | Node.js এবং Electron API সম্পূর্ণ অ্যাক্সেস। | সীমিত Node.js এবং Web APIs অ্যাক্সেস। |
| যোগাযোগ | Renderer Process-এর সাথে IPC এর মাধ্যমে। | Main Process-এর সাথে IPC এর মাধ্যমে। |
| উদাহরণ | BrowserWindow তৈরি করা। | HTML, CSS, JavaScript রেন্ডার করা। |
IPC (Inter-Process Communication)
Main Process এবং Renderer Process এর মধ্যে যোগাযোগের জন্য Electron IPC সরবরাহ করে। এটি ipcMain এবং ipcRenderer মডিউল ব্যবহার করে।
উদাহরণ
Main Process:
const { ipcMain } = require('electron');
ipcMain.on('message', (event, args) => {
console.log(args);
event.reply('reply', 'Message received in Main Process');
});
Renderer Process:
const { ipcRenderer } = require('electron');
ipcRenderer.send('message', 'Hello from Renderer Process');
ipcRenderer.on('reply', (event, args) => {
console.log(args);
});
সারসংক্ষেপ
- Main Process মূল অ্যাপ্লিকেশন নিয়ন্ত্রণ করে এবং Node.js এর ক্ষমতা ব্যবহার করে।
- Renderer Process UI রেন্ডার এবং ব্যবহারকারীর সাথে ইন্টারঅ্যাকশন পরিচালনা করে।
- Main এবং Renderer Process একসঙ্গে কাজ করে Electron অ্যাপ্লিকেশনকে কার্যকর করে। IPC এর মাধ্যমে তাদের মধ্যে সমন্বয় সাধন করা হয়।
Read more