29 de agosto de 2006

Ajax - Cada día descubrimos más aplicaciones para una técnica de más de 10 años

Estabamos preguntándonos acerca de si era hora de empezar a cambiar nuestras páginas al estandar de 1024 píxeles de ancho cuando apareció ante mi el siguiente parámetro en una hoja CSS.

width:948px
Es algo así como 1024 menos la barra de desplazamiento y un poquito de margen.

¿Adivinen de donde saqué esto?

Es el ancho fijo de la página de Yahoo!!!! Solo cuando tu monitor está en 1024.
Pero si la ven en una resolución de 800x600 entonces se ajusta a 785 fijo, sin encojer ni alargar nada solo cambiando el contenido, es decir desaparece una barra de menú lateral y los contenidos y contenedores se desplazan a otras posiciones. Nada de "liquid layout". Sería algo así como "Intelligent Layout"

Para que puedan comprobarlo, cambien la resolución del monitor y solicítenle la página home a Yahoo. Luego cierren el navegador, cambien la resolución nuevamente y repitan el proceso. Al principio pueden llegar a creer que Yahoo les ha enviado una página completamente diferente. No se preocupen es la misma.

Esto es algo más complejo que la programación liquida, es diagramación "by request".
Claro que pueden surgir algunas dudas sobre esto como por ejemplo...

Pregunta: ¿Cómo hago del lado del servidor para saber el tamaño del monitor del usuario si aún no ha llegado mi código a su navegador y/o no me ha solicitado otra página?
Respuesta: AJAX

Pregunta: ¿Cómo hago para generar un contenido diferente para cada usuario en una misma página basado en una información que no he recibido hasta enviarle dicha página? (es la misma pregunta algo más elaborada)
Respuesta: AJAX

Lo explico en palabras simples: Yahoo envía en realidad una "página scout" (full javascript, XLM DOM, DHTML y solo aquellos contenidos que siempre se van a mostrar) que es realmente es un analizador de las características del usuario y según estas características el código de la "página scout" contruye y ubica los layers y contenedores adecuados en las posiciones adecuadas. Luego mediante Ajax, se solicita la información necesaria solo para los contenedores creados y no se trae la información no requerida y/o aún no solicitada. Después a medida que el usuario hace click en los contenedores (las pestañas y/o botones) se solicita la información y se va mostrando a medida que llega.

En fin Ajax permite lo que todos los programadores WEB alguna vez hemos soñado: Obtener información del servidor sin necesidad de solicitar una nueva página. Para comprobar si lo que digo es cierto, seleccionen un texto dentro de uno de los contenedores ocultos (cambiando de pestaña) luego vayan al código fuente a ver si lo encuentran... ¡Como por arte de magia, no está!!!

Claro lo que están viendo en el fuente es la "página scout" que llegó antes de solicitar dicho contenido. Solo tiene partes que se muestran en el arranque, pero lo que el usuario puede solicitar después (70% o más de la información total) no está allí.

¿Cuál es la idea? Bueno antes que nada, no solicitar al server lo que el usuario no está interesado en recibir, evitando carga innecesaria de contenido. Luego, poder presentar gran cantidad de opciones sin necesidad de navegar a otras páginas y solo solicitar la información necesaria si es requerida. Además enviar datos del usuario al servidor sin necesidad de esperar a la carga de una segunda página.

Ajax: Asincronous Javascript & XML , es más que una unión de tecnologías con más de 10 años. Ajax es una nueva filosofía de programación...

1 comentario:

Mauro Maulini R. dijo...

La verdad me había olvidado de comentar que si quieren ver Ajax en acción y entender rápido lo que implica esta tecnología, no dejen de visitar Google Suggest Solocolocan una letra en el camo de búsqueda y esperen a que Ajax se muestre...

Entradas populares