La minificación reescribe el código en una forma más pequeña sin cambiar lo que hace. El navegador lee la versión compacta igual de bien y se descarga más rápido.
Qué se elimina
- Comentarios.
- Espacios, saltos de línea y sangría que no hacen falta.
- Caracteres opcionales, como el último punto y coma de un bloque CSS.
- En CSS, valores redundantes que se pueden escribir más cortos, como
#ffffffcomo#fffo0pxcomo0. - En HTML, los espacios entre etiquetas y los comentarios opcionales.
Las herramientas cuidadosas evitan cambiar lo que importa, como el contenido de <pre> y <textarea> o los espacios entre elementos en línea, donde un espacio puede afectar al renderizado.
Un ejemplo
.button {
color: #ffffff;
margin: 0px;
}
se convierte en
.button{color:#fff;margin:0}
¿Cuánto se ahorra?
Depende de cuánto espacio en blanco y cuántos comentarios tenga el original. Las hojas de estilo típicas se reducen entre un 10 y un 40 por ciento, y el HTML menos, ya que la mayor parte es contenido. La herramienta muestra el tamaño original, el nuevo y el porcentaje ahorrado, para que veas el resultado.
Minificación y compresión
Son cosas distintas que funcionan juntas. La minificación cambia el propio texto. La compresión, como gzip o Brotli, la aplica el servidor durante la transferencia y busca patrones repetidos. Un archivo minificado aún se comprime más, aunque la ganancia extra es menor que con código sin minificar.
Cuándo usarla
- Archivos de producción servidos a los visitantes.
- CSS en línea en correos HTML o CSS crítico en el head.
- Fragmentos que incrustas en una página.
Cuándo no
Conserva el código fuente legible para el desarrollo. El código minificado es difícil de depurar, así que la mayoría de los proyectos minifican durante la compilación y guardan mapas de código fuente.
Preguntas frecuentes
¿Es seguro el código minificado? Para CSS y HTML, sí cuando lo hace una herramienta probada, pero comprueba siempre la página después.
¿Se puede revertir el CSS minificado? Un embellecedor puede restaurar el diseño, pero los comentarios se pierden para siempre.