Brauzer qanday qilib yuklash kerak bo'lgan rasmni aniqlaydi?

Brauzer HTML hujjatni tahlil qilish davomida rasm yuklash zarurligini aniqlaydi. U <img>, <picture> teglarini yoki CSS'dagi background-image atributini uchratganda, src, srcset, data yoki CSS qoidalaridagi URL bilan ko'rsatilgan resursni (rasm fayli) olish uchun so'rov yuborilishi kerakligini tushunadi.

Jarayon quyidagilarni o'z ichiga oladi:

1. HTML/CSS tahlili: Brauzer HTML kodini qator-qator o'qib, tahlil qiladi. <img>, <picture> va background-image bilan CSS qoidalarini aniqlaganida, rasm URL'sini chiqarib oladi.
2. DOM/CSSOMda tugun yaratish: Har bir rasm uchun Document Object Model (DOM) yoki Cascading Style Sheets Object Model (CSSOM)da mos keladigan tugun yaratiladi yoki qoidalar belgilanishi.
3. So'rovni shakllantirish: Brauzer rasm URL'sida ko'rsatilgan serverga HTTP so'rov yuboradi. Bu so'rov odatda GET turi bo'ladi.
4. So'rov yuborish: Yaratilgan so'rov serverga yuboriladi.
5. Javobni qabul qilish: Server so'rovni ishlaydi va rasm ma'lumotlarini o'z ichiga olgan javobni yuboradi.
6. Dekodlash va chizish: Brauzer rasm ma'lumotlarini oladi, ularni dekodlaydi (masalan, JPEG, PNG, GIF) va veb-sahifadagi mos joyda ko'rsatadi.

<picture> va srcset uchun, brauzer qurilma haqida (ekran o'lchami, rezolyutsiya) va media shartlariga asoslanib, qaysi manbadan rasm yuklanishini aniqlaydi.

HTML bilan misol <img> tegi:

<img src="/images/logo.png" alt="Kompaniya logosi">

CSS bilan misol background-image:

.header {
  background-image: url('/images/header-bg.jpg');
}