Elegir entre Fetch o Axios

| Última modificación: 8 de abril de 2024 | Tiempo de Lectura: 3 minutos

Algunos de nuestros reconocimientos:

Premios KeepCoding

¿Quieres saber si elegir entre Fetch o Axios? Con su constante crecimiento, el mundo de la programación se expande cada vez más allá de los lenguajes de programación y de los editores de código. Hoy en día, existen muchas otras herramientas que nos facilitan el proceso de desarrollo. Una de ellas son las librerías, conjuntos de archivos enfocados en facilitar determinadas acciones.

En este post, te enseñaremos cuáles son las diferencias entre las dos mayores herramientas de peticiones HTTP para que puedas decidir si usar Fetch o Axios.

¿De qué estamos hablando?

Cuando hablamos de Fetch o Axios estamos haciendo una comparación entre dos herramientas que nos permiten hacer peticiones HTTP. A continuación, te aclaramos exactamente cómo funciona cada una de estas herramientas para que luego podamos decidir si es mejor usar Fetch o Axios.

Axios

Axios es una biblioteca diseñada para simplificar una tarea específica en el código JavaScript: realizar solicitudes a URL o líneas HTTP. En esencia, Axios funciona como un cliente HTTP, permitiéndonos realizar solicitudes de datos a una URL. Su aplicación más frecuente radica en realizar solicitudes de tipo GET a la URL de una API para obtener los datos de interés.

Para conocer más sobre esta herramienta, te invitamos a leer los artículos que tenemos sobre Axios; en particular, te recomendamos librería Axios para JavaScript, configurar un cliente en Axios y crear una función get con un cliente en Axios.

fetch o axios

Fetch

Como puedes leer en nuestro post sobre hacer peticiones HTTP con Fetch, Fetch es una herramienta muy similar a Axios, ya que nos permite ejecutar las mismas acciones: llamar a una URL, pedir datos determinados y procesarlos. La diferencia principal de Fetch en relación a Axios es que esta es una herramienta implementada directamente dentro del navegador.

¿Qué quiere decir esto? Pues que fetch es un método nativo del Browser Object Model (también conocido como BOM por sus siglas en inglés), un concepto que nos permite acceder y manipular las propiedades del navegador desde su diversidad de métodos.

Un detalle muy importante a la hora de trabajar con Fetch es que sus peticiones se ejecutan a través de promesas. Esto se da porque las peticiones HTTP no tienen un tiempo determinado, por lo que se consideran procesos asíncronos. Para entender aún más este detalle, te invitamos a leer nuestro post sobre promesas en frontend JavaScript.

¿Fetch o Axios?

Ahora que sabemos exactamente de qué estamos hablando, es hora de saber qué es mejor, Fetch o Axios. A continuación, te explicamos algunos factores que nos pueden ayudar a tomar esta decisión.

Dependencias

Como te explicamos anteriormente, Axios es una librería y Fetch es una herramienta nativa del navegador. Esto toma importancia cuando estamos decidiendo qué tipo de desarrollo vamos a hacer.

Algunos desarrolladores prefieren crear proyectos de 0 dependencias. Esto significa ejecutar todo el código sin herramientas o librerías externas a los lenguajes de programación principales. En estos escenarios, Fetch es una herramienta más deseable, pues su estado nativo hace que no creemos ninguna dependencia externa.

¿Por qué es bueno evitar dependencias? Si creas un proyecto con muchísimas dependencias estarás, como su nombre indica, dependiendo de la evolución de estas librerías. Esto quiere decir que tu código o partes de tu código pueden dejar de funcionar según lo que suceda en la vida de la herramienta.

Potencia

También vale la pena tomar en cuenta la potencia de las herramientas a la hora de decidir si usar Fetch o Axios. La realidad es que Axios es mucho más completa que Fetch, pues es una librería entera y no un solo método. Esto quiere decir que nos brinda más posibilidades, como el uso de interceptors en una petición HTTP (puedes conocer este concepto en nuestro post sobre interceptors para un cliente React).

Por este tipo de posibilidades, es mejor usar Axios cuando vamos a ejecutar una diversidad de acciones recurrentes en un proyecto grande. Sin embargo, si vas a ejecutar algo muy puntual y concreto, podrás usar Fetch sin ningún problema, con lo que evitarás también generar una nueva dependencia en un proyecto sencillo.

Tras leer este post, sabes exactamente qué puede guiar nuestra decisión entre elegir Fetch o Axios y estás listo para usar la opción que elijas en tus propios proyectos. Por ello, te recomendamos nuestro Desarrollo Web Full Stack Bootcamp, un espacio en el que aprenderás a desarrollar tus propios proyectos de programación web con lenguajes como JavaScript, HTML, CSS, JSX y muchas otras herramientas. ¿Quieres ser un desarrollador web profesional? ¡Matricúlate ya!

Alberto Casero

Alberto Casero es CTO en Watium, Fundador de Kas Factory & Coordinador del Bootcamp en Desarrollo Web.

Posts más leídos

¡CONVOCATORIA ABIERTA!

Desarrollo Web

Full Stack Bootcamp

Clases en Directo | Profesores en Activo | Temario 100% actualizado