Compresor y Formateador JavaScript
Comprima o formatee código JavaScript con opciones personalizables
Documentación del Compresor y Formateador JavaScript
¿Qué es esta herramienta?
La minificación JavaScript elimina espacios, comentarios y tokens innecesarios preservando la semántica de ejecución. A diferencia del CSS, debe respetar la Inserción Automática de Punto y Coma (ASI): eliminar ciertos saltos de línea puede cambiar silenciosamente el comportamiento. Esta herramienta aplica eliminación conservadora de espacios, preservando saltos ASI-sensibles, y elimina todos los comentarios (// y /* */).
Características principales
- Eliminación de espacios y comentarios: elimina espacios entre declaraciones, líneas en blanco, // y /* */. Preserva literales de cadena, template y regex.
- Manejo ASI-safe: conserva saltos de línea antes de instrucciones que comienzan con (, [, /, +, -.
- Sin renombrado de variables: a diferencia de Terser/UglifyJS, no renombra variables locales.
- Soporte ES6+: arrow functions, destructuring, template literals, optional chaining (?.), nullish coalescing (??).
- Beautifier configurable: 2/4 espacios o tabulación; saltos de línea tras {/}/; y antes de //; normalización de estilo de comillas.
Casos de uso comunes
- Depuración de desarrollo: beautify de JS minificado en producción sin source map.
- Minificación puntual: reducir JS inline en HTML sin pipeline Webpack/Rollup.
- Análisis de seguridad: beautify de scripts ofuscados de terceros para evaluar su contenido.
- Estimación de tamaño: comparar bytes antes/después.
Cómo usar el Minificador de JavaScript
Dos modos: Minify (elimina comentarios/espacios) y Beautify (reformatea con indentación coherente).
Para comprimir JavaScript:
- Pega tu código JavaScript en el panel de entrada o sube un archivo .js.
- Haz clic en “Minify”. Se eliminan espacios y comentarios preservando saltos ASI-sensibles.
- Copia o descarga la salida .js. El porcentaje de reducción se muestra bajo el panel.
Para formatear/embellecer JavaScript:
- Pega JavaScript minificado o mal formateado en el panel de entrada.
- Selecciona el estilo de indentación y haz clic en “Beautify”.
- El resultado formateado aparece en el panel de salida.
¿Por qué minificar JavaScript?
La minificación JS reduce el tamaño de archivos de script, disminuyendo TTFB y TTI. Solo espacios: 20-40% de reducción; con renombrado (Terser): 40-65%. Gzip añade 60-75% más.
El JS minificado también reduce el tiempo de parse de V8/SpiderMonkey. En móvil, cada KB ahorrado mejora FID e INP (Core Web Vitals).
Ajustes de embellecimiento
Reconstruye indentación legible desde JS minificado. Maneja funciones anidadas, clases y estructuras de control.
- Indentación configurable: 2 espacios, 4 espacios o tabulación
- Saltos de línea tras {/}/; y antes de //
- Normalización de estilo de comillas
- Funciones y clases anidadas con niveles de indentación crecientes
Ajustes de minificación
Pasadas de transformación de texto para reducir bytes sin cambiar comportamiento.
- Todos los comentarios // eliminados
- Todos los comentarios /* */ eliminados (incluye JSDoc)
- Espacios entre instrucciones y líneas vacías eliminados
- Saltos ASI-sensibles antes de (, [, /, +, - conservados
- Literales de cadena, template y regex sin modificar
Impacto estimado en el tamaño del archivo
Minificación de texto: 20-40% de reducción. Con renombrado Terser: 40-65%. Gzip: 60-75% adicional, 85-90% total combinado.
Herramientas Relacionadas
Compresor y Formateador CSS
Comprima o formatee código CSS, elimine espacios en blanco y comentarios para optimizar el tamaño del archivo, o formatee código para legibilidad
Compresor y Formateador HTML
Comprima o formatee código HTML, elimine espacios en blanco y comentarios para optimizar el tamaño del archivo, o formatee código para legibilidad
Formateador JSON
Formatee y valide datos JSON para mejorar la legibilidad y depuración
Formateador XML
Formatear y validar datos XML con resaltado de sintaxis
Probador de expresiones regulares
Pruebe y depure expresiones regulares con resultados de coincidencia instantáneos
Verificador de Diferencias de Texto
Comparar diferencias entre dos textos o archivos con vista lado a lado resaltada