MooTools: el compacto framework para JavaScript

Con el nombre de Moo.fx, el desarrollador 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 satisfecho con las posibilidades ofrecidas por Prototype, decidió desarrollar un entorno de trabajo propio que estaría disponible 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 desarrolladores y diseñadores es el responsable de perfeccionar el framework que, según w3techs.com ha sido implementado 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 herramientas más populares de JavaScript alrededor del mundo.

El framework MooTools es un conjunto compacto y modular de herramientas para desarrolladores profesionales en JavaScript que se distingue por sus posibilidades de aplicación gracias a un elegante y bien documentado grupo de API y por estar orientado a objetos. MooTools pone a disposición del desarrollador varias funciones y clases para facilitar la programación y el diseño de proyectos web modernos y simplificar en gran medida el proceso de trabajo. Además, su diseño modular lo hace escalable. Adicionalmente, el usuario puede incluir de forma específica aquellos componentes que realmente necesita, lo que le da a MooTools un alto grado de claridad y compacidad.

A diferencia del tradicional JavaScript (basado en prototipos), MooTools se fundamenta sobre un sistema de herencia de clases que sirve de base para la programación orientada a objetos y, por lo tanto, también para todos los componentes incluidos en el framework. Este sistema no solo se caracteriza por ser fácilmente escalable, sino también por que permite escribir código fuente flexible y reutilizable. Así, gracias a dichas clases predefinidas y modificables es posible implementar objetos similares como plugins, elementos HTML, solicitudes AJAX, etc., sin necesidad de invertir una gran cantidad de tiempo. A continuación, te presentamos una síntesis de los componentes de JavaScript utilizados para ampliar MooTools: 

• Core: MooTools Core es el núcleo del framework, a partir del cual se desarrollan todos los componentes para JavaScript. Además de implementar 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 simplifican el proceso de desarrollo y añaden características adicionales.

• Class: el componente Class hace referencia a la clase base necesaria para crear (generar) instancias de clases de objetos reutilizables, así como para la modificación de clases ya existentes.

• Element: este es uno de los componentes más importantes, con cuya ayuda es posible acceder o generar objetos HTML desde navegadores compatibles 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 realización de funciones como el scrolling y el sliding, entre otras.

• JSON: módulo para la codificación y decodificación de cadenas en formato JSON (JavaScript Object Notation).

Algunos módulos se complementan entre ellos. Así, por ejemplo, el módulo Fx.CSS requiere la instalación del módulo Fx. Por lo general, en la sección de descargas puedes seleccionar específicamente aquellos componentes que necesitas y descargarlos como tu framework MooTools personalizado. 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 extensiones disponibles.

Si quieres echar un vistazo al funcionamiento de alguno de los componentes individuales, el equipo desarrollador de Mootools ha creado la web aryweb.nl, en la que no solo encontrarás ejemplos de MooTools o representaciones visuales de la función arrastrar y soltar, formularios y efectos, sino que también encontrarás líneas de código para JavaScript, 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 concentrando en el lado del cliente. Para ello, los applets de Java eran la medida de todas las cosas. Como alternativa a estos “mini” programas, Brendan Eich desarrolló en 1995 LiveScript, el predecesor de JavaScript, para el navegador Netscape 2.0. Las mayores diferencias entre ambos lenguajes fueron, principalmente, que JavaScript reemplazó clases por prototipos y que las líneas de código programado no se aislaron del código HTML, sino que se implementaron en el código fuente. Ambas propiedades se han mantenido hasta ahora.

En un principio, JavaScript actuó como lenguaje de script y principal competidor de los applets de Java. Sin embargo, el verdadero avance se produjo a raíz de la Web 2.0 y, desde 2005, del desarrollo de los navegadores web y de la interfaz DOM. De repente era posible descargar contenido en un segundo plano usando JavaScript, surgieron las primeras interfaces dinámicas en el navegador sin tener que instalar plugins y se generó la necesidad constante de comunicación con el servidor web.

