Menu

¿Cómo usar import-cost en VSCode?

angularnewsionicvscode - August 30, 2018 por Nicolas Molina

Import-cost es una extensión en VSCode que nos permite conocer cuánto pesa en bytes cada una de los imports dentro de nuestros archivos, de esta forma tenemos conocimiento de que cada una de las librerías tiene un impacto el peso final de la aplicación.

¿Porqué es importante preocuparse por el peso de la aplicación?

Es importante ya que cada navegador debe descargar los archivos JavaScript de la aplicación y luego analizarlos, compilarlos y ejecutarlos.

Y si nuestros archivos pesan mucho, el tiempo de carga de la aplicación puede ser alto, además a veces se incluyen librerías muy pesadas que agregan un gran peso de la aplicación.

Import Cost

Esta extensión nos permite conocer el peso de cada uno de nuestros imports en VSCode, mostrando aun costado su peso.

¿Cómo instalarlo?

Solo debemos ir a VSCode y entrar a la sección de extensions y luego buscar Import Cost, te debe mostrar algo similar a la siguiente pantalla:

Luego solo debes instarlo y ¡listo!

En este video hablo mucho mas en particular de esta extensión y una demostración de como funciona en un proyecto Angular.

¡Compártelo!