Как браузер определяет, что необходимо загрузить изображение?

Браузер определяет, что необходимо загрузить изображение, при парсинге HTML-документа. Когда парсер встречает теги <img>, <picture> или атрибут background-image в CSS, он понимает, что нужно сделать запрос на получение ресурса (файла изображения) по указанному в атрибутах src, srcset, data или в CSS-правиле URL.

Процесс включает:

1. Парсинг HTML/CSS: Браузер построчно читает и анализирует HTML-код. При обнаружении тегов <img>, <picture> с source или CSS-правил с background-image, он извлекает URL изображения.
2. Создание узла в DOM/CSSOM: Для каждого изображения создается соответствующий узел в Document Object Model (DOM) или определяется правило в Cascading Style Sheets Object Model (CSSOM).
3. Формирование запроса: Браузер формирует HTTP-запрос к сервер