h-ubuCDI in JavaScript

Clement Escoffier

Dynamis Technologies

How do we do that in Java ?

Components

Interfaces

DependencyInjection

What do we havein JavaScript ?

Module Patterns

+ -Fix visibility A bit complex

No interfaces

Module loaders

+ -Avoid <script>

TransitiveReuse

Hard-codeddependencies

MVC / MVVM

+ -Code

organizationUI Bindings

Pushingthe limits

Well, so what’sh-ubu ?

Service-basedInjection

Framework

hub

components

var component = {configure : function(hub, conf) { },getComponentName : function() { },start : function() { },stop : function() {}

};

hub.registerComponent(component).start()

contracts

var myService= {doSomething : function() {}

}

services

servicesServiceRegistry

1 - Publication2 – Lookup,Service Listener 3 - Binding

Why services ?

SubstitutabilityLoose-coupling

TestableDynamic

var provider = {configure : function(hub, conf) {

hub.provideService({component: this,contract: myService

});},getComponentName : function() { },start : function() { },stop : function() {},doSomething : function() { … }

}

var consumer = {configure : function(hub, conf) {

hub.requireService({component: this,contract: myService,field: "svc"

});},getComponentName : function() { },start : function() {},stop : function() {},work : function() {

this.svc.doSomething();}

}

var consumer = {configure : function(hub, conf) {

hub.requireService({component: this,contract: myService,field: "svc"

});},getComponentName : function() { },start : function() {},stop : function() {},work : function() {

this.svc.doSomething();}

}

Proxy

events

var publisher = {configure : function(hub, conf) {}getComponentName : function() { },start : function() {},stop : function() {},work : function() {

this.hub.publish(this, "my/topic", event);

}}

var receiver = {configure : function(hub, conf) {

hub.subscribe(this, "my/(.)*?", this.receive);

},getComponentName : function() { },start : function() {},stop : function() {},receive: function(event) { }

}

Modularize yourJavaScript

require.js/node.jsComposition

StandaloneConfigurability

http://nanoko-project.github.com/h-ubu/snapshot/

h buStop hacking,

Start composing