Las 5 herramientas ideales al momento de comprimir tu JavaScript
Jose Mirt
Jose Mirt
Todos los desarrolladores de Javascript siempre buscan que el tiempo de compilación sea el más rápido posible. Para lograrlo, un punto crucial es el tamaño de los archivos javascript que se compilan. Para esto se recurre a lo que llamamos la compresión de código.

Una de los mayores retos de un desarrollador web en estos tiempos de rápido avance y movimiento, es que los tiempos de carga de un sitio sean lo menor posible, por lo que se busca lograr optimizar los recursos utilizados a tamaño lo más pequeño posibles. Para esto se recurre a métodos de compresión de código.

El código JavaScript generalmente está cargado de elementos que agregan un peso innecesario para el funcionamiento de la aplicación final, ya que por lo general, escribimos programas de manera tal que los humanos puedan leerlos y entenderlos fácilmente.

Por ello, los programadores escriben código con lenguaje “humano” utilizando directrices y espacios según sea adecuado dependiendo del lenguaje de programación. Sin embargo, el código luego es “traducido” a un lenguaje que la computadora pueda comprender, así qué por lo mismo, no importa la manera en la que el código está escrito, lo que importa, es que el código no posea errores de sintaxis para que pueda ser compilado o interpretado por esos “traductores”.

¿Qué es la compresión de código y cómo se consigue?

Comprimir el código se refiere principalmente a eliminar caracteres innecesarios del código fuente. Pueden ser tanto espacios en blanco, caracteres de nueva línea y una gran cantidad de datos redundantes, todo esto sin afectar realmente cómo el navegador procesa el código o recurso en su totalidad.

Esta es una técnica efectiva, también llamada minimización de código que mejora el tiempo de carga de la aplicación y, por supuesto, mejora el rendimiento general de la web debido a un tamaño de archivo menor.

Las aplicaciones que comprimen o minimizan el código Javascript por lo general lo hacen aplicando una o la combinación de las siguientes métodos:

  •  Eliminando espacios en blanco e indentación.
  • Acortando nombres de variables y funciones a caracteres individuales.
  • Al eliminar nuevos caracteres de línea.
  • Agrupando declaración de variables.
  • Tratando de convertir matrices a objetos siempre que sea posible.
  • Optimizando las declaraciones condicionales.
  • Al encontrar respuestas a expresiones constantes simples.
  • Eliminando comentarios del código

De acuerdo a la experiencia de los distintos talentos de nuestra empresa, estos son los mejores compresores y minimizadores de código javascript disponibles:

Herramientas-Javascript

Creado por Dean Edwards, es un minificador de javascript en línea. Es un servicio muy popular y simple donde el programador sólo tiene que copiar y pegar el código para comprimir. Luego, la aplicación muestra el código ya minificado para copiar y pegar en un nuevo archivo. Con otras herramientas modernas, para algunos puede sentirse como un trabajo a la “antigua” pero para cuando quieres una solución simple y rápida, puede ser una gran opción.

Herramientas-Javascript

Con la precisión que se espera de cualquier herramienta de Google, este minificador es una gran opción; está optimizado para hacer la mejor compresión posible, ya que evalúa todo el código fuente y no solo minifica el código, si no que también analiza cualquier problema en la sintaxis y muestra advertencias para que los errores puedan ser solucionados por el desarrollador, además, que cuenta con un apoyo constante a su alrededor, así que se encuentra en constantes mejoras.

Además cuenta con un API simple, con la que tu puedes crear un minificador personalizado con la funcionalidad de esta herramienta.

Para poder acceder a esta herramienta, visita la aplicación aquí.

Herramientas-Javascript

Uglify con más de 12 millones de descargas semanales es un minificador muy utilizado por la comunidad de desarrolladores. Antes contaba con un servicio en línea, pero fue eliminado. Es utilizado como una herramienta de línea de comandos o como plugin en otras herramientas como WebPack, Gulp y Grunt.

Puedes encontrar el paquete de NPM acá y puedes instalarlo localmente para utilizarlo en la línea de comandos o utilizarlo en algún corredor de tareas o empaquetador de módulos.

Herramientas-Javascript

Con casi 1 millón de descargas cada semana, Terser es una de las bibliotecas de compresión JavaScript más utilizadas. Terser se convirtió en una necesidad cuando eliminaron uglify-es y no había soporte para es6.

Terser es un fork de uglify-es que retiene la compatibilidad de CLI y la API con uglify-es con la última versión de uglify-js. Puedes conseguir más información acá y la puedes obtener a través de NPM.

Herramientas-Javascript

Node-Minify es un potente módulo Node js creado para la compresión de archivos JavaScript y HTML. Al momento de instalar el modulo, puedes elegir entre un conjunto de bibliotecas de compresión compatibles para minimizar tu archivo, La instalación es con esta línea de comando: npm install node-minify

Acá puedes ver más documentación de este módulo.

Como podrás ver, hay una gran variedad de aplicaciones y módulos que permiten la compresión y minificación de código JavaScript, desde las opciones más simples, hasta las más complicadas. A pesar de ser un método muy simple, resulta altamente efectivo para reducir el tamaño del archivo JavaScript y aumentar la velocidad de carga de un sitio web.

Contar con programadores que sepan manejar todas estas herramientas, garantiza que las empresas con presencia en línea puedan brindar a sus clientes una experiencia fluida y sin pérdida de tiempo por tiempos de carga extensos.

Comparte este post
Comparte en Facebook
Comparte en Twitter
Comparte en Google+
Comparte en LinkedIn
+
ELEVAR ANIMAR INSPIRAR