miércoles, 1 de mayo de 2013

¿Que es Ajax?


•     En realidad, el término AJAX es un acrónimo de Asynchronous JavaScript + XML, que se puede traducir como "JavaScript asíncrono + XML".
•     Es una técnica de desarrollo web que genera aplicaciones web interactivas combinando:
XHTML  Y CSS para la presentación de información.
Document Object Model(DOM) para visualizar dinámicamente e interactuar con la información presentada.
XML,XSLT para intercambiar y manipular datos.
XMLHttpRequest para recuperar datos asíncronamente.
JavaScript  como nexo de unión de todas estas tecnologías.
•     Es una técnica de programación que nos permite convertir nuestra pagina web en un verdadero programa de escritorio.
•     No requiere plugins o capacidades especificas de ciertos navegadores.
•     Ajax es una tecnología asíncrona, en el sentido de que los datos adicionales se solicitan al servidor y se cargan en segundo plano sin interferir con la visualización ni el comportamiento de la página.
•     El corazón de Ajax es el objeto XMLHttpRequest que nos permite realizar una conexión al servidor y al enviarle una petición y recibir la respuesta que procesaremos en nuestro código JavaScript, estamos hablando del verdadero motor de Ajax, por ejemplo gracias a este objeto podemos desde una página HTML leer datos de una web o enviar datos de un formulario sin necesidad de recargar la página.

sincronico o asincronico?


La diferencia está en el propio significado de las palabras.

En el caso síncrono, quiere decir que la llamada se hace de forma continua. Es decir, igual que llamas     a cualquier función normalmente:
Código:
var respuesta = ajax.open(...);
alert(respuesta);
Llamas y la ejecución se espera hasta que la llamada responde. En la siguiente línea puedes hacer el alert porque sabes que ya se ha recibido la respuesta. El problema es que, como decía, hasta que no responda la llamada, la ejecución se para y se queda esperando. El navegador se bloquea.

En el caso asíncrono, no se espera a recibir la respuesta, sino que se le asocia a la llamada una función de callback y se continúa la ejecución. Cuando se reciba la respuesta (aproximadamente), se llamará a la función que se pasó.
Código:
ajax.open(...);
ajax.onreadystatechange = mifuncion;
ajax.send(null);
// otras cosas...
Cuando haces la petición, no esperas a que se reciba la respuesta, sino que la ejecución sigue y le dices "cuando se reciba la respuesta, llama a mifuncion para avisar".



Características Ajax

       Las aplicaciones son más interactivas, responden a las interacciones del usuario más rápidamente, al estilo aplicaciones de escritorio.
       Estas aplicaciones tienen un aspecto (look and feel) muy similar a las aplicaciones de escritorio tradicionales sin depender de plugins o características específicas de los navegadores.
       Se reduce el tamaño de la información intercambiada
       Muchas micro-peticiones, pero el flujo de datos global es inferior
       Se libera de procesamiento a la parte servidora (se realiza en la parte cliente)
       AJAX actualiza porciones de la página en vez de la página completa


Aplicaciones desarrolladas con Ajax


Flickr Yahoo
es un espacio gratuito donde todo el mundo puede subir su fotos y exponerlas al resto del mundo , en un principio flickr utilizaba Macromedia flash para poder mostrar fotos  y hacerla girar y  insertar comentarios sobre ellas
Desde hace ya un tiempo incorpora AJAX haciendo la navegación mas ligera, accesible e intuitiva.
 a día de hoy flickr cuenta con mas de  un millón de miembros , los cuales interactúan gracias  a  AJAX con su imagen en tiempo real .
Outlook Web Access
El primer programa AJAX por entonces el objeto XMLhttpRequest solo tenia el internet  Explorer de Microsoft.
Google Suggest
 Permite comprobar instantáneamente el numero de resultados que una búsqueda va a tener mientras se esta escribiendo la misma.
