Notas del equipo sobre el oficio, los formatos y las pequeñas decisiones detrás de un buen resultado.
Por qué el AVIF supera al PNG de forma tan rotunda en tamaño
El AVIF se construye sobre el formato de imagen moderno, diseñado para la eficiencia perceptiva más que para la fidelidad sin pérdida. El PNG usa DEFLATE sobre los píxeles en bruto, algo sin pérdida que deja intacta una enorme redundancia en el contenido fotográfico. El AVIF sustituye esa redundancia por la predicción por bloques tomada del vídeo, descartando información que el sistema visual humano no percibe. El resultado es contundente. Una foto de 116 kilobytes se convierte en cerca de 16 kilobytes como AVIF a calidad 85. Un PNG transparente suele encogerse entre un 30 y un 50 por ciento frente a un WebP equivalente. La diferencia se ensancha con las fotografías de alta resolución y se estrecha en los gráficos simples. Para cualquier sitio que sirva imágenes con transparencia a un público moderno, el ahorro de ancho de banda se traduce directamente en cargas más rápidas y un coste de salida menor.
La historia del canal alfa en detalle
Tanto el PNG como el AVIF almacenan la transparencia en un plano transparencia separado junto a los datos de color. Cuando esta pareja procesa tu PNG, el decodificador extrae los píxeles de color y la capa transparente transparencia de forma independiente. La conversión a AVIF escribe luego un archivo nuevo con su propia pista transparencia, usando la codificación intracuadro del formato de imagen moderno para comprimir ambos planos a calidad 85. El transparencia no se funde en el color ni se sustituye por un relleno de fondo. Las sombras suaves, los bordes difuminados y los degradados parcialmente transparentes se representan todos con fidelidad. La única degradación que añade el AVIF es la compresión con pérdida sobre el propio plano transparencia, que puede crear un fleco apenas perceptible alrededor de los bordes muy duros con un zoom extremo. A los tamaños de visualización normales y a calidad 85, la diferencia no se ve. Para el trabajo de iconos perfectos al píxel en tamaños diminutos, quédate con el PNG.
La velocidad de conversión en la práctica, navegador por navegador
La conversión a AVIF se prepara una vez por sesión del navegador, unos 800 milisegundos para descargarla más 300 para iniciarla, así que la primera conversión lleva consigo cerca de un segundo de calentamiento. Las conversiones en caliente lo saltan por completo. En Chrome de escritorio, 0,12 megapíxeles tardan unos 40 milisegundos, un megapíxel alrededor de 250 milisegundos y ocho megapíxeles aproximadamente 2,8 segundos. Firefox es la excepción, trabaja unas cuatro veces más despacio, así que una foto en 4K puede tardar allí 30 segundos o más. WebKit en Safari se sitúa entre los dos, más cerca de Chrome. En hardware móvil de gama media, los números van de tres a cinco veces peor que en Chrome de escritorio. Si conviertes archivos grandes a menudo, Chrome en un equipo de escritorio o portátil ofrece el mejor rendimiento.
Cuándo conservar el PNG en vez de convertir
El PNG sigue siendo la opción correcta en varios casos incluso cuando el tamaño del archivo importa. Primero, los gráficos con texto nítido a tamaños pequeños, como etiquetas, insignias o iconos a escala de favicon, pueden mostrar en AVIF artefactos inaceptables a las distancias de visualización típicas. Segundo, los archivos de referencia usados para seguir editando deberían quedarse en PNG. Esto es así porque cada paso por un formato con pérdida acumula pérdida de calidad. Tercero, los entornos que rechazan el AVIF, incluidos algunos editores de documentos, herramientas de diseño más antiguas y clientes de correo, necesitan el PNG para la interoperabilidad. Por último, la animación más allá del primer cuadro no se conserva. Esto es así porque esta pareja maneja un solo cuadro. Para todo lo demás, fotografías con transparencia y recursos gráficos destinados a la entrega web moderna, PNG a AVIF es el acuerdo correcto.
Core Web Vitals y el argumento del ancho de banda
El Largest Contentful Paint, la métrica de carga principal, se ve afectado directamente por el tamaño de la imagen más grande de una página. Reducir esa imagen de 116 kilobytes a 16 kilobytes, según se midió en una foto en 4K en desarrollo. Esto recorta el tiempo de transferencia en una conexión de 10 Mbps de unos 93 milisegundos a unos 13 para ese solo elemento. Multiplícalo en una cuadrícula de productos, un carrusel de hero o una interfaz repleta de iconos con transparencia. El ahorro acumulado empuja el LCP muy por debajo del umbral de 2,5 segundos que Google considera bueno. La adopción del AVIF se aceleró precisamente porque el argumento se puede defender con cifras concretas. A cerca del 94,3 por ciento de cobertura de navegadores, el caso de reserva es lo bastante pequeño como para que la ganancia de ancho de banda supere el marcado extra del elemento picture.
En qué se diferencia de un convertidor en línea común
La mayoría de los convertidores de AVIF en línea suben tu PNG a máquinas que no controlas, lo procesan allí y lo guardan bajo la política de retención que fije ese proveedor, que a menudo es vaga. RoundCut es directo sobre su flujo. Como generar AVIF es exigente, la conversión se ejecuta en nuestro servidor para el mejor resultado, con un codificador en el navegador como respaldo automático cuando el servidor no está disponible. Cuando tu archivo se nos envía, se convierte y luego se elimina en alrededor de 2 horas, y eliminado sin ningún uso más allá de la conversión solicitada. No hay almacenamiento permanente ni compartición de tu imagen. Para quienes trabajan con documentos de clientes, fotografía de producto propia o contenido de usuarios, la versión honesta del intercambio es esta: el archivo puede pasar por nuestro servidor, se trata solo para producir tu AVIF y no se queda allí.
