Одним из самых распространенных методов построения JavaScript приложений является событийно-ориентированный подход, который предоставляет большую гибкость и позволяет сделать модули системы максимально независимыми друг от друга. Эта парадигма набирает все большую популярность и не редко становится частью многих фреймворков. Но, как правило, с ростом приложения увеличивается и количество событий/подписок, управлять и следить за которыми самому разработчику становится все сложнее, не говоря уже об адаптации новых сотрудников на проекте. Справиться со всеми этими проблемами, призван помочь Capo – модуль, который служит для управления событиями в event-driven js архитектуре и решает один из самых больших недостатков шаблона Mediator – неопределенность триггеров и подписчиков.
Столкнувшись с подобной проблемой на реальном проекте, мы поначалу пользовались стандартным средством разработки – поиском. Но со временем количество событий возрастало, находить «источники» событий становилось всё сложнее, а управлять «одиночками» (событиями, которые никто не слушает или не посылает) стало просто невозможно. Процесс разработки становился сложнее с каждым днем, а с приходом на проект новых людей, и вовсе стал обременять.
Как вы успели заметить, мы не стали уходить далеко от «гитарной» темы (привет mediator.js) и назвали наше детище Capo (см. каподастр). Capo это не метод или подход, а скорее — готовый помощник, который воплотился в виде npm модуля и плагина для Sublime Text. Что же он умеет? Вернемся к проблеме паттерна Mediator.
Представим ситуацию – вы приходите на новый проект, где используется архитектура, построенная на событиях. Сколько времени вам понадобится, чтобы полностью отследить все цепочки ивентов и подписок на них? Как показывает практика, занятие это занимает уйму времени и не приносит массу удовольствия.
Чтобы упростить этот процесс мы решили унифицировать поиск всех событий и предоставить результат разработчику в виде интерактивного отчета. Npm модуль Capo осуществляет поиск по всем файлам из указанной папки, находит все связи типа триггер-подписчик и отслеживает их. После этого формирует (по-умолчанию) html отчет следующего вида:
Live Demo
Слева находится меню для навигации по найденным событиям, с правой стороны триггеры и подписчики с указанием файла, строки и контекста. В секции Strange events – ивенты, которые не имеют подписчиков или триггеров и могут стать причиной больших бед. Модуль подходит для всех проектов, где используется mediator.js, Backbone.js, node.js EventEmmiter или любой другой объект, предоставляющий publish-subscribe интерфейс. Capo также обладает рядом дополнительных возможностей, которые могут стать очень полезными. Так, к примеру, присутствует возможность отправить отчет на печать или вывести непосредственно в консоль (capo-cli), сам Capo может быть добавлен как build step в grunt (grunt-capo), а также «шпионить» за событиями, сгенерировав подписки-заглушки для всех ивентов найденных в проекте(spy-generator).
Для еще большего удобства следовало интегрировать эти возможности и в среду разработки. Так Sublime Text 3 пополнился еще одним плагином, который призван облегчить жизнь при непосредственной разработке приложений с использованием event-driven js архитектуры.
После установки, достаточно воспользоваться комбинацией клавиш для запуска поиска (по-умолчанию Alt+D) и, используя быструю панель, выбрать необходимый файл. Плагин откроет его в новом окне и выделит строчку с найденным событием.
Создавая Capo, мы в первую очередь стремились облегчить процесс разработки самим себе, а также помочь новым ребятам на проекте быстрее понять архитектуру приложения. Надеемся, что Capo действительно поможет и вам держать события под контролем и решить извечную проблему неопределенности триггеров и подписок в своих проектах.
Исходный код и описание модулей Capo можно найти по ссылкам:
- npm module: github.com/msemenistyi/capo
- grunt-task: github.com/msemenistyi/grunt-capo
- sublime text 3 plugin: github.com/confa/capo
