csr vs ssr vs ssg

রেন্ডারিং কীভাবে হয়?
Ans: যখন কোনো একটা পেজ (page) লোড হয়, তখন সেটিকে বলা হয় রেন্ডার হওয়া। যেমন: আমরা যখন ফেসবুকে ভিজিট করি, তখন ফেসবুক আমাদের চোখে দৃশ্যমান হয়। এই দেখতে পাওয়ার ঘটনাটাই রেন্ডার হওয়া।

রেন্ডার কিভাবে হয়?

Ans: রেন্ডারিংয়ের ক্ষেত্রে প্রথমে সার্ভার থেকে HTML ও CSS ফাইলগুলো ব্রাউজারে লোড হয়। এরপর আসে JS ফাইলগুলো। এই ফাইলগুলো ব্রাউজারে কাজ করে পুরো ওয়েবপেজটিকে ইন্টারঅ্যাকটিভ (Clickable, Dynamic) করে তোলে।

রেন্ডারিং সাধারণত তিন ধরনের হয়ে থাকে:

1. ক্লায়েন্ট সাইড রেন্ডারিং
2. সার্ভার সাইড রেন্ডারিং
3. প্রি-রেন্ডারিং

1. ক্লায়েন্ট সাইট রেন্ডারিং কি?

Ans: ক্লায়েন্ট সাইট রেন্ডারিং এর ক্ষেত্রে, যখন আমরা কোনো URL এ ক্লিক করি, তখন প্রথমে একটি ব্ল্যাংক HTML, CSS ফাইল লোড হয়। তারপর JS ফাইলগুলো সার্ভার থেকে আসে। কিন্তু এখানে একটা বড় সমস্যা হচ্ছে JS ফাইলগুলো আসার আগেই SEO চলে যায় আর কোনো কন্টেন্ট খুঁজে পায় না।

তবে ক্লায়েন্ট সাইট রেন্ডারিং এর ভালো দিক হচ্ছে, প্রথমে যদিও পেজ লোড হতে বেশি সময় লাগে, কিন্তু পরবর্তীতে আর বেশি সময় লাগে না।

2. সার্ভার সাইট রেন্ডারিং কি?

Ans: সার্ভার সাইট রেন্ডারিং বলা হয় যখন HTML, CSS, JS সব ফাইল আগে থেকেই সার্ভারে তৈরি করা থাকে। যখন ক্লায়েন্ট সাইট থেকে রিকুয়েস্ট পাঠানো হয়, তখন সার্ভার সাথে সাথে সব ফাইল একসাথে দিয়ে দেয়।

এতে করে লোডিং টাইম কম লাগে এবং এটা SEO ফ্রেন্ডলি। কিন্তু এর খারাপ দিক হচ্ছে পেজ রিলোড দিলেই সার্ভারে রিকুয়েস্ট চলে যায়। লোড বেশি হলে সার্ভার স্লো হয়ে যেতে পারে।

3. প্রি-রেন্ডারিং বা স্ট্যাটিক সাইট জেনারেশন কী?

Ans:প্রি-রেন্ডারিং বা স্ট্যাটিক সাইট জেনারেশন হলো_ যখন আমরা প্রজেক্ট বিল্ড করি, তখন ফাইল জেনারেট হয়ে থাকে। যখন আমরা যে URL-এ রিকুয়েস্ট করি, সাথে সাথে সেটি সার্ভার থেকে দেখানো হয়।

তবে এর খারাপ দিক হচ্ছে— যখন আমাদের কাছে এমন কোনো পেজ থাকে যা কিছুক্ষণ পরপর আপডেট হয়, যেমন: কোনো ব্লগ ওয়েবসাইট, যেখানে কিছুক্ষন পর পর নতুন ব্লগ পোস্ট হয়, তখন আমাদের প্রজেক্টকে আবার বিল্ড করতে হবে। নাহয় সার্ভার সাইট রেন্ডারিং করতে হবে।

=> তবে এর একটি সহজ সমাধান হচ্ছে Next.js। কারণ, Next.js-এ ক্লায়েন্ট সাইট রেন্ডারিং, সার্ভার সাইট রেন্ডারিং, স্ট্যাটিক সাইট জেনারেশন সবগুলো একসাথে করা যায়।_