Blog Tecnológico de Azalorea

Joe Hewitt ha puesto manos a la obra y ha sacado la versión beta de Firebug 1.0. Al día de hoy es la beta3 que incorpora funcionalidades que usuarios le han pedido tras haber evaluado beta1 y beta2.

Y estamos de suerte porque Joe ha decidido, tras pensarselo detenidamente y hablar con los usuarios, a seguir con el modelo OpenSource [ver su comentario]. Al parecer ha hecho bien porque los mismos usuarios se han volcado en donar importes de 20 a 100€ para que Joe pueda dedicarle recursos a esta herramienta que ya se ha vuelto indisepnsable para muchos desarrolladores.

El interfaz de Firebug está totalmente renovado y mucho más limpio… cosa que era necesaria porque tiene un sinfin de nuevas funcionalidades. Las más importantes son:

• Poder abrir Firebug en una ventana propia
• Editar HTML (y no solo los parámetros como en la versión 0.4)
• Editar CSS (desde beta3 se puede editar enteramente)
• Monitorizar tráfico de red detallando gráficamente cuando tarda cada elemento en cargarse.
• Perfilar tiempo de ejecución

Aparte del AddOn para Firefox Joe ha creado Firebug Lite… una librería JavaScript para disponer de las funcionalidades (limitadas por momento) de Firebug en Internet Explorer, Opera y Safari. Por momento Firebug Lite está limitado al logging y ejecución de comando JS en la consola.

Happy debugging,
Miguel

Tras probar muchos scripts para ventanas flotantes por fin he dado con uno que se basa en Scriptaculous, es funcional y bonito. Hace uso de skins, lo que lo hace facilemente adaptable al entorno de la aplicación que estemos programando y permite cargar los contenidos dinámicamente… y de allí a cargar los contenidos mediante Ajax ya solo queda un pequeño paso
La única pega que le veo es que no ofrece la posibilidad de adaptar su tamaño al contenido, aunque si ofrece la funcionalidad de scroll.

Podeis ver la demo en http://net4visions.com/dev/dialog/dialog.htm.
Para descargar el código… http://net4visions.com/dev/dialog/

La implementación de dialog.js en nuestra aplicación es muy fácil…
Después de cargar prototype.js y scriptaculous.js se carga _dialog.js.
Para abrir una ventana flotante se usa

var dlg0 = new Dialog(null, {options});

Las opciones disponibles y el manual completo lo encontrais aquí.

Miguel

Jesse James Garett, el inventor de la palabra “Ajax” admite que Ajax ya no define solamente “Asynchronous JavaScript + XML” sino que es válido para todo tipo de aplicación web que hacen uso de:
- un modelo de interacción asincronea
- tecnologías nativas del navegador.

Ajax se ha convertido en la palabra de moda para todo tipo de aplicaciones web. Muchas de estas no merecen el nombre Ajax porque las funcionalidades son puramente DHTML o DOM Scripting sin comunicarse con el servidor.

Pero hay otras muchas que usan iframes para la comunicación o devuelven (x)HTML en vez de XML (caso de Prototype)… y esto si debe considerarse Ajax… y ahora con el beneplácito de Jesse

Miguel

MochiKit es otra librería con el afán de simplificar la creación de páginas DHTML. Lo mejor de MochiKit es la documentación. Es muy extensa y detallada. También dicen que es ligera, pero con 111KB en su versión comprimida no me parece muy ligera.

Cómo las demás librerías DHTML ofrece soporte para la mayoría de los navegadores que se usan actualmente. Las funcionalidades son bastante similares a lo que ya conocemos, pero destacando que además de Ajax tiene soporte para JSON.

La nueva versión 1.3.1 (ha salido hoy) añade MochiKit.Signal… funciones para la gestión de eventos.

URLs interesantes:

• Homepage:
  http://www.mochikit.com/
• Blog:
  http://bob.pythonmac.org/archives/category/javascript/mochikit/

Para un nuevo proyecto necesitaba la posibilidad de disponer de pestañas. Las soluciones que había probado hasta ahora no llegaron a convencerme y así me puse a buscar para ver lo que había disponible en la red. Mi idea era encontrar algo que haga uso de Scriptaculous… pero no hubo suerte. Finalmente dí con Tabber. Ofrece más funcionalidades de las que estaba buscando, pero no las buscaba porque no había pensado en ellas… la verdad es que está muy bien.

