Como Combinar Varios Archivos JavaScript en Uno Solo

3 minuto(s)

Parte de mejorar la velocidad de carga de una web, es trabajar en hacer menos solicitudes posibles en nuestro servidor.

Las solicitudes de varios archivos JavaScript locales o de terceros en un servidor pueden afectar la velocidad de una web.

En este tutorial aprenderás a Como Combinar Varios Archivos JavaScript en Uno Solo, vamos con ello.

Archivo JavaScript que contiene varios archivos JavaScript
Uno de los objetivos de combinar varios archivos en uno solo, es hacer SEO

Sigue los pasos que te indico a continuación para que todo salga bien.

Abre con el navegador Google Chrome la web a la cual quieres combinar sus archivos JavaScript en uno solo.

Presiona los 3 puntitos en vertical que se encuentran en la parte superior derecha y ve a Más herramientas > Herramientas para desarrolladores:

Pasos para abrir las Chrome DevTools
También puedes presionar la tecla F12 o CTRL + SHIFT + I (Windows) y en Mac y Linux sus similares

Te aparecerán las herramientas para desarrolladores de Google Chrome o Chrome DevTools.

Presiona sobre el panel Red y al lado izquierdo activa el botón para grabar la actividad de la red.

Cuando actives el botón para grabar la actividad de la red, este se pondrá de color rojo:

Opción para grabar la actividad de la red en Chrome Devtools
También puedes presionar las teclas CTRL + E (Windows) para activarlo y en Mac y Linux sus similares

Ahora actualiza la página web para que el grabador empiece a detectar y grabar la actividad de la web.

Abajo te aparecerán todos los archivos que tiene la web, presiona la columna Tipo para organizar los archivos por tipo.

Luego busca los archivos de tipo script, este tipo de archivos son archivos JavaScript.

Presiona el botón derecho del mouse sobre cada archivo JavaScript que desees combinar y pulsa Guardar como… para guardarlo en tu computadora:

Descargando los archivos JavaScript para poder combinarlos
Te aparecerán otros tipos de archivos en este panel

Una ves que tengas descargados todos los archivos JavaScript que desees combinar en un solo archivo JavaScript

Ve a esta herramienta online.

Abre cada archivo JavaScript con el bloc de notas o editor de código que tengas instalado en tu computadora.

Paso seguido copia y pega el código de cada uno de ellos en el editor del lado izquierdo de la herramienta online que te mencione anteriormente.

En la herramienta puedes ir viendo al lado derecho como va quedando el código combinado y minificado, también puedes ver el peso del archivo al combinar todos los archivos JavaScript.

En el editor del lado derecho presiona el botón que dice Download para descargar el archivo JavaScript que contiene todo el código combinado de todos los archivos JavaScript:

Combinando varios archivos JavaScript en uno solo
Esta herramienta te muestra los resultados en tiempo real al lado derecho

El archivo te lo descarga con la extensión o formato TXT, debes convertirlo a formato o extensión JS.

En el siguiente video te enseño a Como Cambiar La Extensión de Un Archivo en Windows 10/11 sin usar programas adicionales:

Una vez que tengas listo tu archivo JavaScript, súbelo a tu hosting o servidor.

Recuerda eliminar los archivos JavaScript que previamente combinaste, porque si no estarías llamando el mismo código JavaScript de manera doble.

Así de fácil puedes combinar varios archivos JavaScript en uno solo.

Conclusión

En este tutorial has aprendido a Como Combinar Varios Archivos JavaScript en Uno Solo.

Practica muchos los pasos que te compartí en este tutorial, solo así lograrás dominar este proceso.

Nota(s)

  • No olvides que debemos usar la Tecnología para hacer cosas Buenas por el Mundo.

Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenidos.