Оптимизируйте входящие изображения разных размеров

У меня есть приложение Angular, которое вызывает следующий API: https://aws.random.cat/meow. Эта конечная точка возвращает URL-адрес изображения, которое я сейчас использую вsrc атрибут тега изображения.

Формат возвращаемого URL-адреса следующий:

{
  file: "https://purr.objects-us-east-1.dream.io/i/Tr08p.jpg"
}

Поскольку в этом случае размеры и разрешение изображений не известны заранее, и у нас нет никакого контроля над сервером, есть ли какие-либо возможности для оптимизации полученных изображений?

На данный момент я использовал фиксированный размер изображений, чтобы макет не мерцал при загрузке, и я могу думать о ленивой загрузке изображения (<img src="received_url" loading="lazy">) в случае, если контейнер не виден на экране.

Однако я не знаю о других возможных оптимизациях, поскольку мы не контролируем источник изображений.

0 ответов

Другие вопросы по тегам