Compression Streams API: Compresión y Descompresión de Datos
Aprende a comprimir y descomprimir streams de datos usando gzip con la Compression Streams API para reducir el tamaño de transferencia.
TL;DR - Resumen rápido
- CompressionStream comprime datos usando el formato especificado (gzip por defecto)
- DecompressionStream descomprime datos al formato original
- Ambas APIs trabajan con streams para manejar datos grandes eficientemente
- Soporta formatos gzip, deflate y deflate-raw
- Siempre verifica el soporte del formato antes de usar brotli
- Ideal para comprimir respuestas HTTP, archivos y datos en tiempo real
Introducción a Compression Streams
La Compression Streams API proporciona una forma nativa de comprimir y descomprimir streams de datos directamente en el navegador. Esta API es especialmente útil para reducir el tamaño de datos transferidos a través de redes, almacenamiento local o archivos.
La API consta de dos interfaces principales: CompressionStream para comprimir datos y DecompressionStream para descomprimirlos. Ambas trabajan con streams, lo que permite procesar datos grandes sin cargar todo en memoria.
- Compresión nativa sin bibliotecas de terceros
- Soporte para gzip, deflate y brotli
- Trabaja con streams para datos grandes
- Compatible con Fetch API, File API y WebSockets
- Reduce significativamente el tamaño de transferencia de datos
Streams API
Compression Streams trabaja en conjunto con la Streams API. Esto permite procesar datos en chunks a medida que se reciben, lo que es ideal para datos grandes o transmisión en tiempo real.
CompressionStream
CompressionStream es una interfaz que comprime datos usando el formato especificado en el constructor. Por defecto usa gzip, pero también soporta deflate y brotli. Es especialmente útil para comprimir datos antes de enviarlos a través de redes.
CompressionStream crea un transform stream que comprime los datos a medida que pasan a través de él. El stream emite chunks comprimidos que puedes enviar a través de Fetch API, WebSockets o guardar en archivos.
- Crea un CompressionStream con new CompressionStream('gzip')
- Crea un ReadableStream con los datos a comprimir
- Usa pipeThrough() para pasar los datos por el CompressionStream
- Lee todos los chunks con getReader() hasta que done sea true
- Combina los chunks en un Uint8Array final con los datos comprimidos
Niveles de Compresión
Puedes especificar el nivel de compresión con el parámetro level: 0-3 para gzip (0=sin compresión, 9=máxima), y 0-11 para brotli. Niveles más altos comprimen mejor pero son más lentos.
DecompressionStream
DecompressionStream es una interfaz que descomprime datos comprimidos al formato original. Es el complemento perfecto de CompressionStream y se usa para recuperar datos que fueron comprimidos previamente.
DecompressionStream crea un transform stream que descomprime los datos a medida que pasan a través de él. El stream emite chunks descomprimidos que puedes procesar como texto, JSON o cualquier otro formato.
Descompresión Automática
DecompressionStream detecta automáticamente el formato de compresión basándose en los datos de entrada. Esto significa que no necesitas especificar el formato si los datos contienen la información correcta.
Formatos de Compresión
Compression Streams API soporta múltiples formatos de compresión, cada uno con sus ventajas y casos de uso. Es importante entender cuándo usar cada formato para obtener la mejor relación compresión/rendimiento.
Gzip es el formato más común y tiene el mejor soporte entre navegadores. Brotli ofrece mejor compresión pero no es soportado por todos los navegadores. Deflate es más rápido pero comprime menos que gzip.
Compatibilidad de Navegadores
Brotli no es soportado por todos los navegadores. Siempre verifica el soporte antes de usarlo. Gzip y deflate tienen soporte universal, por lo que son opciones más seguras para producción.
Ejemplo Completo
Este ejemplo completo muestra cómo comprimir y descomprimir datos usando Compression Streams con Fetch API. Comprimimos los datos antes de enviarlos y descomprimimos la respuesta recibida.
Este patrón es muy común en aplicaciones que envían/reciben datos grandes. Compression Streams hace que la compresión sea eficiente y no bloquee el hilo principal, ya que trabaja con streams asíncronos.
Compresión en Ambas Direcciones
Para máximo ahorro de ancho de banda, puedes comprimir tanto los datos que envías como los datos que recibes. Esto es especialmente útil en aplicaciones con datos grandes como videos, imágenes o documentos.
Errores Comunes
Al trabajar con Compression Streams, hay varios errores comunes que puedes encontrar. Conocer estos errores y cómo evitarlos te ayudará a escribir código más robusto.
Los errores más comunes incluyen no cerrar los streams correctamente, no manejar errores de compresión/descompresión, y no verificar el soporte del formato. Estos problemas pueden causar memory leaks, datos corruptos y comportamiento inesperado.
Memory Leaks
Olvidar cerrar los streams de compresión/descompresión es una causa común de memory leaks. Siempre cierra los streams usando close() cuando ya no se necesiten. Esto es especialmente importante en aplicaciones con muchas operaciones de compresión.
Resumen: Compression Streams API
Conceptos principales:
- •CompressionStream comprime datos usando gzip, deflate o brotli
- •DecompressionStream descomprime datos al formato original
- •Ambas APIs trabajan con streams para datos grandes
- •Los niveles de compresión controlan la relación tamaño/velocidad
- •Es ideal para comprimir datos de red, archivos y respuestas HTTP
Mejores prácticas:
- •Usa gzip para máxima compatibilidad entre navegadores
- •Cierra siempre los streams cuando ya no se necesiten
- •Verifica el soporte del formato antes de usar brotli
- •Usa niveles de compresión apropiados para tu caso de uso
- •Comprime tanto los datos que envías como los que recibes