CSR, SSR va SSG farqi

CSR HTMLni brauzerda, SSR so'rov paytida serverda va SSG build paytida yaratishi — CSR, SSR va SSG o’rtasidagi asosiy farq — sahifaning HTML tarkibi qayerda va qachon tayyorlanishidir.

Foydalanuvchi yakunda brauzerda HTML ko’radi. Ammo shu HTML qachon va qayerda yaratilishi turlicha bo’lishi mumkin. CSR, SSR va SSG atamalari web ilovaning render strategiyasini tushuntiradi.

CSR — brauzerda render qilish

Client-Side Renderingda server boshlang’ich HTML qobig’i va JavaScript fayllarini yuboradi. JavaScript brauzerda ishga tushib, API’dan ma’lumot oladi va DOMni yaratadi yoki yangilaydi.

Oqim:

Brauzer minimal HTML oladi.
JavaScript yuklanadi va bajariladi.
Ilova API so’rovlarini yuboradi.
Javob asosida interfeys chiziladi.

CSR sahifa ichida tez navigatsiya va boy interaktiv ilovalar uchun qulay. Lekin boshlang’ich JavaScript katta bo’lsa, foydalanuvchi kontentni ko’rish uchun ko’proq kutadi. JavaScript ishlamasa, asosiy kontent ham ko’rinmasligi mumkin.

SSR — so’rov paytida serverda render qilish

Server-Side Renderingda foydalanuvchi so’rov yuborganda server ma’lumotni olib, shu so’rov uchun HTML tayyorlaydi. Brauzer mazmunli HTMLni darhol oladi; JavaScript keyin interaktivlikni ulashi mumkin. Bu jarayon ko’pincha hydration deb ataladi.

SSR foydalanuvchiga xos, tez-tez o’zgaradigan sahifalar uchun mos bo’lishi mumkin. Lekin har so’rovda server ishi va ma’lumot olish bor, shuning uchun cache, server quvvati va xato holatlarini yaxshi boshqarish kerak.

SSG — build paytida tayyorlash

Static Site Generationda HTML foydalanuvchi so’rovi paytida emas, deploy oldidagi build bosqichida yaratiladi. Tayyor fayllar CDN orqali tez tarqatiladi.

Blog, hujjat, marketing sahifasi va dars sayti kabi kontent hamma uchun bir xil bo’lsa, SSG sodda, tez va xavfsiz yechim bo’lishi mumkin. Kontent o’zgarganda odatda qayta build va deploy kerak bo’ladi.

CSR brauzerda, SSR har so'rovda serverda va SSG build vaqtida HTML yaratish oqimlari — CSR ishni brauzerga, SSR so’rov paytidagi serverga, SSG esa oldindan bajariladigan buildga ko’proq yuklaydi.

Taqqoslash

Savol	CSR	SSR	SSG
HTML qayerda yaratiladi?	Brauzerda	Serverda	Build muhitida
Qachon?	Sahifa ochilganda	Har so’rovda	Deploy oldidan
Shaxsiy kontent	Qulay	Qulay	Odatda keyin API bilan
Server ishlashi	API uchun	Render va API uchun	Oddiy fayl tarqatish yetadi
Yangilanish	API ma’lumotiga bog’liq	Keyingi so’rovda	Qayta build talab qilishi mumkin

Qaysi birini tanlash kerak

Kontent oldindan ma’lum va kam o’zgarsa — SSGni ko’rib chiqing.
Har so’rovda shaxsiy yoki yangi HTML kerak bo’lsa — SSR mos bo’lishi mumkin.
Interaktiv ilova va brauzerdagi murakkab holat ustun bo’lsa — CSR foydali.
Ko’pincha eng yaxshi yechim — asosiy kontentni server yoki buildda berib, faqat kerakli interaktiv qismlarni JavaScript bilan jonlantirish.

Kontent yangilanishi, shaxsiylashtirish va interaktivlikka qarab CSR SSR yoki SSG tanlash kartalari — Render strategiyasi trendga emas, kontent qachon o’zgarishi va foydalanuvchiga qanchalik shaxsiy bo’lishiga qarab tanlanadi.

Qisqacha xulosa

CSR HTMLning katta qismini brauzerda JavaScript bilan yaratadi.
SSR har so’rovda serverda HTML tayyorlaydi.
SSG HTMLni build vaqtida oldindan yaratadi va CDN’dan tarqatadi.
Har modelning tezlik, server yuki va yangilanish bo’yicha trade-off’i bor.
Zamonaviy loyihalar bir nechta strategiyani birga ishlatishi mumkin.

Keyingi darsda cache, CDN va web performance — sahifa nima sabab sekinlashishi va uni qanday o’lchashni ko’ramiz.