Entre las funcionalidades que más me llamaron la atención se encuentra la posibilidad de cargar el contenido de un pestaña usando Ajax, la posibilidad de tener múltiples pestañas repartidas en la página (también anidadas) y poder asignar eventos a las diferentes pestañas sin tener que hackear el código. El código está escrito orientado a objetos y está muy bien comentado.

Lo que haré es portar el código para que haga uso de Prototype/Scriptaculous para reducir el peso. Con esto tendré el script de pestañas de mis sueños

Enlaces:

• Homepage:
  http://www.barelyfitz.com/projects/tabber/
• Blog:
  http://www.barelyfitz.com/blog/archives/category/tabber/

Scripts alternativos:

• xttab:
  http://www.extollit.com/tabctrl.php
• DynArch:
  http://www.dynarch.com/products/dhtml-tabs/
• WebFX (mi favorito hasta ahora):
  http://webfx.eae.net/dhtml/tabpane/tabpane.html
• net4visions (en desarrollo):
  http://www.net4visions.com/dev/tabs/docs/readme.htm
  http://net4visions.com/dev/tabs/tabs.html

Hoy he descubierto el blog del programador de firebug. Llevo usandolo desde hace un rato, pero no tenía ni idea de las posibilidades que esconde esta extensión.

Las funcionalidades se podrían definir como una mezcla de la consola de javascript y el inspector de DOM. Pero según he descuebierto hoy incorpora varios detalles que facilitan las cosas a la hora de resolver problemas ya sea con el CSS o con Javascript.

Explicar en detalle todas las funcionalidades me parece demasiado para este post… pero haré un resumen:

• Firebug instala un pequeño iconito en la barra inferior de Firefox, por defecto es verde pero se pone en rojo cuando hay errores de Javascript. Cicando en cualquier momento en el ícono se accede al entorno de FIrebug con todas sus funcionalidades.
• Dispone de un inspector DOM. Muestra un marco alrededor del objeto en la ventana del navegador cuando pasas el ratón por encima del arbol DOM del inspector y viceversa.
• Línea de comandos… dispone de posibilidad de ejecutar comandos Javascript que se ejecutan en el entorno de la página cargada.
• Inspector de Ajax… muestra tanto el request mandado como los datos que devuelve el servidor.
• Posibilidad de mostrar solo los mensajes relacionados con la página abierta.

Mirando el blog de Joe Hewitt descubrimos muchos detalles más… en otro post iré detallando los diferentes “trucos” que se mencionan allí.

Miguel

Los que nos gustan los estándares y en general todos que hagan uso de Ajax agradecerán esta noticia. W3C está trabajando en un primer boceto (draft) oficial para el XMLHttpRequest.

Hasta el día de hoy cada navegador tenía su manera de implementarlo… y por tanto nosotros teníamos que adaptar nuestro código a cada plataforma. En un futuro, que espero no sea muy lejano, podremos desarrollar aplicaciones Ajax sin tener que gastar líneas de código para hacerlo funcionar en los diferentes navegadores.

Está claro que pasará aún algun tiempo hasta que esté terminado la propuesta de estándar y pasará otro tanto hasta que se implementen en los navegadores, pero podemos estar contentos que por fin se haya empezado esta tarea.

Lo que llama la atención es que al parecer no hay ningun miembro de Microsoft involucrado en la creación de este nuevo estándar. Si Microsoft decide no guiarse por el estándar de W3C los problemas seguirán siendo los mismos.

Miguel

Nos acabamos de acostumbrar al hecho de encontrarnos Ajax en muchas de las aplicaciones de internet recientes cuando aparece una nueva vieja tecnología…. La llaman Comet e igual que Ajax no es nada nuevo, pero que se ha redescubierto nuevamente.

La idea detrás de Comet es usar conexiones persistentes y hacer un PUSH de los datos desde el servidor en vez de esperar a que el cliente lo solicite (polling).

La desventaja es que por momento los servidores comunes no tienen esta funcionalidad, pero ya están trabajando en ello.
Apache ha anunciado la disponibilidad de un módulo disponibilidad para la versión 2.2.

Los creadores de Dojo ya tienen en mente Comet… queda por ver cómo usarlo.
Otras aplicaciones que ya hacen uso de esta tecnología son:
- Integración de googleTalk en gMail
- Jot Live
- Renkoo
- cgi:irc
- Meebo

Supongo que Comet le dará otro empujon a las aplicacion web 2.

Miguel