MooTools: el compacto framework para Ja­va­S­cri­pt

Con el nombre de Moo.fx, el de­sa­rro­lla­dor italiano Valerio Proietti publicó en 2005 una extensión para el framework Prototype, entonces líder en el mercado. Debido a que Proietti no estaba sa­ti­s­fe­cho con las po­si­bi­li­da­des ofrecidas por Prototype, decidió de­sa­rro­llar un entorno de trabajo propio que estaría di­s­po­ni­ble en diciembre de 2006 (versión 0.87) con el nombre MooTools (My Object Oriented Tools) y bajo la licencia MIT. Hoy un equipo de más de 20 de­sa­rro­lla­do­res y di­se­ña­do­res es el re­s­po­n­sa­ble de pe­r­fe­c­cio­nar el framework que, según w3techs.com ha sido im­ple­me­n­ta­do en un 3,3 por ciento (en octubre de 2016) de la totalidad de los proyectos web y, junto a jQuery y Bootstrap, forma parte de las he­rra­mie­n­tas más populares de Ja­va­S­cri­pt alrededor del mundo.

El framework MooTools es un conjunto compacto y modular de he­rra­mie­n­tas para de­sa­rro­lla­do­res pro­fe­sio­na­les en Ja­va­S­cri­pt que se distingue por sus po­si­bi­li­da­des de apli­ca­ción gracias a un elegante y bien do­cu­me­n­ta­do grupo de API y por estar orientado a objetos. MooTools pone a di­s­po­si­ción del de­sa­rro­lla­dor varias funciones y clases para facilitar la pro­gra­ma­ción y el diseño de proyectos web modernos y si­m­pli­fi­car en gran medida el proceso de trabajo. Además, su diseño modular lo hace escalable. Adi­cio­na­l­me­n­te, el usuario puede incluir de forma es­pe­cí­fi­ca aquellos co­m­po­ne­n­tes que realmente necesita, lo que le da a MooTools un alto grado de claridad y co­m­pa­ci­dad.

A di­fe­re­n­cia del tra­di­cio­nal Ja­va­S­cri­pt (basado en pro­to­ti­pos), MooTools se fu­n­da­me­n­ta sobre un sistema de herencia de clases que sirve de base para la pro­gra­ma­ción orientada a objetos y, por lo tanto, también para todos los co­m­po­ne­n­tes incluidos en el framework. Este sistema no solo se ca­ra­c­te­ri­za por ser fá­ci­l­me­n­te escalable, sino también por que permite escribir código fuente flexible y re­uti­li­za­ble. Así, gracias a dichas clases pre­de­fi­ni­das y mo­di­fi­ca­bles es posible im­ple­me­n­tar objetos similares como plugins, elementos HTML, so­li­ci­tu­des AJAX, etc., sin necesidad de invertir una gran cantidad de tiempo. A co­n­ti­nua­ción, te pre­se­n­ta­mos una síntesis de los co­m­po­ne­n­tes de Ja­va­S­cri­pt uti­li­za­dos para ampliar MooTools: 

• Core: MooTools Core es el núcleo del framework, a partir del cual se de­sa­rro­llan todos los co­m­po­ne­n­tes para Ja­va­S­cri­pt. Además de im­ple­me­n­tar el concepto de clases, Core cuenta con algunas funciones generales de ayuda.

• More: MooTools More es la colección oficial de plugins del framework. Esta incluye una gran variedad de mejoras que si­m­pli­fi­can el proceso de de­sa­rro­llo y añaden ca­ra­c­te­rí­s­ti­cas adi­cio­na­les.

• Class: el co­m­po­ne­n­te Class hace re­fe­re­n­cia a la clase base necesaria para crear (generar) in­s­ta­n­cias de clases de objetos re­uti­li­za­bles, así como para la mo­di­fi­ca­ción de clases ya exi­s­te­n­tes.

• Element: este es uno de los co­m­po­ne­n­tes más im­po­r­ta­n­tes, con cuya ayuda es posible acceder o generar objetos HTML desde na­ve­ga­do­res co­m­pa­ti­bles y contiene las funciones $ y $$.

• Fx: el módulo Effects sirve como base para la animación de elementos y, por lo tanto, para la rea­li­za­ción de funciones como el scrolling y el sliding, entre otras.

• JSON: módulo para la co­di­fi­ca­ción y de­co­di­fi­ca­ción de cadenas en formato JSON (JavaScript Object Notation).

Algunos módulos se co­m­ple­me­n­tan entre ellos. Así, por ejemplo, el módulo Fx.CSS requiere la in­s­ta­la­ción del módulo Fx. Por lo general, en la sección de descargas puedes se­le­c­cio­nar es­pe­cí­fi­ca­me­n­te aquellos co­m­po­ne­n­tes que necesitas y de­s­ca­r­gar­los como tu framework MooTools pe­r­so­na­li­za­do. Para este propósito, los módulos se han dividido en dos grandes grupos: Core y More. También es posible descargar el paquete básico completo con todas las ex­te­n­sio­nes di­s­po­ni­bles.

