Ajax (II): Unión de tecnologías

En un post anterior explicaba una definición y una introducción a lo que era el Ajax, que historia había seguido y en qué navegadores se había estado implementando este objeto.

Tecnologías para Ajax

Como bien se dijo, Ajax no es una tecnología en sí, sino una unión de tecnologías con el fin de crear una mejor experiencia de usuario. Estas tecnologías son:

• XHTML y CSS basada en estándares.
• DOM para la interacción dinámica con el documento.
• XML, JSON,…, para el intercambio de datos con el servidor.
• XMLHttpRequest establecer el canal de comunicación entre el cliente y el servidor.
• Javascript para tratar el fichero (XML, JSON) del servidor, tratarlo e incluirlo por DOM a la página.

Figura 2.1. Tecnologías que agrupan el concepto Ajax

Como bien se ve en la figura 2.1, Javascript es el puente entre las comunicaciones y la presentación.

Modelo tradicional vs Modelo Ajax

El proceso en las web tradicionales era:

1. El usuario pide una página a un servidor,
2. El servidor le devuelve la página que pidió al usuario,
3. El usuario interactúa con los datos de la página (formularios, tablas, …),
4. El usuario realiza una acción (ejecutar un href, un formulario, …),
5. El servidor procesa los datos que introdujo el usuario y calcula la respuesta,
6. Y el servidor devuelve otra página completa con los nuevos datos al usuario.

Figura 2.2. Comparativa entre el modelo clásico y el modelo Ajax

Como se ve en la Figura 2.2, la gran diferencia que existe entre el modelo clásico web y el modelo Ajax Web es lo que envía el servidor. En el modelo clásico envía la página completa con las hojas de estilo, los javascript asociados, las imágenes y los componentes que necesite esa página. En el modelo Ajax lo único que envía el servidor son los datos que necesitan ser refrescados al cliente.

Las dos mayores ventajas son:

1. No hay que refrescar la página del cliente para mostrar nuevos datos
2. Se reduce bastante la transferencia del servidor

Figura 2.3. Comparativa de sincronización entre el modelo clásico y el modelo Ajax

En el modelo tradicional el que hace la petición es el navegador, en el modelo actual la petición HTTP la hace Javascript.

Fuentes e Imágenes obtenidas de:

1. Artículo en adaptative path de Jesse James Garret
2. Capítulo 1 del libro de Ajax en librosweb.es