Minificador CSS / JS
Minifica CSS o JavaScript: elimina comentarios y espacios con autodetección, stats de bytes y copia/descarga.
What this does
- CSS — strips /* comments */, collapses whitespace, removes trailing semicolons, tightens punctuation.
- JavaScript — strips // line and /* block */ comments, collapses whitespace, tightens braces and parens. Preserves string and template literals.
Note: this is a safe regex minifier — no variable renaming (mangling) and no dead-code elimination. Use Terser / esbuild in your build pipeline for production-grade compression.
Sobre esta herramienta
CSS / JS Minifier elimina todo lo que el navegador no necesita: comentarios, espacios en blanco redundantes, puntos y comas finales y (para CSS) unidades opcionales tras un cero. Pegue su fichero o suéltelo sobre la página; la herramienta detecta automáticamente si le ha entregado CSS o JavaScript y aplica el conjunto de reglas adecuado. Se muestra el tamaño original y el minificado en paralelo con el porcentaje ahorrado.
Para CSS seguimos un conjunto de reglas conservador — seguro en todos los navegadores, sin cambios de especificidad, sin reescrituras shorthand que pudieran alterar el comportamiento de la cascada. Para JavaScript el minificador retira comentarios y colapsa espacios pero no renombra variables ni manipula identificadores (eso requeriría un parser y arriesgaría romper eval / accesos dinámicos a propiedades). Para minificación agresiva (terser, esbuild, swc) use una herramienta de build; esta es la adecuada para tareas rápidas tipo «hazme esto más pequeño antes de pegarlo en un correo».
Cuándo utilizar esta herramienta
- Victoria rápida antes del despliegue. Un pequeño
<style>o<script>inline que no pasa por su bundler aún se beneficia de la minificación. - Plantillas de correo y AMP. El CSS inline choca con límites de tamaño; eliminar espacios puede ahorrar un 30–40%.
- Copiar y pegar en configuración. Fragmentos JS largos en ficheros YAML o JSON quedan mucho más legibles minificados.
- Verificar el ahorro de bytes antes de comprometerse con un cambio en la herramienta de build.
Lo que deliberadamente no hacemos
Sin renombrado de variables, sin eliminación de código muerto, sin reescritura de expresiones. Estos cambios pueden romper código que dependa de los nombres de identificadores (debug, monkey-patching,this dinámico) y las garantías de seguridad requieren un parser AST completo. Para builds de producción use terser o esbuild; el ahorro es mayor pero la superficie de seguridad mucho más amplia. Esta herramienta le da el 50% fácil con riesgo cero.
Preguntas frecuentes
¿Cuánto más pequeño quedará mi fichero?
¿Funciona con TypeScript?
tsc, esbuild, swc) y minifique la salida. Para código fuente con anotaciones de tipo, una herramienta consciente de TS como esbuild o swc hace tanto el strip de tipos como la minificación en una sola pasada y es la elección correcta.
¿La minificación de CSS romperá mi layout?
¿Funciona con source maps inline?
//# sourceMappingURL= es un comentario y desaparece). Para producción suele querer generar un fichero .map separado junto a la salida minificada, servido condicionalmente. Nuestra herramienta no genera source maps — eso requiere un parser completo y es responsabilidad de un pipeline de build. Use esbuild / terser para ese flujo.