Лучшая архитектура приборной панели

Ответ 1

Прежде всего, для начала работы есть множество интерфейсных фреймворков. Некоторые из наиболее популярных включают:

• Backbone
• Javscript MVC
• Sproutcore

Немного исканий в Google может иметь все преимущества и недостатки каждого, и я бы весил ваши варианты соответственно.

Что все сказано, основная проблема, которую вы поставили, на самом деле похожа на нашу. В конце концов, мы построили что-то немного другое в доме. Многие из этих инфраструктур оптимизированы для отображения единственного канонического "представления" на основе модели, отраженной БД и контроллером, для управления небольшими изменениями. По сути, на приборной панели есть множество различных модулей, которые должны делать свои собственные независимые вещи, как вы упомянули в своем вопросе. Из-за большого числа независимых модулей я чувствую, что вы можете почувствовать боль в некоторых из перечисленных выше структур.

Я не могу точно сказать, как реализовать такую ​​архитектуру модуля, но вот некоторые эмпирические правила, которые мы использовали при разработке наших продуктов:

Дизайн модуля:

• Модуль основе. (Модуль входа, модуль карты, каждый Dashlet может быть модулем и т.д.)
• Модули должны иметь одну модель, могут иметь не более одной коллекции (которая есть -модель) и могут иметь один или несколько видов.
• Модуль может использоваться в нескольких местах и ​​на страницах. Единственная модель должна оставаться неизменной, но взгляды, вероятно, будут отличаться.

Rendering:

• Почти весь HTML на странице написан и обновлен модулями javascript. Файлы шаблонов почти пусты, за исключением заголовков и основных лесов.
• Все модули отображают свои собственные HTML-слова и заменяют их на DOM. Модуль должен иметь как можно более статическое представление HTML, готовое к работе перед вставкой в ​​DOM. Это означает, что функции рендеринга используют ".replaceWith()" вместо ".append()".
• Если простая замена HTML не является опцией (т.е. должна быть анимирована), следует определить функцию перехода, подробно описывающую, как перейти из одного отображаемого состояния в другое.
• Поскольку рендеринг дорог, представления по умолчанию не обновляются автоматически при всех изменениях модели. Повторное разрастание происходит только через события. _render() является внутренним методом.

ортогональности:

• Один диспетчер событий между модулями на странице Контроллер обрабатывает все кросс-эффекты между модулями.
• Модули никогда не должны "выходить за пределы" своего собственного контекста DOM. Если событие в одном модуле влияет на другое, оно должно пройти диспетчер диспетчера страниц.
• Каждый модуль как можно более ортогональный. Они зависят друг от друга как можно меньше.
• Каждый модуль в собственном файле.

Подключение к серверу:

• Все модули используют один и тот же глобальный бэкэнд-адаптер. Модули никогда не разговаривают с бэкэнд сами по себе. Это делает ваш внешний интерфейс неактивным.

Рекурсивный

• Модули обычно включаются в другие модули.
• Модули повторно рекурсивно рекурсивно.

Testable

• Поскольку модули визуализируют статический HTML, они могут быть предсказуемо протестированы.
• Модули должны быть проверяемыми.
  • Стандартный ввод → Модуль → Предсказуемый статический вывод HTML.
  • Стандартные события → Модуль → Предсказуемый статический вывод HTML.

Если кто-то знает о других фреймворках в этом направлении, пожалуйста, поделитесь!

Ответ 2

Наше веб-приложение основано именно на этой архитектуре и в производстве с конца прошлого года. Вы можете увидеть его на http://beebole.com

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

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

Ответ 3

Я бы посоветовал использовать пользовательскую веб-инфраструктуру, когда доступно так много бесплатных.

Как уже упоминалось в другом ответе, традиционные рамки стиля MVC не очень хорошо подходят для вашей "приборной панели" желаемого стиля пользовательского интерфейса. Они лучше всего используются для создания статических веб-сайтов на основе данных, полученных в другом месте. Они плохо взаимодействуют с пользовательским взаимодействием, и вам обычно приходится вручную запускать свой собственный AJAX, чтобы делать что-либо полезное без запроса страницы.

Лучшей породой веб-фреймворков, на которые следует обратить внимание, являются веб-фреймворки Web 2.0, также известные как рамки, которые помогают вам создавать веб-приложения. Важно понимать разницу между веб-сайтом и веб-приложениями. Они обычно дифференцируются, поскольку последние являются интерактивными, а первые - в основном статическими. Веб-сайты, которые также имеют некоторые интерактивные компоненты, все еще являются веб-сайтами. Хороший способ подумать об этом - спросите себя: "Это похоже на настольное приложение?".

Для разработки веб-приложений в сфере Java (JVM) я бы использовал Vaadin. Он позволяет писать код Java, похожий на программирование Swing, с использованием методов, основанных на событиях. Вы даже можете избежать написания HTML, если хотите, путем определения ваших взглядов программно. Это позволяет вам унифицировать вашу логику просмотра (в веб-приложениях, более чем обычно), что невозможно с регулярными фреймворками на основе HTML-шаблонов. Другим главным преимуществом является то, что он имеет встроенные методы, которые позволяют писать Java-код для обработки динамических, асинхронных функций, и все это автоматически переводится на JavaScript. Не нужно писать 4 разных языка во время написания своего веб-приложения, просто напишите Java для всего! Попробуйте, с удовольствием работать!

Еще одна инфраструктура веб-приложений, которая получает много внимания, Lift. У меня нет опыта с этим, но многие разработчики, с которыми я говорил, повысили его до меня. Я считаю, что он использует HTML-шаблоны с кодом Java в качестве внутреннего. Также, по-видимому, очень легко начать работу, и ваше веб-приложение развернулось. Он также имеет поддержку для работы с AJAX. Стоит посмотреть, по крайней мере.

Есть, вероятно, еще много рамок для веб-приложений, которые бы соответствовали вашим потребностям. Все они имеют преимущество в том, чтобы быть протестированными, независимо поддерживаться, обновляться и защищаться *. Если вы создадите собственные рамки для этого проекта, вам нужно все обойтись самим собой. Написанная веб-среда, которая не предлагает ничего нового, будет похожа на написанный еще один язык программирования, который не является инновационным; это просто пустая трата времени.

Ответ 4

Я думаю, что то, что вы ищете, более похоже на управление или управление вашей приборной панелью. Я создаю нечто подобное. Я бы посоветовал вам взглянуть на движок Google, который можно использовать для автоматизации и управления этим: https://developers.google.com/appengine/docs/whatisgoogleappengine

Также посмотрите на эти панели с открытым исходным кодом: https://github.com/twilio/stashboard