Ajax  realiza búsquedas rápidas (ej. datos personales, numero de teléfono ) o solucionar problemas  a la hora de auto completar campos específicos en el formularios.
Google Maps
 Es la aplicación que empezó la fiebre AJAX.
Ajax es empleado en google maps para poder recargar pequeños cuadros de imagen que forman el plano visible , por otro lado permite mostrar de forma intuitiva herramientas de análisis  zoom ect.
Yahoo
El equipo de web mail Oddpost actualmente esta trabajando en rediseñar Yahoo! Mail siguiendo la filosofía AJAX

Preguntas frecuentes sobre Ajax


      ¿Para que nos sirve Ajax?
      Ajax nos sirve principalmente para diseñar y programar interfaces  de usuarios mucho mas a ya de la web , rompiendo las limitaciones que la «sincronia » supone y abriendo una nueva puerta que nos permitirá desarrollar aplicaciones que un principio solo podrían concebirse para el escritorio, en aplicaciones web.
¿Qué hace?
         simplemente actualiza una porción de nuestra pagina web sin necesidad de cargar el código, atributos gráficos e imágenes de nuevo.
¿ para que sirve?
        es una técnica de desarrollo web para crear aplicaciones interactivas o RIA (Rich Internet Applications). Estas aplicaciones se ejecutan en el cliente, es decir, en el navegador de los usuarios mientras se mantiene la comunicación asíncrona con el servidor en segundo plano. De esta forma es posible realizar cambios sobre las páginas sin necesidad de recargarlas, lo que significa aumentar la interactividad, velocidad y usabilidad en las aplicaciones.
¿Es necesario?
         en ciertos casos es necesario, digamos por ejemplo “maps.google.com” sin la habilidad AJAX no se podrían dibujar mapas o crear aplicaciones que parezcan como si estuviesen corriendo localmente (EXT JS),

Ventajas y desventajas de Ajax


Ventajas
       Utiliza tecnologías ya existentes.
       Soportada por la mayoría de los navegadores modernos.
       Interactividad. El usuario no tiene que esperar hasta que lleguen los datos del servidor.
       Portabilidad (no requiere plug-in como Flash y Apple de Java)
       Mayor velocidad, esto debido que no hay que retornar toda la página nuevamente.
       La página se asemeja a una aplicación de escritorio.
Desventajas
       Se pierde el concepto de volver a la página anterior.
       Si se guarda en favoritos no necesariamente al visitar nuevamente el sitio se ubique donde nos encontrábamos al grabarla.
       La existencia de páginas con AJAX y otras sin esta tecnología hace que el usuario se desoriente.
       Problemas con navegadores antiguos que no implementan esta tecnología.
       No funciona si el usuario tiene desactivado el JavaScript en su navegador.
       Requiere programadores que conozcan todas las tecnologías que intervienen en AJAX.
       Dependiendo de la carga del servidor podemos experimentar tiempos tardíos de respuesta que desconciertan al visitante.

Ajax y los navegadores


       Navegadores que permiten Ajax
       Ha de tenerse en cuenta que ésta es una lista general, y el soporte de las aplicaciones Ajax dependerá de las características que el navegador permita.
       Navegadores basados en Gecko como MozillaMozilla FirefoxSeaMonkeyCaminoK-MeleonIceWeaselFlockEpiphanyGaleon y Netscape versión 7.1 y superiores
       Navegadores basados en WebKit como Google Chrome de Google o Safari de Apple.
       Microsoft Internet Explorer para Windows versión 5.0 y superiores, y los navegadores basados en él
       Opera versión 8.0 y superiores, incluyendo Opera Mobile Browser versión 8.0 y superiores.
       Navegadores que no permiten Ajax
       Opera 7 y anteriores
       Microsoft Internet Explorer para Windows versión 4.0 y anteriores
       Anteriores a Safari 1.2
       Navegadores basados en texto como Lynx y Links
       Navegadores para personas con capacidades especiales visuales (Braille)
       Algunos navegadores de teléfonos móviles
       Navegador de la PSP