Backbone.js все быстрее становится самой популярной платформой для создания модульных JavaScript приложений на стороне клиента. В основном это просто благодаря отсутствию больших препятствий в начале работы; начать работать с ним супер-просто. Однако, в отличие от Ember.js, из-за такой минимальности Backbone разработчику приходится многое додумывать самому.

Итак, как только вы хотите расширить приложение, все становится не таким уж и простым. Backbone.Marionette был создан для того, чтобы облегчить все трудности, связанные с Backbone разработкой. Согласно его автору, Backbone.Marionette «заставляет танцевать ваши Backbone.js приложения с помощью композитной архитектуры приложения!».

Эта «композитная» архитектура в основном относится к многочисленным типам views которые призваны помочь в управлении subview. Сегодня мы не будем обсуждать view (хотя мы коснемся region, который является малой частью управления subview, предоставляемые Marionette), но вы можете найти документацию по этому проекту на GitHub repository. Он предлагает множество компонентов, которые расширяют Backbone и позволяют писать меньше шаблонов, но делать больше вещей без каких либо хлопот, особенно когда дело доходит до view.

Объект центрального приложения

В основном, когда кто-то создает Backbone приложение, он делает центральный объект, к которому все привязано, что часто называют App или Application. Backbone не предлагает ничего, из чего можно создать этот объект, поэтому большинство людей просто создают основной роутер и называют его app объектом. Хотя и здорово, что люди присоединяют все к центральному объекту так, что глобальное пространство имен не запутано, все же роутер не был спроектирован для того, чтобы справиться с этим заданием.

У Дерика Бейли, создателя Marionette, была идея получше. Он создал «класс», из которого вы можете реализовать объект, специально разработанный для того чтобы справляться с обязанностями основного корневого объекта всего приложения. Вы начинаете создание нового приложения с var App = new Backbone.Marionette.Application(), а потом, когда все настроено, вы запускаете приложение с App.start(options). В ближайшее время мы будем обсуждать аргумент options. А сейчас просто помните, что это необязательно.

инициализаторы

Одной из классных вещей касательно Marionette в Application являются инициализаторы. Если у вас модульный код, то несколько его частей должны быть инициализированы при запуске приложения. Вместо заполнения main.js файла большим количеством кода для инициализации всех этих объектов, вы можете просто настроить модули таким образом, чтобы инициализация происходила внутри кода самого модуля. Вы можете сделать это при помощи addInitializer. Например:

var SomeModule = function(o){
	// Constructor for SomeModule
};

App.addInitializer(function(options) {
	App.someModule = new SomeModule(options);
});

Все инициализаторы добавленные таким образом, будут выполняться при вызове App.start. Обратите внимание, что аргумент options передается к инициализатору. Это тот же самый объект, передаваемый в тот момент, когда вы вызываете App.start(options). Это отличная возможность разрешить передать конфигурацию так, чтобы каждый модуль мог ее использовать.

Несколько событий также вызываются при работе через эти инициализаторы:

• initialize:before вызывается как раз перед тем, как запускаются инициализаторы.
• initialize:after вызывается как раз после того как инициализаторы закончили свою работу.
• start вызывается после initialize:after.

Вы можете прослушивать эти события и иметь еще больший контроль. Прослушивайте эти события таким образом:

App.on('initialize:before', function(options) {
	options.anotherThing = true; // Add more data to your options
});
App.on('initialize:after', function(options) {
	console.log('Initialization Finished');
});
App.on('start', function(options) {
	Backbone.history.start(); // Great time to do this
});

Все довольно просто и это также даст вам максимальную гибкость в начале создания ваших приложений.

Агрегатор событий

Объект Application дает еще больше возможностей для декомпозиции Backbone приложения путем использования агрегатора событий. Некоторое время назад я писал о масштабируемых JavaScript приложениях, в которых я упомянул, что модули системы должны быть в полном неведении друг о друге, и что единственный способ, через который они должны иметь возможность общаться друг с другом это события по всему приложению. Таким образом, каждый беспокоящийся модуль может прослушивать изменения и события, в которых они нуждаются так, что они могут на них реагировать и ничего в системе даже не поймет, что они вообще существуют.

Marionette делает этот вид декомпозиции более возможным при помощи агрегатора событий, который автоматически прилагается к объекту приложения. Хотя это всего лишь один из механизм …

Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров