Comments 6
А качество ещё не загруженных картинок меняется при переключении телефона между медленными и быстрыми сетями? Для SPA может быть актуально.
Просто для полноты. Есть ещё один подход: Client Hints. Суть в том, что сначала сервер говорит браузеру Accept-CH: ECT в заголовках ответа или<meta http-equiv="Accept-CH" content="ECT" /> в HTML-коде, а затем браузер добавляет заголовок ECT (effective connection type) во все следующие запросы. Сервер может отдавать ту или иную версию изображения в зависимости от значения заголовка. JavaScript не задействован никак. Если картинки отдаются с другого домена, смотрите сюда.
Поддержка браузерами такая же как у navigator.connection.
Спасибо за статью!
Сомнительная фича, как минимум требующая намного больше логики для правильной реализации. Например, что если изображение с высоким качеством уже закэшировано, зачем качать заново низкокачественное.
Оптимизация изображений для пользователей с медленным интернетом с помощью Network Information API