Imagen de avatar anacareaga
Ana Lilia Careaga

Ajax: la pasión del futbol de la web

Ana Lilia Careaga Mercadillo, Julio de 2014

Abstract

AJAX stands for Asynchronous Javascript and XML, and its meaning refers to a special way for web pages to access the server avoiding to reload the entire page submitting information back to the server and making necessary a refresh of the page in which case the user would have to wait. With AJAX, the browser is able to make a request in the background asynchronously ; meanwhile the user is looking at the page. When the JavaScript web request finishes, it returns data to the browser; sometimes as XML. Ajax is a new way of looking at technology that is already mature and stable because AJAX is a collection of old technologies that work together .These groups of technologies comprise client technology as HTML , CSS and JavaScript; and server technology as WML, XSLT and XMLHttpRequest. AJAX allows displaying web pages with interactive, efficient and quick interfaces, thus, it benefits the user; that is why web giants like Google, effectively utilize AJAX in their web applications like Google Maps and Gmail.

———————————————————-


“Así es esto del futbol…” ; es una frase que resume con certeza la esencia de este deporte que se convierte en la cancha en un verdadero arte de lo imprevisto y en un espectáculo capaz de producir muchas emociones individuales y colectivas. Científicamente podríamos explicarlo como un fenómeno emocional que genera dopamina colectiva para producir alegrías y tristezas; ira y violencia; en pocas palabras una locura colectiva en la derrota o en la victoria. Pero el futbol es muchas cosas más; es negocio y entretenimiento; técnica y tecnología; es pasión y religión. Porque el futbol es fe, entusiasmo, calor, exaltación, un campo de fuerzas y una permanente apuesta de que tu equipo va a triunfar; pero sobre todo es pasión universal que se vive durante la Copa del Mundo hasta en los que no saben nada de futbol y tanto para ellos como para los que sí saben de futbol, quizá valga la pena recordar:

14 de julio de 1930. Este es el día en que los sueños de Jules Rimet, presidente de la FIFA en aquel entonces, y los sueños de muchas personas más se volvieron realidad. Se trata del día en que se jugaron los primeros dos partidos, de forma simultánea, de la Copa Mundial de la FIFA: EUA vs Bélgica y México vs Francia. Así es, México es parte importante de la historia del futbol al jugar el primer partido en la historia de los mundiales, a pesar de haber perdido 4-1 y haber recibido el primer gol en la historia. Menciono los “sueños” de Jules Rimet ya que por años se intentó organizar un torneo internacional de futbol, un torneo digno en el cual pudieran participar jugadores profesionales al igual que amateurs (en algunos países el futbol aún no se profesionalizaba. En México fue hasta 1943). Por esta razón, cuando el Comité Olímpico Internacional aceptó incluir el futbol en las Olimpiadas, en 1906, esto era lo más cercano a un mundial en aquella época. En 1928, se planteó organizar un torneo de futbol, independiente a las Olimpiadas. Para este año, la FIFA contaba ya con los recursos necesarios para lograrlo. Uruguay, al haber ganado las Olimpiadas de 1924 y 1928, parecía ser el país indicado para ser la sede y organizar el primer mundial. Además, en julio de 1930 estaría celebrando el centenario de su independencia. No se dijo más y se designó a Uruguay como la sede del primer mundial de la historia. Los sueños de Jules Rimet se cumplieron, al igual que los sueños de Pierre de Coubertin cuando en 1896 se llevaron a cabo las primeras Olimpiadas de la modernidad, en Atenas.

Quizá Jules Rimet no sabía que la tal “Copa Mundial de la FIFA” se convertiría en un fenómeno”. Así es, un fenómeno mundial que ocurre cada cuatro años. Una esperanza que resurge en los países participantes cada cuatro años de alcanzar la gloria. Un sentimiento de nacionalismo y orgullo por la patria, que no se vive con cualquier otro evento de cualquier otra índole. El mundo gira alrededor del balón durante un mes. El mundo se paraliza durante un mes.
Que ruede el balón y el mundo se paralice…[1]

