Avisar de contenido inadecuado

Hydra.js, para hacer tus aplicaciones JS modulares y escalables

{
}

¿Tu JavaScript se va haciendo cada vez mas grande y se está volviendo immanejable? ¿Estas buscando alguna arquitectura que te permita hacer tu aplicacion más escalable?

Para aplicaciones que se van haciendo grandes la mejor solucion es la de aplicar una arquitectura de diseño modular.

Dicho de forma sencilla un modulo seria el código que controla un trozo de HTML (y nada más), o dicho de otra forma, un grupo de HTML + CSS + JS autónomo. 

Por ejemplo, en Yahoo utilizan esta arquitectura lo que les permite realizar codigo JS individualmente a cada modulo que implementan. Esto seria un modulo de Yahoo:

 TAGS:

En su dia, Nicholas Zakas (ex-Front End Engineer de Yahoo) hizo una presentación de las ventajas de hacer una aplicación con esta arquitectura y de cómo implementarlo. 

El esquema general de esta arquitectura es este:

 TAGS:

Desde hace unos meses tenemos disponible Hydra.js un gestor de modulos que nos permite implementar todo este sistema de modulos en nuestro site de manera sencilla. 

Su autor es Tomas Corral actual Javascript Expert en Softonic.com y Evangelizador del Performance & Buenas Prácticas en el JS. 

Algunas de las ventajas de Hydra son:

  • Ningun módulo conoce la existencia de otros modulos (lo que implica que si falla un modulo, el resto seguiran funcionando)
  • Un modulo puede notificar algo y le llegará a todos los modulos que esten esuchando
  • Un modulo puede ser extendido 
  • Los modulos pueden ser testeados mediante Unit Testings
  • Sólo ocupa 1.5kb comprimido
¿Cómo quedaria un modulo tipo en Hydra? Pues asi:
Hydra.module.register('moduleId', function(action)
{
    return {
        init: function (oData) {
            action.listen(['action1', 'action2', 'actionN'], this.handleAction, this);
            $("#button").click(function(){
                action.notify({
                    type: 'listenedAction',
                    data: 'data'
                });
            });
        },
        actionHandlers: {
            action1: function (oData) {},
            action2: function (oData) {},
            actionN: function (oData) {}
        },
        handleAction: function (oNotifier){
            var oHandler = this.actionHandlers[oNotifier.type]
            if(typeof oHandler === "undefined")
            {
                return;
            }
            oHandler.call(this, oData);
            oHandler = null;
        },
        destroy: function () {}
    };
});

 

Para más info sobre Hydra puedes visitar su pagina en GitHub desde donde te puedes hacer un clone del proyecto.

¿Que te ha parecido este gestor de modulos? ¿Lo conocias? ¿Has implementado alguna arquitectura similar en tu aplicación?  Esperamos vuestros comentarios

 

{
}
{
}

Comentarios Hydra.js, para hacer tus aplicaciones JS modulares y escalables

Tema muy pero que muy interesante. Voy a descargarlo y a hacer pruebas... ;-)

Deja tu comentario Hydra.js, para hacer tus aplicaciones JS modulares y escalables

Identifícate en OboLog, o crea tu blog gratis si aún no estás registrado.

Avatar de usuario Tu nombre