En la década de 1990, cada vez que un sitio web se actualizaba ligeramente con nueva información, toda la página web tenía que ser actualizada y recargada. Hoy en día, gracias a algunas técnicas conocidas colectivamente como Ajax, podemos actualizar gradualmente partes de las páginas web sin interrumpir la experiencia del usuario. Probablemente lo hayas visto en Google cuando te da sugerencias de búsqueda mientras escribes. Cada vez que veas una parte de la actualización de una página web sin que se actualice toda la página web, eso es Ajax en el trabajo.

Ajax

Ajax, abreviatura de Asynchronous JavaScript and XML, es un acercamiento al uso de tecnologías existentes para hacer peticiones HTTP dinámicas. Las aplicaciones web suelen funcionar de la siguiente manera: una petición se realiza desde un navegador para obtener información de un servidor, el servidor envía la información apropiada y el navegador actualiza la página del usuario. Sin embargo, con Ajax, existe un inter- mediador entre el navegador y el servidor conocido como motor Ajax; la presentación visual de un sitio web (HTML/CSS) está separada del manejo de las peticiones HTTP. Al utilizar un motor Ajax (escrito en JavaScript) para manejar las solicitudes HTTP, la página HTML y CSS que se muestra en el navegador se mantiene mientras se realiza la solicitud. Una vez que la información de la solicitud ha llegado al navegador, el motor de Ajax puede actualizar directamente sólo una parte del HTML o CSS de la página, evitando que se recargue toda la página.

Debido a que el servidor ya no necesita enviar datos HTML/CSS completos, Ajax utiliza anotaciones simples para enviar pequeños paquetes de información. XML, o Extended Markup Language, es una notación que se utiliza para enviar información. Sin embargo, la mayoría de los programadores de hoy en día utilizan JSON, o JavaScript Object Notation, porque es nativo de JavaScript.

Todas estas tecnologías trabajan juntas para permitir la programación asíncrona. La programación sincrónica es cuando tiene que esperar a que las partes anteriores de su programa terminen de ejecutarse antes de pasar a otra tarea. Sin embargo, en la programación web, la aplicación web tiene que estar escuchando muchos eventos posibles a la vez y luego actuar en consecuencia. La programación asíncrona permite a los programas manejar múltiples tareas a la vez. El uso de programación asíncrona con JavaScript significa que las aplicaciones web pueden esperar y responder a cualquier número de eventos, reduciendo el tiempo de respuesta de las aplicaciones y mejorando la experiencia del usuario.

https://edutin-publico.s3.amazonaws.com/documents/documents/JjhEgx1P4R/archivo.png

XMLHttpRequest y jQuery

Las técnicas de programación que componen Ajax están envueltas en un objeto Javascript nativo conocido como el objeto XMLHttpRequest (XHR). Este objeto contiene las funciones para controlar el motor Ajax y realizar peticiones HTTP asíncronas. El objeto XHR permite que las funciones dependan del estado en que se encuentre una solicitud, lo que permite que los usuarios de aplicaciones web disfruten de una experiencia sin problemas. Muchos programadores usan XHR indirectamente a través de jQuery porque la sintaxis es más conveniente. Gracias a los programadores que nos han precedido, todo lo que tienes que hacer para tomar ventaja de Ajax en tus proyectos es leer la documentación de los objetos jQuery y XHR.