Paso a paso: Minificar CSS y JS
- Pega o suelta tu códigoPega CSS, JavaScript o HTML en el cuadro, o arrastra un archivo .css, .js o .html. El lenguaje se elige solo según la extensión.
- Revisa las opcionesPor defecto se aplican optimizaciones seguras. En JavaScript puedes desactivar el acortado de nombres si necesitas depurar.
- MinificaPulsa «Minificar» o Ctrl + Enter. Verás el tamaño antes y después, el porcentaje de ahorro y una estimación con gzip.
- Copia o descargaCopia el resultado o descárgalo como .min.css, .min.js o .min.html. Pruébalo antes de publicarlo.
¿Qué es minificar código y para qué sirve?
Minificar es eliminar todo lo que el navegador no necesita para ejecutar el código: espacios, saltos de línea, sangrías y comentarios. En JavaScript, además, se acortan los nombres de las variables locales y se simplifican expresiones. El código hace exactamente lo mismo, pero pesa menos.
El ahorro típico está entre un 20 y un 60 %, según cuántos comentarios y espacios tenga el original. Menos bytes significa descargas más rápidas, menos tiempo de análisis en el navegador y mejores métricas de Core Web Vitals. La minificación se suma a la compresión gzip o Brotli de tu servidor: no se sustituyen, se complementan.
Un minificador de verdad, no un buscar y reemplazar
- JavaScript con Terser: analiza el código completo como lo haría el navegador, así que entiende cadenas, plantillas, expresiones regulares y puntos y coma implícitos. Si el código tiene un error de sintaxis, te indica la línea y la columna en lugar de devolver un archivo roto.
- CSS con CSSO: conoce la sintaxis de CSS. Acorta colores (
#ffffff→#fff), quita unidades en los ceros y une reglas repetidas sin alterar la cascada. - HTML: modo prudente. Quita comentarios y espacios que no cambian cómo se ve la página, no toca el contenido de
<pre>ni<textarea>y minifica los bloques<style>y<script>internos.
Buenas prácticas
- Guarda siempre el archivo original y minifica una copia para publicar. El código minificado no está pensado para editarse.
- Si usas herramientas como Vite o webpack, o un plugin de caché en WordPress, probablemente ya minifican al publicar. Esta herramienta es ideal para webs estáticas, fragmentos sueltos o comprobar cuánto puedes ahorrar.
- Los comentarios de licencia (
/*! … */o con@license) se conservan por defecto para cumplir las licencias de código abierto. - Después de minificar, prueba la página: es raro que algo falle, pero el código que depende del nombre de las funciones puede necesitar desactivar «Acortar nombres de variables».
Características
Tu código no se sube
Terser y CSSO se ejecutan en tu navegador. Ni el código ni el archivo se envían a ningún servidor.
Errores con línea y columna
Si el JavaScript tiene un error de sintaxis, te decimos dónde está en lugar de generar un archivo roto.
Ahorro medido de verdad
Tamaño antes y después en bytes, porcentaje de ahorro y estimación del tamaño con gzip.
Licencias conservadas
Los comentarios /*! … */ y @license se mantienen salvo que desactives la opción.
Preguntas frecuentes
¿Minificar puede romper mi JavaScript?
Es muy poco probable: Terser es el minificador que usan por defecto herramientas como webpack y solo aplica transformaciones seguras. Las excepciones son códigos que dependen del nombre de funciones o variables (por ejemplo con Function.name). Si notas algo raro, desactiva «Acortar nombres de variables».
¿Qué diferencia hay entre minificar y comprimir con gzip?
Minificar quita caracteres innecesarios y el archivo sigue siendo código legible por el navegador. Gzip o Brotli comprimen el archivo durante la transferencia y el navegador lo descomprime. Lo ideal es hacer las dos cosas: por eso te mostramos también el tamaño aproximado con gzip.
¿Puedo minificar HTML?
Sí. Eliminamos comentarios (salvo los condicionales) y espacios sobrantes de forma prudente, sin tocar <pre> ni <textarea>. Los <style> y <script> internos se minifican con CSSO y Terser; si alguno tiene errores, se deja como estaba y te avisamos.
¿Puedo volver al código original a partir del minificado?
No del todo: los comentarios y los nombres originales de las variables se pierden. Por eso conviene guardar siempre el original. Para datos JSON, usa Formatear JSON, que sí recupera la sangría.
¿Hay un límite de tamaño?
Admitimos archivos de hasta 20 MB. Los archivos grandes pueden tardar unos segundos, según la potencia de tu dispositivo.
¿Se envía mi código a algún servidor?
No. La página descarga los minificadores y trabaja con tu código en tu navegador. Puedes comprobarlo desconectando internet después de haber minificado una vez.
Actualizado: · Equipo de INNOZONA