Seguro que muchas veces habrás revisado la velocidad de tu sitio web en alguno de las herramientas online que hay para ello. Fijo que alguna vez te habrá aparecido el aviso de que la lentitud de tu web se debe en parte a los archivos no minificados (minify en inglés). Pues te lo explicamos.
¿Qué es la minificación de archivos? La minificación es el proceso consistente en eliminar los caracteres innecesarios que componen nuestro código, sin cambiar la forma en que funciona. Esta “optimización” de código hace que nuestras webs reduzcan enormemente los tiempos de espera, ya que optimiza los recursos y facilita a la máquina el proceso de ejecución de órdenes de estilo y demás.
Lenguaje humano Vs Lenguaje máquina:
Lenguaje Humano:
Nosotros los desarrolladores somos quienes escribimos el código que compone nuestros programas, webs y demás. Para ello usamos lenguajes que pueden parecer extraterrestres para personas neófitas, pero que están perfectamente estructurados para que un humano con conocimientos pueda leerlo, modificarlo, leer anotaciones, etc. Es decir, escribimos de forma HUMANA.
Lenguaje máquina:
Luego está la otra parte. La máquina que lee ese código y lo ejecuta. Estas máquinas no necesitan de ese sistema humano de escribir código para leerlo y ejecutarlo, es más, les entorpece la lectura. Para ellas todas esas notas, saltos de línea, espaciados, tabulados, etc son “caracteres que tiene que leer y no ejecutar” por lo cual “pierde tiempo” leyendo cosas que no ejecuta.
Es justo esto lo que hace el minificado: preparar el código escrito por el programador para que la máquina lo entienda lo más rápido posible y sin perder tiempo. Dicho con otras palabras, el minificado de un archivo es ese mismo archivo pero en una versión reducida del mismo, preparada y optimizada para la rápida lectura y ejecución por una máquina. Al final, todo esto reduce los tiempos de carga y por consiguiente, la espera.
Cuanto ahorra un archivo minificado:
Esta práctica puede llegar a ahorrar ingentes cantidades de tiempo de carga y aligerar bastante el funcionamiento de un desarrollo. Como ejemplo de la diferencia entre la versión normal (humana) y la versión minificada (máquina) podéis echar un ojo a los siguientes enlaces de la biblioteca de JavaScripts de JQuery.
La versión normal: Como veréis aunque no seáis programadores, la versión original está escrita con cierto sentido humano, espaciada, tabulada y en orden.
La versión minificada: Este archivo es exactamente el mismo que el otro pero sin espacios, anotaciones, explicaciones, tabulaciones, etc. Este es óptimo para que una máquina lo lea y ejecute.
Este tipo de minificaciones puede llegar a ahorrar incluso un 60%.
No es tan sencillo como parece:
Como se puede imaginar, generar un archivo minificado “a mano” es una tarea engorrosa y si el archivo a minificar es de cierto tamaño, que una persona ejecute esta minificación se vuelve sencillamente imposible. Es por esto que realizar esta minificación de modo manual suele ser considerado una mala praxis informática.
Para realizar una minificación hay muchas herramientas y plugins que nos ayudan a realizarla.
Si nuestro sitio web es un CMS como WordPress te puede valer cualquiera de estos plugins:
En caso de que tu sitio web no sea un wordpress, puedes usar estas distintas herramientas online para minificar tus archivos.
HTML: HTMLMinifer, Willpeavy Minimizer
CSS: CSSMinifier , CSSNano
JavaScript: JavaScript Minifier, Freeformater
Esperamos que el artículo os resulte útil y os haya ayudado comprender qué es la minificación de archivos. Os esperamos en los siguientes #ViernesdeOpinión.