Sí, el Mundial de futbol Brasil 2014 es el fenómeno mundial que paraliza al mundo en este momento porque sin duda gran parte de la población de este planeta ha estado eufórica desde su inauguración y durante cuatro semanas los medios se concentran en hacer grandes reportajes de sus selecciones nacionales. En México se dejó a un lado la crisis económica, las leyes secundarias en Telecomunicaciones y Reforma Energética; los problemas de la Línea 12 del metro y la corrupción… porque por ahora, solo se habla de futbol y se vive el futbol. Indudablemente, la fiebre de la pasión del futbol está actualmente en su esplendor como cada cuatro años; pero , en nuestro caso, mitigada por la eliminación en los octavos de final por sexta ocasión consecutiva. La dramática derrota del pasado 29 de junio ante los holandeses nos hizo presente ese sentimiento derrotista mexicano; ese sentimiento que nos hace recordar que fuimos conquistados por los españoles y que además perdimos no solo una guerra contra Estados Unidos, sino la mitad de nuestro territorio. En las Copas del Mundo de futbol si bien México es de los países que más ha participado (15 mundiales de 20), también es de los que más derrotas ha acumulado. De 53 partidos jugados, cuenta con 14 ganados, 14 empatados y 25 perdidos; colocándolos en el lugar histórico número 13. [2]

Fuente: Estadísticas FIFA

Es cierto. Quizá México ha quedado a deber en los últimos mundiales al ser incapaz de calificar al tan ansiado quinto partido. Las únicas ocasiones en que México ha estado entre los mejores 8 de la competencia ocurrieron en 1970 y 1986, cuando el mundial se organizó en nuestro país. Cabe destacar que aquellos dos mundiales son considerados como unos de los más espectaculares y memorables de la historia, por las figuras, equipos y partidos inolvidables. En 1970 fue el Brasil de Pelé, aquel equipo plagado de estrellas que dominó a sus rivales y acabó por coronarse. Pelé se consolidó como el mejor de la historia al ganar su tercer mundial. La atajada del arquero inglés Gordon Banks de un cabezazo a quemarropa de Pelé, y la semifinal entre Alemania e Italia, conocida como “El partido del siglo”, son sucesos al igual inolvidables. En 1986 fue el turno de Maradona y Argentina. ¿Cómo olvidar ese partido de cuartos de final vs Inglaterra, en el cual Maradona se inmortalizó al anotar un gol con la mano y otro burlando a todos los rivales desde la media cancha, hasta finalmente eludir al portero y anotar? Los mundiales organizados en nuestro país son inolvidables, y esto debe llenarnos de orgullo. Quizá en algunos años el Mundial regrese a nuestro país, con nuevas figuras, nuevos estadios, pero con ese ambiente y color mexicano único en el mundo. [3]

En los primeros Mundiales, México era un rival “de chiste” para las potencias del futbol, ya que no era competitivo. Si bien el ansiado quinto partido fuera de casa no ha llegado, el equipo mexicano ha generado respeto con sus actuaciones en los últimos años, en diversas competencias. Ya es un equipo que compite. Los resultados lo demuestran al haber ganado una medalla de oro en los Juegos Olímpicos (Londres 2012) y dos Campeonatos Mundiales sub 17 (2005 y 2011). Podemos ahora estar tristes y algunos haber soltado en llanto pero la verdad es que el trabajo realizado por el “Piojo” Herrera nos ha dado la esperanza para un triunfo en Moscú 2018. Ha llegado el momento de pensar como ganadores y no como perdedores; porque los ganadores, aunque pierdan, siguen trabajando a largo plazo con la seguridad de que volverán a hacerlo. Porque “así es esto del futbol…unos pierden y otros ganan..” .Pero vale la pena mencionar que para la afición mexicana siempre ganan y en los estadios de Brasil no fue la excepción porque se hizo sentir y logró hacer vibrar no solo a los jugadores mexicanos sino a sus adversarios con su “Cielito Lindo” , porque si bien por décadas los himnos europeos dominaban las tribunas y los argentinos se distinguían por sus porras, el Cielito Lindo es el más bello himno del futbol mexicano. Si hubiera una copa mundial para los aficionados, sin duda alguna México sería el campeón del mundo porque la afición azteca es una de las más animadas y originales. Porque además alientan a los jugadores desde el primer toque en la frente precedido por su pisada fuerte y su mirada al cielo buscando su bendición y junto con ellos la afición gritando de corazón…

