Transformers.js v4 (preview) ya está en NPM y trae cambios profundos: nuevo runtime WebGPU reescrito en C++, exportaciones optimizadas, monorepo, tokenizers separados y soporte para modelos grandes y arquitecturas exóticas. Si te interesa ejecutar modelos de punta 100% en el navegador o en runtimes JavaScript con aceleración por GPU, esto te interesa.
Qué cambia en v4
La versión v4 ahora se distribuye desde NPM bajo la etiqueta next, lo que simplifica las pruebas. Ya no necesitas clonar y compilar desde GitHub; basta con:
npm i @huggingface/transformers@next
Seguirán publicando actualizaciones frecuentes en la etiqueta next hasta el lanzamiento estable. Esto facilita integrar mejoras continuas sin romper proyectos en producción.
Nuevo runtime WebGPU en C++
El cambio más grande es el runtime WebGPU, reescrito en C++ en colaboración con el equipo de ONNX Runtime. ¿Por qué importa eso? Porque ahora el mismo stack de Transformers.js puede ejecutarse acelerado por WebGPU en una gama amplia de entornos JavaScript: navegadores, Node, Bun y Deno.
El runtime WebGPU en C++ permite ejecutar modelos acelerados fuera del navegador, trayendo WebGPU a entornos server-side y de escritorio.
Eso abre posibilidades prácticas: inferencia local en el navegador sin depender de la nube, o ejecución acelerada en servidores que soportan WebGPU, manteniendo el mismo código JavaScript.
Rendimiento y operadores ONNX
Para exprimir rendimiento, el equipo reimplementó operaciones modelo por modelo y aprovechó operadores contrib de ONNX Runtime como com.microsoft.GroupQueryAttention, com.microsoft.MatMulNBits y com.microsoft.QMoE. Usaron también com.microsoft.MultiHeadAttention para obtener aceleraciones notables.
Un ejemplo concreto: con com.microsoft.MultiHeadAttention lograron alrededor de 4x de velocidad en modelos de embeddings basados en BERT. Esa clase de ganancias cambia la experiencia: tiempos de respuesta más cortos y mayor throughput en dispositivos con recursos limitados.
También enfocaron la exportación de LLMs para optimizar memoria y computación, habilitando patrones avanzados como Mixture of Experts (MoE), Multi-head Latent Attention (MLA) y Mamba (modelos de espacio de estados).
Monorepo, limpieza de código y herramientas de build
El repositorio pasó a un monorepo usando pnpm workspaces. ¿Por qué? Para poder ofrecer sub-paquetes ligeros que dependen de @huggingface/transformers sin mantener repos separados. Esto facilita distribuir utilidades pequeñas y librerías específicas sin inflar la instalación base.
Se dividió el enorme models.js de v3 (8,000+ líneas) en módulos bien definidos: utilidades, lógica core y implementaciones por modelo. También movieron los ejemplos a un repositorio separado para mantener el core limpio.
Migraron de Webpack a esbuild. Resultado: tiempos de build que pasan de 2 segundos a 200 milisegundos, una mejora de 10x. Además, los bundles bajaron en promedio 10%, y transformers.web.js quedó 53% más pequeño. Menor tamaño significa descargas más rápidas y arranque más veloz para apps web.
También actualizaron Prettier y reformatearon todo el código para mantener un estilo consistente.
Tokenizers como paquete independiente
La lógica de tokenización se extrae a @huggingface/tokenizers, un refactor pensado para funcionar en navegadores y runtimes server-side. Características clave:
- 8.8 kB gzipped
- Cero dependencias
- Type-safe para mejor experiencia con TypeScript
Ejemplo de uso del tokenizer:
import { Tokenizer } from "@huggingface/tokenizers";
// Load from Hugging Face Hub
const modelId = "HuggingFaceTB/SmolLM3-3B";
const tokenizerJson = await fetch(`https://huggingface.co/${modelId}/resolve/main/tokenizer.json`).then(res => res.json());
const tokenizerConfig = await fetch(`https://huggingface.co/${modelId}/resolve/main/tokenizer_config.json`).then(res => res.json());
// Create tokenizer
const tokenizer = new Tokenizer(tokenizerJson, tokenizerConfig);
// Tokenize text
const tokens = tokenizer.tokenize("Hello World");
// ['Hello', 'ĠWorld']
const encoded = tokenizer.encode("Hello World");
// { ids: [9906, 4435], tokens: ['Hello', 'ĠWorld'], ... }
Separar tokenizers mantiene el core ligero y ofrece una herramienta reutilizable para cualquier proyecto WebML.
Modelos nuevos y compatibilidad
Gracias a la nueva estrategia de export y al soporte ampliado de operadores ONNX, v4 añade muchos modelos y arquitecturas nuevas: GPT-OSS, Chatterbox, GraniteMoeHybrid, LFM2-MoE, HunYuanDenseV1, Apertus, Olmo3, FalconH1 y Youtu-LLM, entre otros.
Estos modelos son compatibles con WebGPU, por lo que puedes ejecutarlos con aceleración en navegador o en runtimes server-side que soporten WebGPU. Preparan además demos que mostrarán estos modelos en acción.
Experiencia de desarrollador y límites de modelo
Mejoraron el sistema de tipos con pipelines dinámicos que se adaptan según la entrada, y el logging ahora es más claro y configurable. Añadieron soporte para modelos mayores a 8B parámetros. En pruebas, lograron ejecutar GPT-OSS 20B (q4f16) a aproximadamente 60 tokens por segundo en un M4 Pro Max.
Esto no es solo números: significa que proyectos offline y aplicaciones desktop pueden integrar modelos grandes con latencias prácticas, sobre todo si se acompaña de las optimizaciones de cuantización y operadores especializados.
¿Qué implica para ti como desarrollador o emprendedor?
- Si eres desarrollador web, ahora tienes una ruta más rápida y ligera para integrar modelos en el navegador.
- Si trabajas en backend o en apps de escritorio, puedes aprovechar WebGPU en Node, Bun o Deno para inferencia acelerada sin cambiar de stack.
- Si tu producto necesita privacidad u offline-first, el caching de WASM en el navegador permite ejecución sin conexión después de la primera descarga.
Es un paso relevante hacia un ecosistema WebML más maduro, donde la misma base de JavaScript sirve desde prototipos hasta aplicaciones con requisitos de performance.
Reflexión final
Transformers.js v4 no es solo una nueva versión; es una reimaginación de cómo llevar modelos grandes y eficientes a entornos JavaScript. Combina mejoras en runtime, infra y experiencia de desarrollo para que ejecutar modelos avanzados sea más accesible y rápido. ¿Quieres experimentar? La etiqueta next en NPM está lista para que la pruebes.
