El término AJAX se presentó por primera vez en el artículo «Ajax: A New Approach to Web Applications» publicado por Jesse James Garrett el 18 de Febrero de 2005. Hasta ese momento, no existía un término normalizado que hiciera referencia a un nuevo tipo de aplicación web que estaba apareciendo.

En realidad, el término AJAX es un acrónimo de Asynchronous JavaScript + XML, que se puede traducir como «JavaScript asíncrono + XML».

El artículo define AJAX de la siguiente forma:

Ajax no es una tecnología en sí mismo. En realidad, se trata de varias tecnologías independientes que se unen de formas nuevas y sorprendentes.

Las tecnologías que forman AJAX son:

  • XHTML y CSS, para crear una presentación basada en estándares.
  • DOM, para la interacción y manipulación dinámica de la presentación.
  • XML, XSLT y JSON, para el intercambio y la manipulación de información.
  • XMLHttpRequest, para el intercambio asíncrono de información.
  • JavaScript, para unir todas las demás tecnologías.

Figura 1. Tecnologías agrupadas bajo el concepto de AJAX

Desarrollar aplicaciones AJAX requiere un conocimiento avanzado de todas y cada una de las tecnologías anteriores.

En las aplicaciones web tradicionales, las acciones del usuario en la página (pinchar en un botón, seleccionar un valor de una lista, etc.) desencadenan llamadas al servidor. Una vez procesada la petición del usuario, el servidor devuelve una nueva página HTML al navegador del usuario.

En el siguiente esquema, la imagen de la izquierda muestra el modelo tradicional de las aplicaciones web. La imagen de la derecha muestra el nuevo modelo propuesto por AJAX:

Figura 2. Comparación gráfica del modelo tradicional de aplicación web y del nuevo modelo propuesto por AJAX. (Imagen original creada por Adaptive Path y utilizada con su permiso)

Esta técnica tradicional para crear aplicaciones web funciona correctamente, pero no crea una buena sensación al usuario. Al realizar peticiones continuas al servidor, el usuario debe esperar a que se recargue la página con los cambios solicitados. Si la aplicación debe realizar peticiones continuas, su uso se convierte en algo molesto

AJAX permite mejorar completamente la interacción del usuario con la aplicación, evitando las recargas constantes de la página, ya que el intercambio de información con el servidor se produce en un segundo plano.

Las aplicaciones construidas con AJAX eliminan la recarga constante de páginas mediante la creación de un elemento intermedio entre el usuario y el servidor. La nueva capa intermedia de AJAX mejora la respuesta de la aplicación, ya que el usuario nunca se encuentra con una ventana del navegador vacía esperando la respuesta del servidor.

El siguiente esquema muestra la diferencia más importante entre una aplicación web tradicional y una aplicación web creada con AJAX. La imagen superior muestra la interación síncrona propia de las aplicaciones web tradicionales. La imagen inferior muestra la comunicación asíncrona de las aplicaciones creadas con AJAX.

Figura 3. Comparación entre las comunicaciones síncronas de las aplicaciones web tradicionales y las comunicaciones asíncronas de las aplicaciones AJAX (Imagen original creada por Adaptive Path y utilizada con su permiso)

Las peticiones HTTP al servidor se sustituyen por peticiones JavaScript que se realizan al elemento encargado de AJAX. Las peticiones más simples no requieren intervención del servidor, por lo que la respuesta es inmediata. Si la interacción requiere una respuesta del servidor, la petición se realiza de forma asíncrona mediante AJAX. En este caso, la interacción del usuario tampoco se ve interrumpida por recargas de página o largas esperas por la respuesta del servidor.

Desde su aparición, se han creado cientos de aplicaciones web basadas en AJAX. En la mayoría de casos, AJAX puede sustituir completamente a otras técnicas como Flash. Además, en el caso de las aplicaciones web más avanzadas, pueden llegar a sustituir a las aplicaciones de escritorio.

A continuación se muestra una lista de algunas de las aplicaciones más conocidas basadas en AJAX:

Tabla de Contenido
Capítulo 1. Introducción a AJAX
Capítulo 2. JavaScript básico
2.1. Sintaxis
2.2. Variables
2.3. Palabras reservadas
2.4. Tipos de variables
2.5. Operadores
2.6. Objetos nativos de JavaScript
2.7. Funciones
2.8. Funciones y propiedades básicas de JavaScript

Capítulo 3. JavaScript avanzado
3.1. Objetos
3.2. Clases
3.3. Otros conceptos

Capítulo 4. DOM (Document Object Model)
4.1. Introducción a DOM
4.2. Tipos de nodos
4.3. La interfaz Node
4.4. HTML y DOM

Capítulo 5. BOM (Browser Object Model)
5.1. Introducción a BOM
5.2. El objeto window
5.3. El objeto document
5.4. El objeto location
5.5. El objeto navigator
5.6. El objeto screen

Capítulo 6. Eventos
6.1. Modelo básico de eventos
6.2. El flujo de eventos
6.3. Handlers y listeners
6.4. El objeto event
6.5. Tipos de eventos
6.6. Solución cross browser

Capítulo 7. Primeros pasos con AJAX
7.1. Breve historia de AJAX
7.2. La primera aplicación
7.3. Métodos y propiedades del objeto XMLHttpRequest
7.4. Utilidades y objetos para AJAX
7.5. Interacción con el servidor
7.6. Aplicaciones complejas
7.7. Seguridad

Capítulo 8. Técnicas básicas con AJAX
8.1. Listas desplegables encadenadas
8.2. Teclado virtual
8.3. Autocompletar

Capítulo 9. Técnicas avanzadas con AJAX
9.1. Monitorización de servidores remotos
9.2. Lector RSS
9.3. Google Maps

Capítulo 10. Frameworks y librerías
10.1. El framework Prototype
10.2. La librería scriptaculous
10.3. La librería jQuery
10.4. Otros frameworks importantes

Capítulo 11. Otras utilidades
11.1. Detener las peticiones HTTP erróneas
11.2. Mejorar el rendimiento de las aplicaciones complejas
11.3. Ofuscar el código JavaScript
11.4. Evitar el problema de los dominios diferentes

Capítulo 12. Recursos útiles
Capítulo 13. Bibliografía
Capítulo 14. Ejercicios resueltos

Enlaces de Descarga
Descargar desde Drive
Descargar desde MediaFire
Fuente: Javier Eguíluz Pérez