El Mundial Brasil 2014 no ha llegado a su fin, pero seguramente cuando leas este texto ya sabrás quien fue finalmente el campeón. Quizá haya una sorpresa de un nuevo ganador pero nosotros tendremos que esperar cuatro años más para revivir esta pasión. Seguramente los que vivimos esta pasión del Mundial lo recordaremos como el Mundial de Memo Ochoa o del “Piojo” Herrera; o a lo mejor por el penal teatral de Arjen Robben pero para los que sí saben de futbol y para los que nos gusta la tecnología, este Mundial será especialmente recordado por haber sido el primero que se usó una sofisticada tecnología en la línea de gol (GLT por sus siglas en inglés “goal-line technology) para la determinación de la validación de un gol. Este es un logro importante después de tanta polémica discutida en la FIFA que se negaba a hacer uso de la tecnología para apoyar el arbitraje. En los 64 partidos jugados en las diferentes 12 ciudades de Brasil se implementó un sistema de 7 cámaras colocadas estratégicamente en la zona de la portería enlazadas a una computadora para el proceso de sus imágenes que con una precisión de 5mm puede determinar la existencia de un gol; todo esto en una velocidad en el orden de los nanosegundos!! Este sistema fue también aprovechado durante los entrenamientos incluyendo chips (sensores) en los balones que, junto con una tecnología analítica, permitieron a los jugadores perfeccionar cada jugada en tiempo real.

Por otra parte, para los aficionados que quedamos en casa, hemos podido disfrutar la transmisión de los partidos en alta definición más avanzada conocida con el nombre “UHD” (ultra high definition) que emplea 4,000 pixeles, es decir cuatro veces más que la ya convencional pantalla de 1,080 pixeles verticales. El resultado inmediato de esta tecnología se percibe en la definición de los colores; por ejemplo, los amarillos son más brillantes y los verdes con mayor intensidad. Aunado a ello, el video tiene más nitidez y los movimientos poseen mayor naturalidad y ahora es posible observar hasta la más mínima expresión de los jugadores durante el partido debido a que se aumenta la velocidad de cuadros por segundo de 30 a 60. Por su puesto, el hecho de transmitir una señal de video 4 veces su calidad tiene repercusiones técnicas importantes y para ello la FIFA se asoció con Sony para hacer uso de esta tecnología sólo en algunos partidos reservados para un partido de cuartos de final , semifinales y la final el 13 de julio. Lo que definitivamente no podremos percibir es toda la infraestructura tecnológica que se ha requerido para esta transmisión en vivo y en ultra alta definición; ya que atrás de ella necesariamente hay todo un respaldo de redes ópticas y sistemas sofisticados de monitoreo que dejan pasar esta señal sin la necesidad de recurrir a técnicas de compresión que degradan la calidad.

Una mayor precisión en el arbitraje y una alta calidad de video para los aficionados hará que la tecnología, junto con el campeón mundial sean los verdaderos triunfadores de esta copa Brasil 2014. Y, para los mexicanos, el verdadero triunfo será visto en el siguiente Mundial, cuando hayamos aprendido que el portero Jasper Cillessen del Ajax de Holanda no es mejor que Memo Ochoa ni Arjen Robben del Bayern Munich mejor que Giovani dos Santos u Oribe Peralta. Porque ahora las diferencias técnicas de todos los equipos no son tantas; porque ahora la diferencia está en la mente y no en las piernas.

Pero además de los jugadores del Ajax holandés, hay otro Ajax que ha participado en el desarrollo de muchas apps para la transmisión de la información de la Copa del Mundo así como juegos interactivos de futbol por Internet. Me refiero a la tecnología AJAX , que significa JavaScript Asíncrono, XML y que es una técnica empleada en el desarrollo web en la creación de aplicaciones interactivas conocidas técnicamente bajo el acrónimo RIA (Rich Internet Applications).

¿Quieres saber más sobre AJAX la tecnología web que se usa en muchas apps del Mundial y en otras como Google Maps ?

Continúa leyendo…

Comenzando con lo básico: ¿Qué es el desarrollo web?

Mucha gente confunde el diseño web con desarrollo web pero son cosas completamente diferentes. El diseño web se refiere al diseño gráfico de una página web como la tipografía, colores y proporciones de las imágenes. El producto final del diseño web no contiene código fuente y se emplean herramientas como Photoshop o Flash y se representan en HTML y CSS. La persona que diseña un sitio web suele llamarse “diseñador”.

