De Blender al despliegue: compresión end-to-end en la práctica
Pasa un modelo PBR de 50 MB por todo el flujo: Blender, compresión de vértices, texturas KTX2 y carga en el motor, hasta bajarlo a 5 MB. Con scripts y hoja de referencia.
Hasta ahora, en esta serie hemos cubierto herramientas, principios y criterios de selección. En este último artículo, juntamos todo en una tubería funcional: partimos de un modelo real de Blender, lo comprimimos paso a paso, registramos los cambios en tamaño de archivo, uso de VRAM y tiempo de carga, y al final vemos si logramos que pase de un pesado de 50 MB a un modelo de 5 MB que se abra al instante en un móvil.
Público objetivo: quienes ya han leído los 5 artículos anteriores y están listos para poner manos a la obra. Este artículo no introduce nuevos conceptos; solo contiene procesos, comandos y scripts que se pueden reproducir.
Punto de partida: un modelo PBR real
Tomamos como muestra un modelo de producto de e‑commerce muy típico: un modelo de alta precisión con texturas PBR completas.
| Indicador inicial | Valor |
|---|---|
| Archivo fuente de Blender | ~120 MB (incluye el high‑poly no exportado) |
| GLB exportado (float32 + PNG) | ~50 MB |
| Número de vértices | Aprox. 180.000 |
| Texturas | 6 de 4096×4096 (albedo, normal, roughness, metallic, AO, emissive) |
| VRAM usada (6 texturas sin comprimir) | ~520 MB |
| Objetivo | Archivo ≤ 5 MB, VRAM controlada, apertura instantánea en móvil |
50 MB de archivo, 520 MB de VRAM: este modelo directamente petaría en un dispositivo móvil. Vamos paso a paso.
Paso 0: exportar correctamente desde Blender
El primer filtro de compresión es la exportación. Mucha gente pierde sangre aquí.
Ajustes clave al exportar glTF desde Blender:
- Formato:
glTF Binary (.glb)(archivo único, fácil de transportar) - Geometría: marcar
Normals,Tangents(las normal maps PBR necesitan tangentes) - UV: asegurarse de exportar (activado por defecto)
- Texturas:
AutomaticoJPEG(el formato de textura en este paso da igual, luego las re‑comprimiremos, pero hay que asegurarse de que se exporten) - Compresión: no marcar la compresión de malla de Blender; usaremos herramientas más especializadas
- Transformación:
+Y Up(estándar glTF) - Datos: marcar solo lo necesario (animaciones, cámaras, luces no se exportan si no se necesitan, así se reduce el tamaño)
Tras la exportación, model.glb: 50 MB, 6 texturas PNG, vértices float32. Esta es nuestra línea de base.
Un error común aquí: Blender exporta por defecto mallas no utilizadas y objetos auxiliares ocultos. Antes de exportar, ve a
File > Clean Up > Purge Orphansy en elOutlinerselecciona solo los objetos que quieras exportar.
Panorama completo de la tubería end‑to‑end
Dibujemos el flujo completo para tener una visión general:
Archivo fuente de Blender
│ Exportar .glb (float32 + PNG) 50 MB
▼
[1] Eliminar redundancias + soldar vértices duplicados (gltf-transform) ~45 MB
│
[2] Compresión de vértices: MeshOpt (gltfpack / gltf-transform) ~30 MB
│
[3] Compresión de texturas: PNG → KTX2 (ETC1S/UASTC) ~6 MB
│
[4] (Opcional) Simplificación geométrica LOD (simplify) ~4-5 MB
▼
model-final.glb final ~5 MB
│
Carga en el motor (Three.js / Babylon.js) → transcodificación en tiempo de ejecución → despliegue
Los números de cada paso se irán registrando en la tabla siguiente en tiempo real.
Cadena de herramientas: ¿cuál elegir?
Hay varias herramientas de compresión. Comparemos para no equivocarse:
| Herramienta | Fortalezas | Debilidades | Adecuada para |
|---|---|---|---|
| gltf-transform | Versátil, texturas+vértices en un solo comando, programable | La tasa de compresión extrema es menor que herramientas especializadas | Recomendado como principal, la mayoría de casos |
| gltfpack | Experto en compresión de vértices, soporte nativo de MeshOpt | Capacidad de compresión de texturas débil | Vértices densos, se quiere control fino de MeshOpt |
| toktx | Más profesional en compresión de texturas, parámetros completos | Solo procesa texturas, no el modelo completo | Ajuste fino de texturas individuales |
| gltf-pipeline | Clásico, soporta Draco | No se mantiene activamente, pocas funciones | Proyectos antiguos que ya usan Draco |
| Herramientas online (gltf.report) | Sin instalación | No apto para automatización, lotes grandes | Experimentos, tareas únicas |
Recomendación principal: usar gltf-transform para todo el flujo, y cuando sea necesario complementar con gltfpack para vértices y toktx para texturas individuales. Todos los pasos siguientes se basan en gltf-transform.
Paso 1: Eliminar redundancias + soldar
Los modelos suelen tener vértices duplicados, nodos y materiales no utilizados. Limpiemos primero.
gltf-transform optimize model.glb step1.glb --weld --prune
| Fase | Tamaño archivo | VRAM | Cambio |
|---|---|---|---|
| Línea de base | 50 MB | ~520 MB | — |
| Paso 1: limpieza | 45 MB | ~520 MB | -5 MB (la VRAM no cambia porque las texturas siguen ahí) |
La VRAM casi no se mueve, es esperado: la limpieza afecta principalmente a vértices y estructura; las texturas son las que dominan la VRAM.
Paso 2: Compresión de vértices con MeshOpt
gltf-transform optimize step1.glb step2.glb --meshopt --weld --prune
--meshopt cuantifica los vértices a 16 bits y los codifica sin pérdida con MeshOpt, añadiendo automáticamente la extensión EXT_meshopt_compression.
| Fase | Tamaño archivo | VRAM | Cambio |
|---|---|---|---|
| Paso 1 | 45 MB | ~520 MB | — |
| Paso 2 + MeshOpt | 30 MB | ~520 MB | -15 MB (parte de vértices) |
¿La VRAM sigue en ~520 MB? Sí, porque los vértices ocupan poco en VRAM (10-20%), reducir vértices tiene un impacto limitado. El verdadero monstruo de la VRAM son las texturas, las abordamos en el siguiente paso.
Paso 3: Compresión de texturas PNG → KTX2
Este paso es el que ofrece la mejor relación calidad‑beneficio.
gltf-transform optimize step2.glb step3.glb \
--texture-compress basisu \
--meshopt --weld --prune
--texture-compress basisu detecta automáticamente cada textura: las de color (albedo, emissive) usa ETC1S, las de datos (normal, roughness, metallic, AO) usa UASTC.
| Fase | Tamaño archivo | VRAM | Cambio |
|---|---|---|---|
| Paso 2 | 30 MB | ~520 MB | — |
| Paso 3 + KTX2 | 6 MB | ~70 MB | -24 MB de archivo / -450 MB de VRAM |
Este paso es el punto de inflexión de toda la tubería:
- El archivo pasa de 30 MB a 6 MB
- La VRAM pasa de ~520 MB a ~70 MB — porque las 6 texturas de 4096 pasan de «píxeles originales sin comprimir» a «compresión por bloques», cada una de ~87 MB a ~11-14 MB
La VRAM se reduce en un orden de magnitud; eso es lo que realmente determina si un modelo puede cargarse en un móvil.
Paso 4: (Opcional) Simplificación geométrica
Si se quiere reducir aún más el tamaño y la escena lo permite (bajando la precisión de los vértices), se puede añadir simplificación geométrica.
gltf-transform optimize step3.glb final.glb \
--texture-compress basisu \
--meshopt \
--simplify --simplify-ratio 0.5 \
--weld --prune
--simplify-ratio 0.5 significa conservar aproximadamente el 50% de los vértices.
| Fase | Tamaño archivo | VRAM | Cambio |
|---|---|---|---|
| Paso 3 | 6 MB | ~70 MB | — |
| Paso 4 + simplificación 0.5 | 4.5 MB | ~70 MB | -1.5 MB (VRAM casi no cambia) |
La simplificación reduce principalmente el tamaño del archivo, afecta poco a la VRAM. El coste es una pérdida de detalle del modelo: se nota al verlo de cerca. En páginas de producto de e‑commerce no se recomienda simplificar demasiado; en arquitectura/escenas grandes es muy adecuado.
Tabla resumen de impacto
Veamos los cuatro pasos juntos (basados en la muestra anterior, los números son solo para ilustrar órdenes de magnitud):
| Paso | Tamaño archivo | VRAM | Reducción acumulada |
|---|---|---|---|
| Línea de base (float32+PNG) | 50 MB | ~520 MB | — |
| + Limpieza y soldadura | 45 MB | ~520 MB | -10% |
| + MeshOpt en vértices | 30 MB | ~520 MB | -40% |
| + KTX2 en texturas | 6 MB | ~70 MB | -88% archivo / -87% VRAM |
| + Simplificación (0.5) | 4.5 MB | ~70 MB | -91% archivo |
Conclusión: la compresión de texturas aporta la mayor parte de la reducción de tamaño y VRAM. La compresión de vértices es la guinda, la de texturas es el plato fuerte. Esto coincide con lo dicho en el primer artículo: las texturas ocupan el 80% del volumen, optimizarlas da el mayor rendimiento.
Versión en un solo comando: para vagos con un solo clic
Si no quieres ver los pasos por separado, optimiza todo de una vez:
gltf-transform optimize model.glb model-final.glb \
--texture-compress basisu \
--meshopt \
--simplify --simplify-ratio 0.5 \
--weld --prune
Este comando = limpieza + soldadura + MeshOpt en vértices + KTX2 en texturas + simplificación geométrica. Vale para el 90% de los casos; los pasos separados son para entender y ajustar parámetros.
¿No quieres montar el entorno? Usa la compresión online de Any3D
Los comandos y scripts de gltf-transform anteriores requieren instalar Node, configurar la cadena de herramientas y recordar muchos parámetros. La herramienta de compresión online de Any3D se encarga de todo eso:
- No necesitas descargar scripts ni instalar nada — abre la web y usa
- El modelo no se sube al servidor — todo se procesa localmente en tu navegador, el archivo no sale de tu dispositivo
- Configuración visual — texturas KTX2, vértices MeshOpt, simplificación geométrica, ajusta con sliders y previsualiza en tiempo real
- Múltiples versiones con un clic — exporta el resultado comprimido para plataformas móvil / escritorio / VR
Elige un GLB, selecciona la plataforma objetivo, pulsa y obtén el modelo comprimido. Por debajo usa el mismo motor que la línea de comandos (gltf-transform), pero sin barreras y sin tocar la terminal.
Errores comunes y cómo evitarlos
El modelo se vuelve negro / las texturas no se muestran al comprimir
- El 99% de las veces es el espacio de color: falta asignar sRGB a las texturas de color. En Three.js:
texture.colorSpace = THREE.SRGBColorSpace. - Al usar toktx, olvidar
--srgben las texturas de color.
Las normal maps se ven mal después de comprimir
- La normal map se comprimió con ETC1S; cambia a UASTC.
- La normal map está en estilo DirectX (canal verde hacia abajo) y el motor espera OpenGL (necesita invertir el canal G).
La carga en móvil se queda bloqueada en la pantalla de inicio
- Comprueba si se está cargando el wasm del decodificador Draco (petición adicional). En móvil prioriza MeshOpt.
- Ruta del transcodificador KTX2 incorrecta; falla la transcodificación y se cae a descompresión por CPU.
El archivo comprimido es más grande que el original
- Las texturas son demasiado pequeñas (< 128 px); comprimir a KTX2 no compensa porque la compresión por bloques tiene un overhead fijo.
- El modelo ya estaba comprimido antes; volver a comprimir no aporta beneficio (incluso puede ser negativo).
El modelo simplificado tiene agujeros o roturas
--simplify-ratiodemasiado bajo; prueba con 0.7-0.8.- La simplificación es buena para superficies duras (mecánica, arquitectura), pero en superficies orgánicas (personajes) tiende a romperse.
KTX2 no carga en algunos navegadores
- Safari antiguo / WebView antiguo no lo soportan. Prepara un fallback con PNG/WebP, o usa el campo
fallbackde la extensiónKHR_texture_basisupara proporcionar texturas alternativas.
Hoja de referencia rápida de la serie
El resumen de los 6 artículos en una tabla. Recomiendo guardarla.
Composición del volumen
| Componente | Porcentaje | Herramientas de optimización |
|---|---|---|
| Texturas | 70-85% | KTX2 (mayor rendimiento) |
| Vértices | 10-20% | MeshOpt / cuantificación / Draco |
| Animaciones | 0-15% | Reducir keyframes / comprimir |
| Otros | < 2% | Eliminar redundancias |
Fórmula de VRAM
VRAM en formato tradicional = ancho * alto * 4 bytes * 1,333 (con mipmaps)
VRAM en KTX2 con compresión por bloques ≈ fórmula anterior / 4 (ETC1S) o / 2 (UASTC)
Selección de compresión de vértices
| Escenario | Recomendación |
|---|---|
| Sin dependencias externas, lo más simple | Cuantificación pura (KHR_mesh_quantization) |
| Opción equilibrada para web | MeshOpt |
| Ratio de compresión extremo, se puede esperar | Draco |
| Mini apps / sensible al peso del paquete | Cuantificación pura / MeshOpt, evitar Draco |
Selección de compresión de texturas
| Tipo de textura | Codificación recomendada |
|---|---|
| albedo / emissive (color) | KTX2 ETC1S |
| normal / roughness / metallic / AO (datos) | KTX2 UASTC |
| Web de escritorio, prioridad a la descarga | WebP / AVIF |
| Texturas pequeñas (< 128px) | Mantener PNG, no comprimir a KTX2 |
Comando único
# Optimización completa (texturas + vértices + simplificación)
gltf-transform optimize model.glb model-final.glb \
--texture-compress basisu --meshopt \
--simplify --simplify-ratio 0.5 --weld --prune
Referencia por plataforma
| Plataforma | Texturas | Vértices |
|---|---|---|
| Web escritorio | WebP / KTX2 | MeshOpt |
| Web móvil | KTX2 obligatorio | MeshOpt |
| VR | KTX2 obligatorio | MeshOpt + LOD |
| Mini apps | KTX2 / WebP | MeshOpt / cuantificación |
| Escenas grandes | KTX2 obligatorio | MeshOpt + Draco + LOD |
Repaso de la serie
Seis artículos que forman una cadena completa:
- ¿Por qué son tan grandes los modelos 3D?: entender la composición del volumen y la realidad de la VRAM
- Primera lección de adelgazamiento: las tres técnicas de compresión de vértices: cuantificación, MeshOpt y Draco
- Las texturas: el glotón de VRAM que no veías venir: por qué PNG/JPG salen caros a la GPU
- KTX2 en la práctica: elegir entre ETC1S y UASTC, cadena de herramientas y carga en el motor
- Guía para elegir el esquema de compresión: marco de decisión por plataforma y escenario
- Este artículo: la tubería end-to-end, de Blender al despliegue
La idea central en una frase: primero identifica el cuello de botella (descarga, VRAM o tasa de fotogramas) y después elige las herramientas; la compresión de texturas es la que más aporta, la de vértices es el toque final, y cada plataforma tiene sus propias reglas, así que no apliques la misma receta a todo.
Con los scripts y la hoja de referencia de este artículo, pasar de 50 MB a 5 MB y de 520 MB de VRAM a 70 MB es un camino repetible. Solo queda ponerse manos a la obra.