# CSR, SSR va SSG farqi

> Client-side rendering, server-side rendering va static site generation qanday ishlaydi? Tezlik, SEO, yangilanish va hosting bo'yicha taqqoslash.

Manba: https://learncode.uz/web-dasturlash/csr-ssr-ssg/
Sana: 2026-05-11

![CSR HTMLni brauzerda, SSR so'rov paytida serverda va SSG build paytida yaratishi](https://learncode.uz/images/web-dasturlash/csr-ssr-ssg-hero.webp)

*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 Rendering**da 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:

1. Brauzer minimal HTML oladi.
2. JavaScript yuklanadi va bajariladi.
3. Ilova API so'rovlarini yuboradi.
4. 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 Rendering**da 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 Generation**da 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](https://learncode.uz/images/web-dasturlash/render-uch-model.webp)

*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 |

> **Bitta loyihada aralashishi mumkin**
>
> Bu strategiyalar bir-birini inkor qilmaydi. Sayt maqolalarni SSG bilan,
> foydalanuvchi profilini SSR bilan, murakkab interaktiv panelni CSR bilan
> ishlatishi mumkin. Zamonaviy frameworklar route yoki komponent darajasida
> aralash yondashuv beradi.

## 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](https://learncode.uz/images/web-dasturlash/render-tanlash.webp)

*Render strategiyasi trendga emas, kontent qachon o'zgarishi va foydalanuvchiga qanchalik shaxsiy bo'lishiga qarab tanlanadi.*

> **LearnCode qaysi modelga yaqin?**
>
> Dars matni build paytida HTMLga aylantirilib, tayyor sahifa sifatida tarqatilsa,
> bu SSGga yaqin. Ko'rishlar soni esa foydalanuvchi sahifani ochganda API orqali
> alohida yuklanishi mumkin. Demak, bitta sahifada statik kontent va dinamik
> client-side ma'lumot birga ishlaydi.

## 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](https://learncode.uz/web-dasturlash/cache-cdn-performance)
— sahifa nima sabab sekinlashishi va uni qanday o'lchashni ko'ramiz.