Por otra parte, el desarrollo web se refiere a la programación necesaria para construir una aplicación o sitio web. Se suele dividir en dos partes conectadas entre sí: la parte cliente y la parte servidor que emplean tecnologías diferentes y funcionan de manera independiente. Para el desarrollo de la parte cliente se requiere tener conocimientos de HTML , CSS, y Javascript y DOM. El desarrollo de la parte servidor requiere la programación necesaria para construir el backend del sitio web que no ven los usuarios pero que es necesario para el funcionamiento del sitio web. Se emplean lenguajes de servidor web (script) como AJAX, JAVA, PHP; ASP, ASP.NET, JSP, Perl y COLDFUSION para acceder a una base de datos (SQL y MySQL) y recuperar la información necesaria para visualizar una página web. Por tanto el desarrollo web también cubre el diseño y desarrollo de las bases de datos. A la persona que realiza una página web se le llama desarrollador.


Crear un sitio web es parecido a construir una casa. Ambos son necesarios porque el desarrollador es el ingeniero que construye cimientos y hace instalación eléctrica y de agua y el diseñador web es el arquitecto que busca la estética de la casa ; diseña la fachada y los acabados. De manera similar, un sitio web requiere tanto del diseñador como del desarrollador.


¿Qué es una RIA?

Si hay algo actualmente glamoroso dentro del desarrollo de software son las aplicaciones web; las cuales, a excepción del iPod han sido los proyectos más innovadores en las últimas décadas. Sin embargo, antes las aplicaciones web hacían infinidad de peticiones al servidor provocando sobrecargas y mayor tráfico entre el servidor y el cliente. Algunas veces esto podía llegar a desesperar a los usuarios.

Las RIAs o Rich Internet Applications son una nueva generación de aplicaciones Web que han nacido últimamente en un ambiente completamente online.

Las RIAs nacen como combinación de las características de las aplicaciones web y las de escritorio. Este tipo de aplicaciones disponen de más ventajas que las aplicaciones tradicionales de Internet ya que ofrecen una interacción rica e interesante que mejora la experiencia de usuario, y así, las empresas pueden mejorar su productividad. Las interfaces son más intuitivas y fáciles para que todo esté al alcance del cliente. Son herramientas web flexibles y dinámicas que proporcionan funciones y usos interesantes, tales como videos, procesadores de texto, juegos online y muchas de las aplicaciones móviles que han ido ganando popularidad en todo el mundo.

En los entornos RIA, la aplicación se carga en el navegador y funciona en el lado del cliente, sin recargas de página ni sobrecarga en el servidor. Y solo se producen peticiones al servidor para ciertas sincronizaciones.

Algunos ejemplos de Plataformas RIA son Adobe Flash, Adobe Flex, Adobe AIR, OpenLaszlo, Silverlight, JavaFX Script, Bindows, GWT, ZK, JavascriptMVC, Javascript y, desde luego, AJAX.

AJAX: Una herramienta para el desarrollo web para la creación de “RIAs”

AJAX fue la palabra de moda en el año 2005 para referirse no al equipo de futbol holandés , ni a ningún tipo de limpiador, ni siquiera al héroe de la mitología griega que describe Homero en la Ilíada como un hombre valiente, recto y silencioso. En tecnología, AJAX se refiere al acrónimo de “Asíncrono+JavaScript (JavaScript asíncrono)+XML.”

AJAX, en realidad no es una tecnología, sino un conjunto de tecnologías independientes que se emplean para crear una nueva con fines específicos en el desarrollo web. Las tecnologías que conforman AJAX son:

• Para crear una presentación basada en estándares existentes: CSS y XHTML
• Para interactuar y manipular dinámicamente la presentación: DOM (Document Object Model)
• Para manipular e intercambiar información: JSON, XSLT y JSON
• Para intercambiar asíncronamente información: XML, HttpRequest
• Y, finalmente para unir todas estas tecnologías: JavaScript

La novedad de AJAX es fácilmente explicable por ser una unión de varias tecnologías; es por ello que sus resultados son sorprendentes como es el caso de Google Maps. El principio es muy sencillo ya que parte de la descarga de la página y posteriormente “renderizarla” mientras se corren rutinas y scripts en el lado servidor. Por ejemplo, cuando se abre Google Maps, se puede hacer un zoom, mover el cursor y seleccionar mapa y también navegar sobre ellos. Todo sucede instantáneamente sin tener que esperar a que la página se recargue nuevamente; lo cual sería lento y tedioso. Para representar el globo terráqueo se emplean proyecciones bidimensionales (Mercator) basadas en un modelo ideal de la tierra, como si se tratara de un globo inflable al que se le introduce en un cilindro para posteriormente inflarlo para que ocupe el volumen del cilindro. El cilindro ya cortado longitudinalmente es lo que daría como resultado el mapa que observamos en nuestro dispositivo. Google ofrece 18 niveles de zoom que requieren una gran cantidad de imágenes que ocupan alrededor de 200 Terabytes de espacio en el servidor. En realidad, Google Maps son solo imágenes que se van cargando en el fondo de una página HTML que trabaja junto con CSS y JavaScript; es decir que están siendo ejecutadas por AJAX e insertadas con el comando < div > de HTML. Mientras estás navegando en el mapa el API [4] (Application Programming Interface) está enviando información de las coordenadas así como del nivel de zoom solicitado; AJAX es quien se encarga de retornar la imagen solicitada.

