Desarrollo web

Minificar o formatear código: cuándo usar cada uno

Qué hace exactamente cada proceso, por qué minificar sigue mereciendo la pena aunque el servidor use compresión gzip, y qué archivos no deberías tocar nunca.

Formatear y minificar son operaciones opuestas sobre el mismo archivo, y se confunden a menudo porque las dos «tocan los espacios». La diferencia está en para quién trabajas: formatear es para personas, minificar es para máquinas.

Formatear: para que se pueda leer

Formatear reordena e indenta el código sin cambiar lo que hace: pone cada cosa en su línea, alinea la sangría y deja los bloques a la vista. Sirve cuando te llega un archivo desordenado, cuando quieres entender código ajeno, o cuando buscas un error que se esconde en una línea de 2.000 caracteres.

Minificar: para que pese menos

Minificar hace lo contrario: elimina todo lo que el navegador no necesita para ejecutar el archivo. Espacios, saltos de línea, comentarios y, en JavaScript, los nombres largos de variables internas, que se sustituyen por otros de una o dos letras.

El resultado es ilegible para una persona y exactamente igual de válido para el navegador. Las reducciones típicas van del 30 al 60 % del tamaño original, y suben bastante en archivos con muchos comentarios.

«¿Y si mi servidor ya usa gzip?»

Es la objeción más habitual, y tiene parte de razón: la compresión gzip o brotli del servidor ya reduce mucho el peso al enviar, y sobre un archivo ya minificado la ganancia adicional es menor.

Pero minificar sigue aportando algo que la compresión no puede dar. El navegador descomprime el archivo antes de analizarlo, así que lo que tiene que leer e interpretar es el código completo. Menos código significa menos trabajo de análisis, y eso importa especialmente en móviles, donde la CPU es el recurso escaso. Dicho de otro modo: gzip ahorra red, minificar ahorra además procesador.

Qué no deberías minificar nunca

  • Tus archivos fuente. Minifica siempre una copia de salida, nunca el archivo que vas a seguir editando. Recuperar código minificado es posible, pero los nombres originales de las variables no vuelven.
  • Comentarios con licencias. Muchas librerías incluyen su licencia en una cabecera de comentario, y borrarla puede incumplir sus condiciones. Los buenos minificadores respetan los bloques marcados con /*! justamente por eso.
  • Código que necesites depurar en producción sin haber generado antes su source map.

El orden sensato de trabajo

  1. Escribe y guarda el código formateado, que es el que vas a mantener.
  2. Minifica al publicar, generando archivos aparte.
  3. Si te llega un archivo minificado de fuera y necesitas entenderlo, formatéalo para leerlo, pero recuerda que los nombres de variables ya se perdieron y no van a volver.

Y una advertencia sobre JSON: un .json de configuración que edite una persona conviene dejarlo formateado. El ahorro de minificarlo es irrelevante y a cambio lo vuelves incómodo para todo el que tenga que tocarlo después.