- Solve problems once
- Work with other architectural decisions at the Guardian
- Get things done quickly
- Nothing new
- Based (lightly) on Flight and Closure Components
- Simple (more of an interface)
- Using Guardian NextGen’s MicroLibs

var Lion = function() {}
component.define(Lion);
// ...
var lion = new Lion();
var elem = document.getElementById('lion');
lion.attachTo(elem);
// OR
lion.attachToDefault();
<script type="text/template" id="tmpl-lion">...</script>
<!-- Now in the JavaScript -->
// ...
lion.render();
lion.on('roar', this.getElem('tail'), this.wagTail);
lion.emit('roar', { volume: 'extreme' });
<div class="face">
<div class="face__eyes"></div>
</div>
var eyes = face.getElem('eyes');
eyes.setState('closed');
<div class="face">
<div class="face__eyes face__eyes--closed"></div>
</div>
- Data binding: Knockout, Ractive? Real time?
- Templating
- Documentation
- TESTING‽