Jul 14

Ajax, navegadores y la memoria

Antes de nada debe quedar claro que no he hecho pruebas en serio, lo que comento a continuación es simplemente lo que me he encontrado sin ir más allá.

Como he comentado en post anteriores, estamos (estábamos, ya se ha entregado) haciendo un portal web en el que hay varias cosas implicadas. El portal es de página única, es decir, entras en sesión y te muestra un mapa (geoserver/openlayers), unas tablas de datos y un chat. No cambias de página en ningún momento y todas las actualizaciones se hacen de forma automática y cada cierto tiempo con ajax.

Nuestro mapa se actualiza usando la librería openlayers. El chat está hecho con GWT, por lo que no hacemos nada de javascript a mano. Las tablas con una extensión de jQuery y se actualizan solitas con ajax. Todo funciona bien, pero hay las siguientes pegas con la memoria.

Por un lado, con internet explorer, si lo dejamos abierto y no tocamos nada, las actualizaciones se hacen solitas cada cierto tiempo y mirando el administrador de tareas de windows vemos que la memoria consumida por Internet Explorer no sube. Tras 24 horas abierto sin salvapantallas de ningún tipo, todo sigue correctamente. Pero ….. si trabajamos con la web (hacemos zoom en el mapa, creamos datos, borramos datos, chateamos, etc, etc, etc), la memoria consumida por internet explorer va creciendo a pasos agigantados. El navegador empieza a ir lento, luego deja de responder y en ocasiones, al final, incluso ha dejado de responder el PC y ha habido que apagarlo de malas maneras.

Por otro lado, con Chrome el comportamiento es bien distinto. Si lo dejamos 24 horas mostrando el portal sin tocar nada, la memoria va creciendo poco a poco. Desde unos 100 Megas en el arranque hasta 1 Giga o Giga y medio tras 24 horas. Pero a pesar de la memoria consumida, Chrome y la aplicación web siguen funcionando igual de ágiles que al empezar. Y si abres la web con Chrome y trabajas en ella, la memoria va crenciendo poco a poco, pero se va también liberando y el resultado final es que crece incluso de forma más lenta que si no tocas nada. Me da la impresión de que Chrome libera memoria según cambias de pestaña, lo minimizas, lo pones detrás de otras ventanas, etc, etc. Y en ningún caso, como en Internet Explorer, nos ha dejado de funcionar ni mucho menos nos ha colgado el PC.

Probando con otras web de las que hay por internet que tengan actualizaciones automáticas cada cierto tiempo (por ejemplo, la misma página de inicio de iGoogle con tus feeds mostrados), veo que también van consumiendo memoria del navegador poco a poco. No he probado a tenerla 24 horas abierta, así que no sé si se estabiliza o no.

Y buscando por internet cosas sobre "memory leaks" en javascript, gwt, openlayers, explorer, chrome … el resultado es desesperanzador. Por lo visto son problemas muy, muy habituales, que requieren una programación muy muy cuidadosa, en la que hay que saber miles de truquillos para hacerlo bien … y como siempre en estos casos, hay trucos específicos para cada navegador o incluso navegadores (internet explorer) que requieren una atención especial.

En fin, me temo que javascript/ajax/navegadores web no están pensados/preparados para aplicaciones web que deben mantenerse abiertas de forma permanente. Están más pensadas para abrir el navegador, ver la página, jugar un rato con ella (un minuto, una hora, dos horas,….) y pasar a otra cosa.

Y en el caso concreto de GWT me ha llamado la atención un comentario que encontré en un foro. Alguien con GWT tenía problemas de pérdida de memoria y buscando por internet encontró lo mismo que yo: "GWT está muy bien pensando y no tiene problemas de memoria", así que su comentario en el foro era el que podía haber escrito yo mismo: "Tengo una aplicación con GWT y problemas de memoria. Buscando en google la solución que encuentro es que GWT es maravilloso y no tiene problemas de memoria. Así que sigo teniendo problemas de memoria"

Jun 03

Chrome vs Explorer

 Como he comentado más veces, estamos haciendo un portal web con mapa (Geoserver + Openlayers). En ese mapa debemos pintar las posiciones de los barcos (algo similar a http://www.localizatodo.com/mapa/ ). Geoserver ofrece dos tipos de Web Service para obtener los barcos y poder pintarlos en el mapa. Ojo, Geoserver no sabe los datos de los barcos, simplemente los lee de su base de datos y algún proceso externo tiene que rellenar dicha base de datos.

Uno de ellos, WFS, consiste en que a través del WebService y en formato XML te da los datos de los barcos (posición, velocidad, rumbo, nombre del barco, tipo de barco, etc). Es el navegador con javascript (y en concreto la librería OpenLayers), la encargada de dibujar los barcos sobre el mapa.

Pues bien, con esta aproximación y con sólo unos tres mil barcos para probar (la base de datos contiene algo menos de treinta mil), Chrome funciona perfectamente. Se puede hacer zoom en el mapa, desplazarlo y jugar con él sin notar ningún retraso importante en los refrescos. Pero Internet Explorer es otra cosa. Con tres mil barcos…. se queda colgado el navegador entero. En cuanto haces zoom, intentas mover el mapa o cualquier cosa, deja de refrescarse, deja de contestar y ni siquiera puedes abrir otras pestañas, cerrarlas, o cerrar el navegador. En fin, una diferencia importante de eficiencia de javascript entre internet explorer 8 y Chrome.

La solución al final usar el otro Web Service que ofrece Geoserver, el WMS. En este Web Service es el mismo Geoserver (el servidor), el que hace unas imágenes jpg (o el formato que elijamos) con el mapa y los barcos pintados encima. Esta imagen se sirve al explorador cuya única tarea consiste en pintarla. Aun así, Chrome sigue funcionando perfectamente, mientra que con internet explorer ya se puede trabajar sin problemas, pero se le sigue notando más "pastoso" a la hora de mover el mapa y hacer zoom.

Una pena que al ser el navegador más usado por la gente profana, nuestro requisito sea que funcione bien con internet explorer.