Изображение в base64

Конвертировать картинку в base64 (data image base64) иногда требуется, чтобы уменьшить количество HTTP-запросов к серверу. Это хороший способ отображения иконок на сайте. В этом случае тело картинки можно разместить в HTML-коде страницы или в CSS-файле, где вместо SRC или URL вы подставляете код base64.

Но вы должны понимать, что код base64 весит примерно на 33% больше, чем сам файл, поэтому не рекомендуется выводить таким способом большие картинки.

Но если использовать base64 для иконок или мелких картинок, то в некоторых случаях, кроме сокращения запросов к серверу, можно выиграть и в итоговом весе страницы. Потому что сервер, кроме самой картинки, отдаёт ещё и HTTP-заголовки, которые также имеют вес и суммируются с весом картинки. И для иконки может получиться, что сумма её веса и заголовков будет больше, чем вес base64.

Base64 — это стандарт кодирования двоичных данных при помощи 64 символов ASCII. Алфавит кодирования содержит текстово-цифровые латинские символы A-Z, a-z и 0-9 (62 знака) и 2 дополнительных символа, зависящих от системы реализации. Каждые 3 исходных байта кодируются 4 символами, что приводит к увеличению данных на 33%.