base64 codificado tamaño de la imagen


Si convierto una imagen (jpg o png) a base64, entonces será más grande, o tendrá el mismo tamaño? ¿Cuánto más grande será?

¿Se recomienda utilizar imágenes codificadas base64 en mi sitio web?

Author: yprez, 2012-07-10

6 answers

Será aproximadamente un 37% mayor:

Muy aproximadamente, el tamaño final de los datos binarios codificados en Base64 es igual a 1,37 veces el tamaño de los datos originales

Fuente: http://en.wikipedia.org/wiki/Base64

 101
Author: Blender,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-08-04 07:21:09

Aquí está una descripción muy útil de cuándo codificar base64 y cuándo no por David Calhoun.

Respuesta básica = los archivos codificados con gzipped base64 serán aproximadamente comparables en tamaño de archivo al binario estándar (jpg/png). Los archivos binarios Gzip tendrán un tamaño de archivo más pequeño.

Takeaway = Hay alguna ventaja en la codificación y el gzip de los iconos de la interfaz de usuario, etc., pero no es prudente hacer esto para imágenes más grandes.

 12
Author: bulldog,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-08-02 20:55:23

Será más grande en base64.

Base64 usa 6 bits por byte para codificar datos, mientras que binary usa 8 bits por byte. Además, hay un poco de relleno en la parte superior con Base64. No todos los bits se utilizan con Base64 porque fue desarrollado en primer lugar para codificar datos binarios en sistemas que solo pueden procesar correctamente datos no binarios.

Eso significa que la imagen codificada será alrededor de un 25% más grande, más una sobrecarga constante para el relleno.

 6
Author: Eric J.,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-07-09 20:11:54

Codificar una imagen a base64 la hará un 30% más grande.

Vea los detalles en el artículo de wikipedia sobre el esquema URI de datos , donde dice:

Los URI de datos codificados en Base64 son 1/3 más grandes en tamaño que su equivalente binario. (Sin embargo, esta sobrecarga se reduce a 2-3% si el servidor HTTP comprime la respuesta usando gzip)

 5
Author: Oded,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-07-09 20:12:03

Definitivamente le costará más espacio y ancho de banda si desea utilizar imágenes codificadas base64. Sin embargo, si su sitio tiene muchas imágenes pequeñas, puede disminuir el tiempo de carga de la página codificando sus imágenes a base64 y colocándolas en html. De esta manera, el navegador cliente no necesitará hacer muchas conexiones a las imágenes, sino que las tendrá en html.

 2
Author: Brad Larson,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-03-11 18:51:39

Tamaño de base64 imágenes

Base64 utiliza 64 caracteres diferentes y esto es 2^6. Así que base64 almacena 6 bits por carácter de 8 bits. Así que la proporción es 6/8 de datos no convertidos a datos base64. Esto no es un cálculo exacto, sino una estimación aproximada.

Ejemplo:

Una imagen de 48kb necesita alrededor de 64kb como imagen convertida base64.

Cálculo: (48 / 6) * 8 = 64

Calculadora CLI simple en sistemas Linux:

$ cat /dev/urandom|head -c 48000|base64|wc -c
64843

O utilizando un imagen:

$ cat my.png|base64|wc -c

Base64-imágenes y sitios web

Esta pregunta es mucho más difícil de responder. En términos generales, como más grande la imagen como menos sentido usando base64. Pero considere los siguientes puntos:

  • Muchas imágenes incrustadas en un archivo HTML o CSS pueden tener cadenas similares. Para PNGs a menudo se encuentran caracteres "A" repetidos. Usando gzip (a veces llamado "desinflar"), podría haber incluso una victoria en el tamaño. Pero depende del contenido de la imagen.
  • Solicitud sobrecarga de HTTP1.1: Especialmente con una gran cantidad de cookies, puede tener fácilmente unos pocos kilobytes de sobrecarga por solicitud. Incrustar imágenes base64 podría ahorrar ancho de banda.
  • No codifique base64 imágenes SVG, porque gzip es más efectivo en XML que en base64.
  • Programación: En imágenes generadas dinámicamente es más fácil entregarlas en una solicitud como para coordinar dos solicitudes dependientes.
  • Deeplinks: Si desea evitar la descarga de la imagen, es un poco más complicado extraer una imagen de una página HTML.

Así que la respuesta es: Depende.

 1
Author: Trendfischer,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-07-18 16:58:21