Вопросы React Frontend Developer

Тег <picture> позволяет задавать несколько источников изображений для разных условий, таких как ширина экрана или формат изображения, чтобы браузер выбрал наиболее подходящее. Тег <img> используется для простого вставления одного изображения. Разница в том, что <picture> дает больше гибкости для адаптивных изображений.

Атрибут alt у тега <img> используется для предоставления текстового описания изображения. Это важно для пользователей, которые не могут видеть изображение, например, для людей с нарушениями зрения или когда изображение не загружается. Также поисковые системы используют этот текст для индексации изображений, что улучшает SEO.

CORS — это механизм, который позволяет ограничить или разрешить обмен данными между разными доменами. Браузеры по умолчанию запрещают запросы к ресурсам с другого домена для обеспечения безопасности. Чтобы разрешить такие запросы, сервер должен отправить специальные заголовки. Элементы, такие как <iframe>, <img> и <script>, могут загружать ресурсы с других доменов, но для некоторых операций, например, доступа к содержимому <iframe> из другого домена, требуется поддержка CORS.

Атрибут srcset у тега <img> позволяет задать несколько версий изображения с разными разрешениями или размерами. Браузер автоматически выбирает наиболее подходящую версию в зависимости от плотности пикселей экрана и ширины экрана. В комбинации с атрибутом loading="lazy" можно использовать ленивую загрузку изображений для оптимизации производительности страницы.