Minificar JavaScript
El mismo tipo de minificador que usan las herramientas de compilación, funcionando dentro de esta página. Entiende la sintaxis moderna y los módulos, y tu código fuente nunca se guarda.
- Nunca se guarda
- Sin filas ni esperas
- Sin registro, sin marca de agua
Aquí aparece el JavaScript minificado.
Cómo funciona
Pega tu JavaScript
O suelta el archivo. Entiende módulos, clases y sintaxis moderna.
Elige las opciones
Renombrar variables locales, quitar llamadas a console, conservar comentarios de licencia: cada una es un interruptor.
Copia o descarga
Con el tamaño de antes y el de después.
Qué se renombra, qué se elimina y qué no se debe tocar nunca
Pasan tres cosas, de menor a mayor según cuánto ahorran y cuánto te cuestan. Se eliminan los espacios y los comentarios, lo cual no cuesta nada. Se elimina el código muerto: una rama que nunca se ejecuta, una variable que se asigna y nunca se lee. Y se acortan los nombres locales, así que un calculateMonthlyTotal bien pensado se convierte en una sola letra. Ahí está la mayor parte del ahorro, y también es lo que hace ilegible el resultado, algo que está bien para publicar e inútil para depurar.
No se puede renombrar nada a lo que el mundo exterior se refiera por su nombre, y equivocarse en esto es la forma en que los minificadores rompen el código. Las funciones exportadas, las propiedades de objetos a las que se accede como cadenas, todo lo que se alcanza a través de window y los nombres usados en eval tienen que sobrevivir intactos, porque en otro lugar algo los busca por el nombre que escribiste. Las propiedades, en particular, no se tocan de forma predeterminada: renombrar user.emailAddress rompería el código en cuanto ese objeto se serializara a JSON o lo leyera un código minificado por separado.
Conserva un source map o el original. Una vez que los nombres desaparecen, el stack trace de un usuario real muestra un error en la función t en el carácter 48,213, lo que no te dice absolutamente nada. Un source map restaura los nombres y los números de línea originales en el depurador y en los informes de errores, y generarlo no cuesta nada, porque se distribuye como un archivo aparte que solo se carga cuando alguien abre las herramientas para desarrolladores.
Los comentarios de licencia se conservan de forma predeterminada, y es una postura legal, no una preferencia. Una gran cantidad de código abierto tiene una licencia permisiva con una sola condición: que su aviso de copyright lo acompañe. MIT y BSD lo dicen explícitamente. Quitar esos comentarios de un bundle que contiene código de terceros te pone en infracción de la licencia que te permitió usarlo. Son unos pocos cientos de bytes.
Si buscas otra cosa
Esto corresponde a un proceso de compilación, no a una pestaña del navegador, y los bundlers modernos lo hacen de forma rutinaria. esbuild --minify y Rollup o Vite minifican al compilar, generan source maps automáticamente y, lo que es mucho más importante, aplican tree shaking, que descarta las exportaciones de tus dependencias que nunca importas. En una aplicación real, eso ahorra muchísimo más de lo que minificar un archivo terminado podría ahorrar jamás.
Antes de optimizar, mide. Un analizador de bundles suele revelar que una sola dependencia grande ocupa la mayor parte del archivo: una biblioteca de fechas, un set de iconos, un paquete de gráficos incluido entero para un solo gráfico. Reemplazarla o cargarla de forma diferida gana a cualquier cantidad de minificación, y el code splitting, para que cada página cargue solo lo que necesita, gana a ambas cosas.
Preguntas frecuentes
¿Se guarda mi código en algún lugar?
No, y con el código fuente eso es lo esencial. No se guarda nada y ningún servidor llega a verlo. Pegar código propietario en un minificador en línea que lo envía a algún lado es divulgarlo, diga lo que diga el sitio sobre la retención de datos, y es justo el tipo de cosa que se hace con prisa y sin pensar.
¿Es el mismo minificador que el de mi herramienta de compilación?
Casi con seguridad, sí. Es el mismo tipo de minificador que usan webpack, Rollup, Vite y la mayoría de los demás bundlers. La única diferencia es que funciona aquí, en lugar de ser algo que instalas.
¿Cambiará lo que hace mi código?
No debería, y eso se comprueba en lugar de darse por hecho: nuestras pruebas minifican un módulo, importan tanto el original como la versión minificada, los ejecutan y comparan los resultados. Lo que SÍ cambia: los nombres de las variables locales (salvo que lo desactives), las expresiones constantes que se pueden calcular de antemano y el código muerto. Todo lo que dependa del nombre de una función en tiempo de ejecución, o de Function.prototype.toString, puede romperse con el renombrado: desactívalo si dependes de cualquiera de los dos.
¿Qué significa “Analizar como módulo”?
Indica si tu código se analiza como un módulo ES o como un script normal. Los módulos pueden usar import y export y siempre están en modo estricto. Viene activado de forma predeterminada porque así es la mayor parte del código moderno; si tu archivo es un script antiguo que usa “with” o depende del comportamiento no estricto, desactívalo.
¿Debo quitar las llamadas a console?
Para producción, normalmente sí: son ruido y pueden revelar detalles internos a cualquiera que abra las herramientas para desarrolladores. Viene desactivado de forma predeterminada porque eliminar código sin avisar no es algo que una herramienta deba hacer sin que se lo pidan.
¿Conserva los comentarios de licencia?
Sí, de forma predeterminada. Se conservan los comentarios que empiezan por /*! y los que contienen @license o @preserve, porque quitarlos de la biblioteca de otra persona con licencia MIT es una infracción de la licencia. Los comentarios normales se eliminan.
¿Puede generar un source map?
En esta página, no. Un source map solo es útil junto al archivo original en una URL conocida, algo que no encaja con una herramienta de pegar y copiar: el lugar adecuado para eso es tu herramienta de compilación.
¿Hay un límite de tamaño?
No hay uno fijo. Unos pocos miles de líneas se minifican en mucho menos de un segundo; un archivo empaquetado muy grande tarda más, porque se analiza entero antes de renombrar nada. Si vas a minificar todo un bundle de producción, tu herramienta de compilación es el mejor lugar para hacerlo: esta página es para un solo archivo o una comprobación rápida.
Conviene saber: Renombrar las variables locales hace el archivo más liviano y el resultado ilegible, algo que está bien para publicar e inútil para depurar: conserva un source map o el original. Los comentarios de licencia se conservan de forma predeterminada, porque quitarlos puede infringir la licencia de un código que tienes permiso para usar.
Agrega esta herramienta a tu sitio web
Gratis para cualquier blog, página de clase o artículo de ayuda. Pega un fragmento de código y tus visitantes podrán usarla directamente en tu página.
Herramientas relacionadas
Minificar CSS
Reduce una hoja de estilos, o descubre por qué no se puede
Minificar HTML
Reduce el HTML sin romper la página
Formatear JSON
Convierte un JSON ilegible en uno legible
Codificar Base64
Convierte texto o un archivo a Base64
Eliminar líneas duplicadas
Quita repeticiones, ordena y limpia una lista
Convertir mayúsculas y minúsculas
MAYÚSCULAS, minúsculas, Tipo Título, camelCase y más