Si quieres echar un vistazo al fu­n­cio­na­mie­n­to de alguno de los co­m­po­ne­n­tes in­di­vi­dua­les, el equipo de­sa­rro­lla­dor de Mootools ha creado la web aryweb.nl, en la que no solo en­co­n­tra­rás ejemplos de MooTools o repre­se­n­ta­cio­nes visuales de la función arrastrar y soltar, fo­r­mu­la­rios y efectos, sino que también en­co­n­tra­rás líneas de código para Ja­va­S­cri­pt, HTML y CSS.

A mediados de los años 90, todos los proyectos web empezaron a incluir elementos dinámicos, con lo que la ejecución del código fuente se fue co­n­ce­n­tra­n­do en el lado del cliente. Para ello, los applets de Java eran la medida de todas las cosas. Como al­te­r­na­ti­va a estos “mini” programas, Brendan Eich de­sa­rro­lló en 1995 Li­ve­S­cri­pt, el pre­de­ce­sor de Ja­va­S­cri­pt, para el navegador Netscape 2.0. Las mayores di­fe­re­n­cias entre ambos lenguajes fueron, pri­n­ci­pa­l­me­n­te, que Ja­va­S­cri­pt reemplazó clases por pro­to­ti­pos y que las líneas de código pro­gra­ma­do no se aislaron del código HTML, sino que se im­ple­me­n­ta­ron en el código fuente. Ambas pro­pie­da­des se han mantenido hasta ahora.

En un principio, Ja­va­S­cri­pt actuó como lenguaje de script y principal co­m­pe­ti­dor de los applets de Java. Sin embargo, el verdadero avance se produjo a raíz de la Web 2.0 y, desde 2005, del de­sa­rro­llo de los na­ve­ga­do­res web y de la interfaz DOM. De repente era posible descargar contenido en un segundo plano usando Ja­va­S­cri­pt, surgieron las primeras in­te­r­fa­ces dinámicas en el navegador sin tener que instalar plugins y se generó la necesidad constante de co­mu­ni­ca­ción con el servidor web.

Así se crearon fra­me­wo­r­ks y bi­blio­te­cas Ja­va­S­cri­pt y, en la última década, Ja­va­S­cri­pt se ha co­n­ve­r­ti­do en el lenguaje de pro­gra­ma­ción más utilizado para el de­sa­rro­llo web. De esta forma, la web tra­di­cio­nal se ha ido tra­n­s­fo­r­ma­n­do en una apli­ca­ción cada vez más compleja y con un gran factor de in­ter­ac­ción, hecho que ha aumentado la im­po­r­ta­n­cia de Ja­va­S­cri­pt y de fra­me­wo­r­ks como MooTools para la pro­gra­ma­ción de nuevos proyectos. Desde hace algunos años este lenguaje de script se utiliza también desde el lado del servidor.

Hoy en día, las páginas estáticas tra­di­cio­na­les se enfrentan a momentos difíciles: la im­ple­me­n­ta­ción de elementos in­ter­ac­ti­vos es ahora in­di­s­pe­n­sa­ble, lo que hace que para im­pre­sio­nar a los usuarios sea aún más necesario utilizar conceptos in­no­va­do­res y fáciles de usar. Así, la velocidad de carga también juega un papel im­po­r­ta­n­te que depende, en gran medida, de la fre­cue­n­cia con la que la apli­ca­ción web debe acceder al servidor para gestionar las so­li­ci­tu­des entrantes durante la na­ve­ga­ción. Por esta razón, un tipo de proyecto que es cada vez más utilizado y que parece haber sido creado para un framework como MooTools es la apli­ca­ción llamada single page o Onepager. Se trata de sitios web que consisten en un único documento HTML y re­pre­se­n­tan la totalidad del contenido en una sola página. Así, en vez de estar es­tru­c­tu­ra­dos en su­b­pá­gi­nas, estos incluyen secciones y eventos que facilitan la na­ve­ga­ción con pocos clics o con el simple scrolling.

Aquí, la narración, conocida más es­pe­cí­fi­ca­me­n­te como sto­r­y­te­lli­ng, es es­pe­cia­l­me­n­te popular pues es la que determina la mejor manera de re­pre­se­n­tar la in­fo­r­ma­ción, uti­li­za­n­do siempre elementos in­ter­ac­ti­vos y co­n­s­tru­yé­n­do­la como una pequeña historia. Para la re­pre­se­n­ta­ción de apli­ca­cio­nes single page solo es necesario in­te­r­ca­m­biar unos pocos datos con el servidor web, lo que, por lo general, pro­po­r­cio­na un alto re­n­di­mie­n­to. Debido al amplio soporte de Ja­va­S­cri­pt, las apli­ca­cio­nes de MooTools pueden im­ple­me­n­tar­se con facilidad in­de­pe­n­die­n­te­me­n­te del navegador y de la pla­ta­fo­r­ma.

