ExpressJS এ Asynchronous Data Handling এবং Live Updates ব্যবস্থাপনা করা ওয়েব অ্যাপ্লিকেশনের পারফরম্যান্স এবং ব্যবহারকারীর অভিজ্ঞতা উন্নত করতে গুরুত্বপূর্ণ ভূমিকা পালন করে। এখানে আমরা দুটি গুরুত্বপূর্ণ বিষয় আলোচনা করব:
- Asynchronous Data Handling: নন-ব্লকিং ওয়েব সার্ভার হিসেবে ExpressJS অ্যাপ্লিকেশন সঠিকভাবে কাজ করতে asynchronous (অসিঙ্ক্রোনাস) ডেটা প্রক্রিয়াকরণ ব্যবহার করে, যেখানে অ্যাপ্লিকেশন ইভেন্ট-ড্রিভেন ও কাজগুলো একসাথে সম্পাদন করতে সক্ষম হয়।
- Live Updates: এক্সপ্রেস অ্যাপ্লিকেশনে live updates বা real-time updates এ রিয়েল-টাইম ডেটা ট্রান্সফার, যেমন চ্যাট অ্যাপ্লিকেশন, ফিড আপডেট ইত্যাদি ব্যবহৃত হয়। আমরা এখানে WebSockets এবং Server-Sent Events (SSE) ব্যবহার করে Live Updates কীভাবে তৈরি করা যায় তা দেখব।
১. Asynchronous Data Handling
ExpressJS অসিঙ্ক্রোনাস ডেটা প্রক্রিয়াকরণে Promises এবং async/await ব্যবহার করে, যা অ্যাপ্লিকেশনকে ব্লক না করে দ্রুত প্রতিক্রিয়া প্রদান করতে সক্ষম হয়। এগুলি Node.js এর নেটিভ ফিচার এবং এই ফিচারগুলো ব্যবহার করে আমরা সহজে ডেটাবেস বা API কলের মতো দীর্ঘ প্রসেসিং এড়িয়ে যেতে পারি।
১.১. Asynchronous Data Handling উদাহরণ
এখানে, আমরা MongoDB থেকে ডেটা asynchronously নিয়ে আসব এবং সেটা রেসপন্স হিসেবে পাঠাবো। এজন্য আমরা async/await ব্যবহার করব।
const express = require('express');
const mongoose = require('mongoose');
const app = express();
// MongoDB সংযোগ
mongoose.connect('mongodb://localhost:27017/test', { useNewUrlParser: true, useUnifiedTopology: true });
// ডেটা মডেল
const Item = mongoose.model('Item', { name: String, description: String });
// Asynchronous রাউট
app.get('/items', async (req, res) => {
try {
const items = await Item.find(); // ডেটাবেস থেকে ডেটা asynchronously আনা
res.json(items);
} catch (error) {
res.status(500).send('Error fetching items');
}
});
// সার্ভার চালু
app.listen(3000, () => {
console.log('Server running at http://localhost:3000');
});
কোড ব্যাখ্যা:
- async/await:
Item.find()একটি asynchronous অপারেশন, তাই আমরাawaitব্যবহার করছি এটি সম্পূর্ণ হওয়ার জন্য অপেক্ষা করতে। - try/catch: error handling করা হয়েছে যাতে কোনো সমস্যা হলে সঠিক রেসপন্স পাঠানো যায়।
এটি সিঙ্ক্রোনাস কোডের মতোই দেখতে কিন্তু কার্যকরভাবে অসিঙ্ক্রোনাস কাজ করে।
২. Live Updates: WebSockets এবং Server-Sent Events (SSE)
Live updates বা real-time data ট্রান্সফার অনেক অ্যাপ্লিকেশনে ব্যবহৃত হয়, যেমন:
- চ্যাট অ্যাপ্লিকেশন
- ফিড আপডেট
- নোটিফিকেশন সিস্টেম
এই কাজগুলির জন্য আমরা WebSockets এবং Server-Sent Events (SSE) ব্যবহার করতে পারি।
৩. WebSockets
WebSockets হল একটি প্রোটোকল যা ক্লায়েন্ট এবং সার্ভারের মধ্যে দু-দিক রিয়েল-টাইম যোগাযোগ তৈরি করে। WebSockets ব্যবহার করে, সার্ভার এবং ক্লায়েন্টের মধ্যে একবার সংযোগ স্থাপিত হলে, তারা একে অপরকে একযোগভাবে বার্তা পাঠাতে পারে।
ExpressJS-এ WebSockets ব্যবহারের জন্য আমরা socket.io লাইব্রেরি ব্যবহার করব।
৩.১. Socket.IO ইনস্টলেশন
npm install socket.io
৩.২. WebSockets এর মাধ্যমে Live Updates সেটআপ
const express = require('express');
const http = require('http');
const socketIo = require('socket.io');
const app = express();
// HTTP সার্ভার তৈরি
const server = http.createServer(app);
// Socket.IO ইনস্টল
const io = socketIo(server);
// WebSocket সংযোগ
io.on('connection', (socket) => {
console.log('A user connected');
// ক্লায়েন্টের কাছ থেকে মেসেজ গ্রহণ
socket.on('chat message', (msg) => {
console.log('Message received: ' + msg);
// সমস্ত ক্লায়েন্টকে মেসেজ পাঠানো
io.emit('chat message', msg);
});
socket.on('disconnect', () => {
console.log('User disconnected');
});
});
// রুট সেটআপ
app.get('/', (req, res) => {
res.sendFile(__dirname + '/index.html');
});
// সার্ভার চালু
server.listen(3000, () => {
console.log('Server running at http://localhost:3000');
});
৩.৩. HTML ক্লায়েন্ট (index.html)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Chat App</title>
<script src="/socket.io/socket.io.js"></script>
</head>
<body>
<ul id="messages"></ul>
<form id="form" action="">
<input id="m" autocomplete="off">
<button>Send</button>
</form>
<script>
var socket = io();
// নতুন মেসেজ দেখানো
socket.on('chat message', function(msg){
var li = document.createElement('li');
li.textContent = msg;
document.getElementById('messages').appendChild(li);
});
// ফর্ম সাবমিট করলে মেসেজ পাঠানো
document.getElementById('form').onsubmit = function(e) {
e.preventDefault();
socket.emit('chat message', document.getElementById('m').value);
document.getElementById('m').value = '';
};
</script>
</body>
</html>
কোড ব্যাখ্যা:
io.emit('chat message', msg): সার্ভার থেকে সমস্ত ক্লায়েন্টকে মেসেজ পাঠানো হচ্ছে।socket.on('chat message', ...): ক্লায়েন্টে মেসেজটি রিসিভ করা হচ্ছে এবং UI-তে প্রদর্শন করা হচ্ছে।
৪. Server-Sent Events (SSE)
Server-Sent Events (SSE) হল একটি প্রোটোকল যা শুধুমাত্র সার্ভার থেকে ক্লায়েন্টে রিয়েল-টাইম ডেটা পাঠানোর জন্য ব্যবহৃত হয়। এটি একতরফা যোগাযোগের জন্য ব্যবহৃত হয় (সার্ভার → ক্লায়েন্ট), এবং এটি সাধারণত ব্রাউজার সমর্থিত।
৪.১. SSE সেটআপ
app.get('/events', (req, res) => {
res.setHeader('Content-Type', 'text/event-stream');
res.setHeader('Cache-Control', 'no-cache');
res.setHeader('Connection', 'keep-alive');
// প্রতিটি ৫ সেকেন্ডে ক্লায়েন্টে মেসেজ পাঠানো
setInterval(() => {
res.write('data: Hello, this is an update!\n\n');
}, 5000);
});
৪.২. HTML ক্লায়েন্ট (SSE)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SSE Example</title>
</head>
<body>
<h2>Server Sent Events</h2>
<div id="message"></div>
<script>
const eventSource = new EventSource('/events');
eventSource.onmessage = function(event) {
document.getElementById('message').innerHTML = event.data;
};
</script>
</body>
</html>
কোড ব্যাখ্যা:
EventSource('/events'): ক্লায়েন্ট একটি SSE কানেকশন শুরু করে, যা সার্ভার থেকে রিয়েল-টাইম ডেটা পাবো।res.write('data: ...'): সার্ভার থেকে ক্লায়েন্টে ডেটা পাঠানো হচ্ছে। প্রতিটি ডেটা একটিdata:লাইনে পাঠানো হয়।
সারাংশ
ExpressJS-এ Asynchronous Data Handling এবং Live Updates ব্যবস্থাপনা করার জন্য WebSockets এবং Server-Sent Events (SSE) ব্যবহার করা যায়। Promises এবং async/await এর মাধ্যমে ডেটা asynchronously পরিচালনা করা হয়, যা অ্যাপ্লিকেশনের পারফরম্যান্স উন্নত করে। WebSockets এবং SSE এর মাধ্যমে, আপনি রিয়েল-টাইম ডেটা ট্রান্সফার এবং লাইভ আপডেট সিস্টেম তৈরি করতে পারেন, যা ব্যবহারকারীর অভিজ্ঞতা উন্নত করতে সাহায্য করে।
Read more
