Чисто из любопытства, в каких браузерах работает встраивание изображений Base64? Я имею в виду следующее .
Я понимаю, что это обычно не очень хорошее решение для большинства вещей, так как оно немного увеличивает размер страницы - мне просто любопытно.
Некоторые примеры:
HTML:
<img alt="Embedded Image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA..." />CSS:
div.image {
width:100px;
height:100px;
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA...);
}
3
почему бы не настроить страницу с примерами, мы все пройдем и проведем реальное тестирование и сообщим об этом здесь
—
Нир Леви
64 бита занимает всего 6 символов 2 ^ 6. Текстовая строка будет содержать как минимум 8 бит на символ в зависимости от типа кодировки. Вы теряете по крайней мере 25% эффективности .... мой быстрый тест показал около 30% потерь.
Что еще более важно, вы, вероятно, потеряете способность эффективно кэшировать ваши вещи.
—
Hut8
@BrianHaak "потрясающе" ничего не говорит. За последние пару лет я лично несколько раз использовал образы base64 с ReactJ, и у меня вообще не было проблем с рендерингом. Пожалуйста, предоставьте некоторые измерения.
—
Лукас Лиезис
@LukasLiesis Я проводил измерения в Google Chrome для коммерческих целей, поэтому здесь нет публичных отчетов. Это может быть хорошо для рендеринга уникальных изображений, но вы должны учитывать, что кэширование не работает вообще. В React.js это очень важно, когда он приводит к полной перерисовке деталей (например, при смене навигации).
—
Брайан Хаак