El ejemplo de la solución técnica de Google Maps tiene mucho sentido si lo comparamos con el modelo de aplicación clásico, es decir, sin el uso de AJAX. Porque en el modelo clásico, mientras el servidor está haciendo sus rutinas, el usuario lógicamente está esperando; y para cada solicitud de tarea; el usuario deberá esperar más. Es obvio que el usuario no desea estar esperando por lo que es mejor opción usar la aplicación AJAX que elimina ese “frenar-arrancar-frenar” en la página web. En este caso, en lugar de cargar la página Web se carga el motor de AJAX que es el responsable de “renderizar” la interface que se despliega al usuario y que permite la interacción con éste. Esta interacción sucede asincrónicamente por lo que el usuario jamás estará viendo una pantalla en blanco con un ícono de reloj que indique que la página se está cargando.

Fuente: Garret, Jesee James; “AJAX; A New Approach of Web Applications”

Cuando no se emplea AJAX, cada acción que solicita el usuario generaría normalmente una petición “http”; mientras que cuando se empela AJAX el motor hace un llamado a JavaScript y la respuesta no tendrá que viajar desde el servidor; pero si acaso se requiere hacer una solicitud explícita al servidor, se haría asincrónicamente usando XML; pero sin frenar la actividad del usuario.[5]

¿Quién más usa AJAX?

En toda la web hay muchas aplicaciones que emplean AJAX y cada vez más. En primer lugar, además de Google Maps , Gmail, Google Docs y prácticamente todos los servicios Google al igual que Microsoft Exchange Server.

Otras aplicaciones populares que hacen uso de AJAX son:

• Amazon
• Wordpress
• Flickr
• Panoramio
• Webnote
• BaseCamp
• Meebo y muchas más….

Ventajas y Desventajas de AJAX

Entre las principales ventajas tenemos la rapidez en las operaciones; menor ancho de banda y menor tasa de transferencia de datos cliente/servidor; es soportada por la mayor parte de los navegadores; es interactiva, portable con gran velocidad y usabilidad.

Entre las principales desventajas tenemos la pérdida del concepto de “regresar a página anterior” el cual era el problema con los primeros navegadores. No funciona si no se activa el JavaScript en el navegador y problemas para búsquedas orgánicas tipo SEO porque los buscadores no indexan contenido AJAX.

Conclusiones

El principal objetivo del AJAX, es intercambiar información entre el servidor y el cliente (navegadores) sin la necesidad de recargar la página. De esta forma, ganamos en usabilidad, experiencia y productividad del usuario final.
Usar AJAX permite enfocarse en el usuario final y crear aplicaciones web más limpias ya que gracias a sus características la aplicación se puede hacer más interactiva y con una mayor velocidad de respuesta. En consecuencia, se mejora la experiencia del usuario. El reto actual en la creación de aplicaciones web ya no está en las tecnologías ya que éstas son lo suficiente estables, maduras y conocidas. El reto está en que los desarrolladores no se vean limitados por la web y que dejen volar su imaginación cada vez más allá de sus posibilidades.

[1] Millán, Andrés; “ Historia de las Copas del Mundo de futbol” 2014

[2] Citado en http://es.fifa.com/worldfootball/statisticsandrecords/

[3] Millán, Andrés; “ Historia de las Copas del Mundo de futbol” 2014

[4] Interface de programación de aplicaciones (IPA) o API (del inglés Application Programming Interface) es el conjunto de funciones y procedimientos que ofrece cierta biblioteca para ser utilizado por otro software como una capa de abstracción.

[5] Citado en Garret, Jesee James; “AJAX; A New Approach of Web Applications” disponible en la web en http://www.adaptivepath.com/ideas/ajax-new-approach-web-applications/

Tags: , , , , , , , ,

Deja un comentario