Renderer Process হল Electron অ্যাপ্লিকেশনের একটি গুরুত্বপূর্ণ অংশ যা UI (User Interface) রেন্ডার করে এবং ব্যবহারকারীর সাথে ইন্টারঅ্যাকশন পরিচালনা করে। এটি Chromium ইঞ্জিন ব্যবহার করে HTML, CSS, এবং JavaScript দিয়ে UI তৈরি এবং রেন্ডার করে।
প্রতিটি BrowserWindow এর জন্য একটি আলাদা Renderer Process তৈরি হয়। মূলত, Main Process অ্যাপ্লিকেশনের জীবনচক্র এবং উইন্ডো ম্যানেজমেন্ট পরিচালনা করে, আর Renderer Process ব্যবহারকারীর ইন্টারফেস রেন্ডার এবং ব্যবহারের সাথে সম্পর্কিত সকল কাজ করে।
Renderer Process এর বৈশিষ্ট্য
- HTML, CSS, এবং JavaScript ব্যবহার:
- Renderer Process HTML, CSS, এবং JavaScript ব্যবহার করে UI তৈরি ও রেন্ডার করে। এটি ওয়েব পেজের মতোই কাজ করে।
- একাধিক Renderer Process:
- প্রতিটি BrowserWindow এর জন্য আলাদা একটি Renderer Process থাকে। তাই একাধিক উইন্ডো থাকলে প্রতিটি উইন্ডোর জন্য আলাদা Renderer Process তৈরি হয়।
- Web APIs এর সমর্থন:
- Renderer Process DOM, Web APIs এবং অন্যান্য ওয়েব ভিত্তিক ফিচার সমর্থন করে। তবে, এতে Node.js এর কিছু সীমাবদ্ধতা থাকে (যদি
nodeIntegrationবন্ধ করা থাকে)।
- Renderer Process DOM, Web APIs এবং অন্যান্য ওয়েব ভিত্তিক ফিচার সমর্থন করে। তবে, এতে Node.js এর কিছু সীমাবদ্ধতা থাকে (যদি
- Node.js সীমিত অ্যাক্সেস:
- Renderer Process সীমিত Node.js ফিচার ব্যবহার করতে পারে, যদি
nodeIntegrationসক্রিয় না থাকে। তবে যদিnodeIntegration: trueকরা হয়, তখন Node.js এর সব ফিচার ব্যবহারের সুযোগ পাওয়া যায়।
- Renderer Process সীমিত Node.js ফিচার ব্যবহার করতে পারে, যদি
- প্রতিটি উইন্ডোর জন্য আলাদা প্রক্রিয়া:
- Electron অ্যাপ্লিকেশন চালু হলে, প্রতিটি নতুন উইন্ডো তৈরি হওয়ার সাথে সাথে একটি নতুন Renderer Process তৈরি হয়।
Renderer Process এর ভূমিকা
- UI রেন্ডারিং:
- Renderer Process অ্যাপ্লিকেশনের ইউজার ইন্টারফেস রেন্ডার করে। এটি মূলত সেই অংশ, যা ব্যবহারকারীর কাছে দৃশ্যমান এবং তাদের সাথে সরাসরি ইন্টারঅ্যাক্ট করে।
- HTML, CSS এবং JavaScript ব্যবহার করে ওয়েব পেজের মতো UI ডিজাইন করা হয়।
- ব্যবহারকারীর ইন্টারঅ্যাকশন পরিচালনা:
- এটি ব্যবহারকারীর ক্লিক, স্ক্রল, কীবোর্ড ইনপুট ইত্যাদির মতো ইন্টারঅ্যাকশনের জন্য দায়ী। Renderer Process এসব ইনপুট গ্রহণ করে এবং প্রক্রিয়াজাত করে।
- Main Process এর সাথে যোগাযোগ:
- Renderer Process এর মধ্যে থাকা স্ক্রিপ্টগুলি Main Process এর সাথে যোগাযোগ করার জন্য IPC (Inter-Process Communication) ব্যবহার করে।
- Renderer Process থেকে Main Process এ মেসেজ পাঠানো এবং সেখান থেকে সাড়া গ্রহণ করার জন্য
ipcRendererএবংipcMainব্যবহার করা হয়।
- ডাইনামিক কনটেন্ট রেন্ডার:
- JavaScript এর মাধ্যমে ডাইনামিক কনটেন্ট রেন্ডার করতে Renderer Process ব্যবহৃত হয়। উদাহরণস্বরূপ, ব্যবহারকারীর ইনপুট অনুসারে ডেটা আপডেট করা এবং UI রিফ্রেশ করা।
উদাহরণ: Renderer Process এবং Main Process এর মধ্যে যোগাযোগ
Renderer Process থেকে Main Process এর সাথে যোগাযোগ করার জন্য IPC (Inter-Process Communication) ব্যবহৃত হয়।
১. Main Process (main.js)
const { app, BrowserWindow, ipcMain } = require('electron');
let mainWindow;
app.on('ready', () => {
mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
},
});
mainWindow.loadFile('index.html');
// Renderer থেকে মেসেজ গ্রহণ
ipcMain.on('message-from-renderer', (event, arg) => {
console.log('Renderer থেকে বার্তা:', arg);
// Main Process থেকে Renderer Process-এ উত্তর পাঠানো
event.reply('reply-from-main', 'Main Process থেকে উত্তর!');
});
});
২. Renderer Process (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>Renderer Process থেকে Main Process এর সাথে যোগাযোগ</h1>
<button id="sendMessageBtn">Main Process এ বার্তা পাঠাও</button>
<script>
const { ipcRenderer } = require('electron');
document.getElementById('sendMessageBtn').addEventListener('click', () => {
// Main Process-এ বার্তা পাঠানো
ipcRenderer.send('message-from-renderer', 'Hello from Renderer!');
});
// Main Process থেকে উত্তর গ্রহণ
ipcRenderer.on('reply-from-main', (event, arg) => {
console.log('Main Process থেকে উত্তর:', arg);
});
</script>
</body>
</html>
Renderer Process এর সীমাবদ্ধতা
- Node.js এর সীমিত অ্যাক্সেস:
- যদি
nodeIntegrationবন্ধ থাকে, তবে Renderer Process Node.js এর API বা ফিচার ব্যবহার করতে পারে না। তবে, Renderer Process এর জন্য এটি নিরাপত্তার দৃষ্টিকোণ থেকে গুরুত্বপূর্ণ হতে পারে।
- যদি
- প্রতিটি উইন্ডো জন্য আলাদা প্রক্রিয়া:
- প্রতিটি BrowserWindow এর জন্য একটি আলাদা Renderer Process তৈরি হওয়ায়, একাধিক উইন্ডো বা ট্যাব ব্যবহার করলে এটি কিছুটা অতিরিক্ত রিসোর্স ব্যবহার করতে পারে।
সারাংশ
Renderer Process হল Electron অ্যাপ্লিকেশনের UI রেন্ডারিং এবং ব্যবহারকারীর ইন্টারঅ্যাকশন পরিচালনাকারী প্রক্রিয়া। এটি HTML, CSS এবং JavaScript ব্যবহার করে UI তৈরি করে এবং Main Process এর সাথে IPC ব্যবহার করে যোগাযোগ করে। Renderer Process ব্যবহারকারীর সঙ্গে সরাসরি ইন্টারঅ্যাকশন করে, যখন Main Process অ্যাপ্লিকেশনের মূল কাজগুলো পরিচালনা করে।
Read more
