MyZenStatus: Mucho que hacer y poco tiempo...

Diferencia entre dom:loaded y window.onload

Posted: septiembre 26th, 2011 | Author: | Filed under: Front-End | Tags: , , | No Comments »

Uno de los métodos más potentes y usados para controlar los tiempos de carga y ejecución de nuestros scripts en la página, es el uso del Event.observe de Prototype.

Con la línea siguiente:

Event.observe(window, 'load', function() {});

Podremos ejecutar algo una vez la página esté completamente cargada. Muy útil si queremos asegurar por ejemplo que un div al que queremos interactuar está ya cargada en la página, o si queremos realizar cualquier acción tras la carga completa de la página. Esto es que están todos los elementos del DOM renderizados y todo el resto de elementos web cargados también: js, css e imágenes incluidos. Las peticiones AJAX no entrarían en este saco ya que son peticiones asíncronas y no se carga secuencialmente en el waterfall de la carga de la página.

Hasta aquí todo perfecto. Pero también tenemos otra condición que se usa mucho que es:

document.observe('dom:loaded', function(){});

Esta línea es muy similar a la anterior pero no son exactamente iguales. ¿En qué se diferencian?

Read the rest of this entry »


Nueva versión de Prototype 1.7

Posted: diciembre 2nd, 2010 | Author: | Filed under: Front-End | Tags: , , | 1 Comment »

Hace algo más de 1 semana, salió la esperadísima nueva versión estable 1.7 de Prototype. Tras un eterno periodo con la versión 1.6.x, donde incluso parecía tener síntomas de abandono del framework, finalmente no ha sido así y finalmente publicaron esta nueva versión que incluye más de 50 mejoras importantes.

En un artículo anterior de la página oficial ya hemos podido ver un avance de todo este paquete de mejoras y bugfixes que incluía las release candidates de esta versión 1.7 de Prototype. De dichas mejoras se destacan:

  • Migración al motor de selectores CSS llamado Sizzle (el que usa jQuery).
  • Nuevos métodos como Element#on, que permite simplificar la gestión de los eventos (handlers); o Element#Layout, perfecto para llevar un control preciso de cada pixel de nuestros elementos del DOM.

Sin duda esta release de Prototype 1.7 es una gran noticia para los que usamos esta gran librería, y parece que el Core Team están haciendo muy bien las cosas, ya que han atacado los puntos débiles que siempre había tenido esta librería como el rendimiento con el uso de selectores CSS para controlar elementos DOM respecto a otras librerías como jQuery.

Y lo siguiente será la llegada del Scriptaculous 2!! Scripty 2 + Prototype 1.7 será explosivo!

¿Ya has actualizado tu versión de Prototype a 1.7 en tu proyecto? ¿Has notado alguna mejora?


Directorio de extensiones javascript para Prototype

Posted: noviembre 25th, 2010 | Author: | Filed under: Front-End | Tags: , , | No Comments »

Si te gusta la librería Prototype como yo, entonces debes tener la página Scripteka entre tus marcadores favoritos.

Scripteka es un directorio de extensiones y componentes JS para Prototype bastante completo y muy útil. En ella puedes encontrar una diversidad de extensiones desarrolladas por programadores de todo el mundo. Desde diferentes extensiones para crear galerías de imágenes que sigue el estilo del popular Lightbox, extensiones para optimizar la carga de los elementos de la página (LazierLoad), para validar formularios (JSValidate) y un largo etcétera.

Read the rest of this entry »


Test de velocidad de selectores para frameworks de javascript

Posted: octubre 25th, 2010 | Author: | Filed under: Front-End | Tags: , , , , | 3 Comments »

SlickSpeed Selectors Test‘ es una página que testea de forma completísima el rendimiento del uso de selectores css comparando entre sí los frameworks de javascript más importantes o conocidos del mercado. El test nos reporta muchísima información sobre la performance o la velocidad de cada framework. Resulta muy interesante analizar los resultados.

Resultados del test

Según los resultados que me han salido a mí, el framework que mejor y más rápido trabaja con el uso de selectores css es  la última versión de YUI 3.1.0 (39*), y le pisa los talones jQuery (40) y DOMAssistant 2.8 (41). Si lo comparo con Prototype 1.6, que es el framework que más he usado (y uso), ha obtenido un tiempo de 58, que es claramente más alto que estos primeros, y vemos que Prototype rinde menos. No obstante, hay buenas noticias al respecto ya que la última versión  de Prototype, 1.7, que ya está ultimando su salida oficial (ya van por la Release Candidate 3), viene integrado Sizzle, el motor que usa jQuery para los selectores. Aquí explican esta integración, entre otras cosas.

Read the rest of this entry »


Scripty2: Lo más nuevo de Prototype y Scriptaculous

Posted: junio 30th, 2009 | Author: | Filed under: Front-End | Tags: , , , | 1 Comment »

Cualquier Front-End Developer sabe que en la actualidad disponemos de una multitud de herramientas que nos ayuda con el día a día. Para desarrollar en Javascript existen frameworks potentes, entre los más populares están jQuery, Prototype, YUI y Mootools.  Todas estas librerías son proyectos open-source y tienen detrás una comunidad importante que los apoya y los ayuda a crecer y mejorar.

Prototype vs jQuery

De todos estos frameworks, sin duda hay 2 que están por encima de los demás, almenos a lo que a popularidad se refiere, y son el jQuery y el Prototype. En este artículo me voy a ahorrar la explicación de los pros y contras de cada uno, o cual es el mejor de los 2, porque este debate ya se abrió hace mucho en Internet, hay mucha información allí fuera.

Me voy a limitar a mí propia experiencia. Y yo me quedo con Prototype. Con esto estoy llendo en contracorriente porque parece que en la actualidad, jQuery le está ganando terreno a Prototype en cuanto a popularidad. Pero la gente creo que se equivoca cuando Read the rest of this entry »