Así se crearon frameworks y bibliotecas JavaScript y, en la última década, JavaScript se ha convertido en el lenguaje de programación más utilizado para el desarrollo web. De esta forma, la web tradicional se ha ido transformando en una aplicación cada vez más compleja y con un gran factor de interacción, hecho que ha aumentado la importancia de JavaScript y de frameworks como MooTools para la programació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 tradicionales se enfrentan a momentos difíciles: la implementación de elementos interactivos es ahora indispensable, lo que hace que para impresionar a los usuarios sea aún más necesario utilizar conceptos innovadores y fáciles de usar. Así, la velocidad de carga también juega un papel importante que depende, en gran medida, de la frecuencia con la que la aplicación web debe acceder al servidor para gestionar las solicitudes entrantes durante la navegació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 aplicación llamada single page o Onepager. Se trata de sitios web que consisten en un único documento HTML y representan la totalidad del contenido en una sola página. Así, en vez de estar estructurados en subpáginas, estos incluyen secciones y eventos que facilitan la navegación con pocos clics o con el simple scrolling.

Aquí, la narración, conocida más específicamente como storytelling, es especialmente popular pues es la que determina la mejor manera de representar la información, utilizando siempre elementos interactivos y construyéndola como una pequeña historia. Para la representación de aplicaciones single page solo es necesario intercambiar unos pocos datos con el servidor web, lo que, por lo general, proporciona un alto rendimiento. Debido al amplio soporte de JavaScript, las aplicaciones de MooTools pueden implementarse con facilidad independientemente del navegador y de la plataforma.

Utilizando JavaScript como lenguaje de programación, el framework MooTools está muy bien acompañado. Alternativas exitosas como, por ejemplo, AngularJs o Ember.js, demuestran que la demanda de los entornos de trabajo JavaScript es muy alta. Este lenguaje de programación es un estándar web indiscutible soportado por los principales navegadores y, además, resulta ideal para el desarrollo de componentes interactivos, formando parte del repertorio obligatorio de todo desarrollador web, incluso si, por defecto, este carece de un sistema de herencia de clases. MooTools elimina este problema y simplifica enormemente la programación de elementos recurrentes.

A primera vista, parece que este enfoque hacia un código fuente ejecutable en el lado cliente solo conlleve ventajas para el usuario, ya que los elementos de JavaScript prometen una gran interactividad y, a la vez, una muy buena velocidad de carga. Sin embargo, el hecho de que la tarea de compilación de código para aplicaciones MooTools tiene lugar, principalmente, en el panel de tareas del cliente, puede generar problemas e implicar riesgos. Como consecuencia, los recursos sufren una gran demanda, algo que, en el caso de clientes y dispositivos de bajo rendimiento, puede ocasionar una reducción del rendimiento o incluso la caída de la página web. Esto afecta en particular a dispositivos móviles como los smartphones (desde los que accede un significativo porcentaje de usuarios a Internet), los cuales también pueden, además, presentar complicaciones relacionadas con algunos de sus componentes específicos, tales como pantallas táctiles o pantallas relativamente pequeñas que no han sido probadas o correctamente optimizadas.

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 programación variada del lado del cliente correrán el mismo riesgo. Es por esto que una parte de los usuarios de Internet utiliza herramientas para bloquear diferentes scripts, entre ellos JavaScript, como NoScript o JS Blocker, a menos que los incluya manualmente en la lista blanca. Por lo tanto, es recomendable prestar especial atención a la seguridad de la aplicación MooTools para lograr la confianza necesaria y alcanzar a la mayor cantidad de usuarios con tu proyecto.

MooTools impulsa el desarrollo del enfoque orientado a objetos de JavaScript, complementando al popular lenguaje de scripting web con clases personalizadas y reutilizables de la misma forma que, por ejemplo, Java o PHP. La implementación de este framework aumenta enormemente la eficiencia de la programación de aplicaciones con JavaScript. En este punto es precisamente donde se encuentran los puntos fuertes de este entorno de trabajo.

El diseño de aplicaciones basadas en MooTools es posible, pero no necesariamente adecuado para todo tipo de proyectos web. Incluso cuando los efectos, las animaciones y los componentes AJAX resultan cada vez más importantes para el desarrollo web moderno, a la hora de realizar tu proyecto web no debes perder de vista la experiencia del usuario. Aunque MooTools y JavaScript fijan excelentes bases, es fundamental implementarlos en dosis adecuadas, pues de lo contrario, la aplicación web superará rápidamente los medios técnicos del cliente utilizado por el usuario.