Imagen en base64

Convertir una imagen a base64 (data image base64) a veces es necesario para reducir la cantidad de solicitudes HTTP al servidor. Es una buena manera de mostrar iconos en un sitio web. En este caso, el cuerpo de la imagen se puede colocar en el código HTML de la página o en el archivo CSS, donde en lugar de SRC o URL se inserta el código base64.

Pero debe entender que el código base64 pesa aproximadamente un 33% más que el propio archivo, por lo que no se recomienda mostrar imágenes grandes de esta manera.

Sin embargo, si se utiliza base64 para iconos o imágenes pequeñas, en algunos casos, además de reducir las solicitudes al servidor, también se puede ganar en el peso final de la página. Porque el servidor, además de la propia imagen, también entrega encabezados HTTP, que también tienen peso y se suman al de la imagen. Y para un icono puede resultar que la suma de su peso y los encabezados sea mayor que el peso en base64.

Base64 es un estándar de codificación de datos binarios mediante 64 caracteres ASCII. El alfabeto de codificación contiene caracteres latinos alfanuméricos A-Z, a-z y 0-9 (62 signos) y 2 caracteres adicionales, que dependen del sistema de implementación. Cada 3 bytes originales se codifican en 4 caracteres, lo que provoca un aumento de los datos en un 33%.