Uti­li­za­n­do Ja­va­S­cri­pt como lenguaje de pro­gra­ma­ción, el framework MooTools está muy bien aco­m­pa­ña­do. Al­te­r­na­ti­vas exitosas como, por ejemplo, AngularJs o Ember.js, de­mue­s­tran que la demanda de los entornos de trabajo Ja­va­S­cri­pt es muy alta. Este lenguaje de pro­gra­ma­ción es un estándar web in­di­s­cu­ti­ble soportado por los pri­n­ci­pa­les na­ve­ga­do­res y, además, resulta ideal para el de­sa­rro­llo de co­m­po­ne­n­tes in­ter­ac­ti­vos, formando parte del re­pe­r­to­rio obli­ga­to­rio de todo de­sa­rro­lla­dor web, incluso si, por defecto, este carece de un sistema de herencia de clases. MooTools elimina este problema y si­m­pli­fi­ca eno­r­me­me­n­te la pro­gra­ma­ción de elementos re­cu­rre­n­tes.

A primera vista, parece que este enfoque hacia un código fuente eje­cu­ta­ble en el lado cliente solo conlleve ventajas para el usuario, ya que los elementos de Ja­va­S­cri­pt prometen una gran in­ter­ac­ti­vi­dad y, a la vez, una muy buena velocidad de carga. Sin embargo, el hecho de que la tarea de co­m­pi­la­ción de código para apli­ca­cio­nes MooTools tiene lugar, pri­n­ci­pa­l­me­n­te, en el panel de tareas del cliente, puede generar problemas e implicar riesgos. Como co­n­se­cue­n­cia, los recursos sufren una gran demanda, algo que, en el caso de clientes y di­s­po­si­ti­vos de bajo re­n­di­mie­n­to, puede ocasionar una reducción del re­n­di­mie­n­to o incluso la caída de la página web. Esto afecta en pa­r­ti­cu­lar a di­s­po­si­ti­vos móviles como los sma­r­t­pho­nes (desde los que accede un si­g­ni­fi­ca­ti­vo po­r­ce­n­ta­je de usuarios a Internet), los cuales también pueden, además, presentar co­m­pli­ca­cio­nes re­la­cio­na­das con algunos de sus co­m­po­ne­n­tes es­pe­cí­fi­cos, tales como pantallas táctiles o pantallas re­la­ti­va­me­n­te pequeñas que no han sido probadas o co­rre­c­ta­me­n­te op­ti­mi­za­das.

Debido a que la ejecución de código siempre lleva consigo el riesgo de ataques externos (tracking, phishing, etc.), los usuarios de proyectos web con una pro­gra­ma­ción variada del lado del cliente correrán el mismo riesgo. Es por esto que una parte de los usuarios de Internet utiliza he­rra­mie­n­tas para bloquear di­fe­re­n­tes scripts, entre ellos Ja­va­S­cri­pt, como NoScript o JS Blocker, a menos que los incluya ma­nua­l­me­n­te en la lista blanca. Por lo tanto, es re­co­me­n­da­ble prestar especial atención a la seguridad de la apli­ca­ción MooTools para lograr la confianza necesaria y alcanzar a la mayor cantidad de usuarios con tu proyecto.

MooTools impulsa el de­sa­rro­llo del enfoque orientado a objetos de Ja­va­S­cri­pt, co­m­ple­me­n­ta­n­do al popular lenguaje de scripting web con clases pe­r­so­na­li­za­das y re­uti­li­za­bles de la misma forma que, por ejemplo, Java o PHP. La im­ple­me­n­ta­ción de este framework aumenta eno­r­me­me­n­te la efi­cie­n­cia de la pro­gra­ma­ción de apli­ca­cio­nes con Ja­va­S­cri­pt. En este punto es pre­ci­sa­me­n­te donde se en­cue­n­tran los puntos fuertes de este entorno de trabajo.

El diseño de apli­ca­cio­nes basadas en MooTools es posible, pero no ne­ce­sa­ria­me­n­te adecuado para todo tipo de proyectos web. Incluso cuando los efectos, las ani­ma­cio­nes y los co­m­po­ne­n­tes AJAX resultan cada vez más im­po­r­ta­n­tes para el de­sa­rro­llo web moderno, a la hora de realizar tu proyecto web no debes perder de vista la ex­pe­rie­n­cia del usuario. Aunque MooTools y Ja­va­S­cri­pt fijan ex­ce­le­n­tes bases, es fu­n­da­me­n­tal im­ple­me­n­tar­los en dosis adecuadas, pues de lo contrario, la apli­ca­ción web superará rá­pi­da­me­n­te los medios técnicos del cliente utilizado por el usuario.