Есть ли JavaScript MVC (микро) фреймворк? [закрыто]


133

Существуют ли клиентские JavaScript MVC (микро) фреймворки?

У меня довольно сложная форма HTML, и она будет полезна из шаблона MVC.

Я полагаю, что хорошее решение могло бы обеспечить следующее:

  • Model и View обновляют контроллер при изменении значений (шаблон Observer)
  • Заполните модель из данных формы при загрузке страницы
  • Заполните форму из модели при изменении модели

Аякс, комета, JSONP и весь этот джаз - это серьезное излишество.


2
Я ошибаюсь или это просто плохая идея (или, может быть, фреймворк совместим с модным словечком)?

2
Я начал работать над чем-то недавно, потому что у меня было такое же чувство, как и у вас. Он настолько же минимален, как и AMD, и настолько незаметен, насколько я мог это себе представить. Это означает, что нет jQuery и т. Д. Я знаю, что это было закрыто сейчас, но я думаю, что это может быть то, что вы искали: github.com/Wolfy87/tarmac - я не так много сделал с этим в последнее время, потому что я думал, что я был бы единственным пользователем.
— Olical


Взгляните на TodoMVC , который сравнивает (почти) все доступные JavaScript-фреймворки, внедряя простое приложение TODO.
— Коппор

Ответы:


71

Магистраль - отличный легкий каркас. Попробуйте: http://backbonejs.org/


2
Я так рад, что нашел Backbone.
— Аарон Гринли

Я согласен, один, чтобы проверить определенно!
— Айвенго

Как использовать Backbone способом MVC?
— IsmailS

1
@ TristanJuricek есть ли бесплатная альтернатива peepcode?
— Мэтт

Пропустите Backbone и идите прямо к позвоночнику. У него гораздо более логичная реализация MVC.
— Крис Джейнс

33

JavaScriptMVC - отличное решение. Это все, что плагин подход позволяет вам выбирать только те функции, которые вам нужны. Начиная с версии 2.0 он основан на jQuery.

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

Однако JavaScriptMVC - просто лучшая библиотека JavaScriptMVC общего назначения из-за ее мощных контроллеров, основанных на делегировании событий.

Делегирование событий позволяет вам избежать необходимости прикреплять обработчики событий и просто создавать правила для вашей страницы.

Наконец, JMVC - это намного больше, чем архитектура MVC. Все части цикла разработки покрыты:

  • Генераторы кода
  • Комплексное тестирование Selenium и Env.js
  • Механизм документации
  • Автоматический Конкат + Компресс
  • Обнаружение ошибок и отчетность

1
+1 для JavascriptMVC - я уже использовал его для нескольких приложений, и это довольно мило. Пропустите примеры генерации кода на сайте. Я полагаю, это только для того, чтобы успокоить фанатов Rails. :) Начните с базовой объектной модели JQueryMX и создайте контроллер.
— Крис Джейнс

1
Так как я сделал этот комментарий, я переключился на использование Require и Spine. В конечном итоге они меньше, элегантнее и менее «корпоративны», чем JMVC. JMVC было хорошо для нашей команды Java-разработчиков внести корректировку в JS, но он просто не выдерживает, когда вы начинаете лучше понимать JS ...
— Крис Джейнс

MVC часть JMVC теперь can.js
— PHearst

21

У Spine есть API, похожий на Backbone, но он намного меньше. Он имеет прототип наследования.


2
Он также написан на CoffeeScript и использует классы в стиле CoffeeScript - не то чтобы это был огромный выигрыш, но это довольно приятно.
— платный ботаник

1
Я полагаю, поэтому он меньше, чем позвоночник? Coffeescript код более компактен ...
— Бренден

Я люблю позвоночник. Используйте его с RequireJS для чистой удивительности. Пусть вас не пугает тот факт, что это CoffeeScript, он тоже отлично работает с обычным JS ...
— Крис Джейнс

Браузер поддерживает IE> = 9, поэтому убедитесь, что он соответствует профилю ваших посетителей.
— Ричард

20

AngularJS хорошо работает вместе с jQuery и поможет вам со структурой MVC и строгим разделением задач.

Полная среда тестирования и внедрение зависимостей включены ...

Проверьте это на http://angularjs.org


Angularjs является лучшим на конец 2013 года .... Я думаю ....
— Тони Бао

15
угловой не является микро рамкой: /
— iConnor

1
Согласитесь, Angular не является микро-фреймворком.
— Войта

2
да, кривая обучения также непропорциональна, это дает преимущества по сравнению с другими системами.
— vsync

4
угловой является полной противоположностью микро рамки. это зверь
— hasen


14

Я думаю, что это выглядит как то, что вы должны проверить: http://knockoutjs.com/

(Как программист silverlight / wpf именно эта библиотека заставила меня наконец начать изучать javascript. Она основана на шаблоне Model-View-View-Model (MVVM), поскольку для меня сейчас это хороший выбор!)


Как программист silverlight / wpf я оценил нокаут, позвоночник и пару других. В конце дня я перешел на Angular. У него есть привязки и многое другое.
— Jonperl


8

ember.js

Вот три функции, которые делают Ember радостью использования:

  1. Наручники
  2. Вычисленные свойства
  3. Автообновление шаблонов

Наручники

Используйте привязки, чтобы синхронизировать свойства двух разных объектов. Вы просто объявляете привязку один раз, и Ember обеспечит распространение изменений в любом направлении.

Вот как вы создаете привязку между двумя объектами:

MyApp.president = Ember.Object.create({
  name: "Barack Obama"
});

MyApp.country = Ember.Object.create({
  // Ending a property with 'Binding' tells Ember to
  // create a binding to the presidentName property.
  presidentNameBinding: 'MyApp.president.name'
});

MyApp.country.get('presidentName');
// "Barack Obama"

Привязки позволяют вам спроектировать ваше приложение, используя шаблон MVC (Model-View-Controller), а затем спокойно, зная, что данные всегда будут правильно передаваться от слоя к слою.

Вычисленные Свойства

Вычисленные свойства позволяют вам рассматривать функцию как свойство. Вычисляемые свойства полезны, потому что они могут работать с привязками, как и любое другое свойство.

Автообновление шаблонов

Ember использует Handlebars, семантическую библиотеку шаблонов. Чтобы взять данные из вашего приложения JavaScript и поместить их в DOM, создайте тег и поместите его в свой HTML, где бы вы ни хотели видеть значение:

<script type="text/x-handlebars">
  The President of the United States is {{MyApp.president.fullName}}.
</script>

2
Желательно использовать поверх магистрали любым способом .... если спецификации не так ясны на начальных этапах ..
— Bijendra

4
Мне нравится emberJS, но это не «микро», это ОГРОМНО, потому что это плоский фреймворк
— iConnor

1
Использование Ember и микрорамок в одном предложении не должно быть разрешено.
— префикс

8

Stapes.js

Полное раскрытие: я автор этой библиотеки :)

Если вы ищете что-то действительно крошечное (1.5kb minified / gzipped), посмотрите, и скажите мне, если вам это нравится.


Отлично смотрится с первого взгляда! Мне нравится ваш акцент на наследовании прототипов (без смоделированных классов и без запутанного newоператора). То , что кажется ненужным является еще одним eachи map. У меня уже есть они в Underscore.js и jQuery .
— Фекли

7

Если ваши требования действительно просты, вы можете написать свой собственный простой MVC, как Алекс Неткачов .

Его примеры построены на dojo (Примечание: они не работают для меня на его странице из-за отсутствия файла dojo.js), но вы можете следовать шаблону в простом Javascript.


4

Это, вероятно, излишне для того, что вам нужно, но SproutCore - это инфраструктура MVC, и она не выглядит более тяжелой, чем JavaScriptMVC или TrimPath Junction .

К сожалению, ни один из них, кажется, не построен на принципе прогрессивного улучшения .


1
Основные MVC-компоненты JavaScriptMVC примерно на 1 Кб больше, чем gzipped Backbone (хотя и обладают рядом дополнительных функций). И JMVC полностью способен создавать прогрессивно улучшенные приложения. Вы бы просто выбросили слой модели.
— Джастин Мейер

3

Популярная платформа ActionScript MVC PureMVC была недавно портирована на JavaScript. У меня еще не было возможности попробовать это, но я уверен, что это хорошо.


Мне нравится это для flex. Просто и мощно.
— Гленн

3

Пожалуйста, также проверьте jquery-claypool .

jquery-claypool - это небольшая, быстрая, рельсовая инфраструктура mvc, построенная на jquery, основанная на моем опыте работы с django, rails, spring и т. д. Она очень легкая и работает как на клиентских, так и в серверных средах.

это обеспечивает структуру маршрутизации для чистого mvc, регистрации категорий, фильтров (aop), ленивого создания контроллеров, инверсии управления, соглашения по конфигурации и не намного больше по дизайну.

он не делает ничего, что jquery уже делает, ощущается как jquery и работает как хорошая структура: просто.

JQuery-Клейпул

Надеюсь, вы это проверите.


Как вы видите Claypool по отношению к Backbone?
— Пепийн


2

Если вы хотите держать вещи под контролем и быть достаточно простыми, вам может не понадобиться интегрированная среда, а просто реализовать собственный шаблон mvc. Просто проверьте эту статью: модель-представление-контроллер (MVC) с JavaScript от Алексея Неткачова в 2006 году.




2

ОБНОВЛЕНИЕ 2016: Sammy.js, кажется, заброшен.

Посмотри на Sammy.js

Текст с сайта:

Небольшая вебкамера с классом.

  • МАЛЕНЬКИЙ ядро Сэмми сжато только на 16 КБ, сжато на 5,2 К и сжато
  • МОДУЛЬНАЯ Sammy построен на системе плагинов и адаптеров. Включайте только тот код, который вам нужен. Также легко извлечь свой собственный код в повторно используемые плагины.
  • ЧИСТАЯ Весь API был разработан, чтобы быть легким для понимания и чтения. Сэмми пытается поощрять хорошую инкапсуляцию и дизайн приложений.
  • Веселье Что такое реальная точка развития, если это не приятно. Сэмми пытается следовать подходу MATZ. Это оптимизировано для счастья разработчика.

Не могли бы вы рассказать, что такое MATZ?
— kstep

Юкихиро «Матц» Мацумото, создатель ruby, часто говорил, что он «пытается сделать Ruby естественным, а не простым» способом, отражающим жизнь. Таким образом, программное обеспечение должно быть естественным для пользователя. Это подразумевается под подходом MATZ.
— Биджан


1

CorMVC, легко понять и начать, основанный на jquery и не зависит от какой-либо серверной технологии


1

Я разработал очень простую инфраструктуру Javascript MVC под названием MCV . Он не делает именно то, что вы просите, но его легко расширить с помощью помощников. Во всяком случае, это определенно микро (1,9kb упакованы).

Это работает более или менее как Джамал, но я решил свернуть свой собственный по двум причинам:

  • удалить зависимость jQuery (хотя я использую ее вместе с jQuery большую часть времени)
  • делая его расширяемым с помощью помощников. Это аналог поведения CakePHP, его компонентов и помощников.


1

Я проголосовал за AngularJS (полное раскрытие, я ограниченно вовлечен в усилия по разработке угловых приложений) и очень рад этому. Я провел параллельное сравнение, взяв одну функцию для внутреннего проекта (извините, у меня нет подписи, чтобы поделиться ею) и реализовав ее как в AngularJS, так и в Backbone. Это было отличное упражнение, и в итоге я очень сильно склоняюсь к Angular. Разработчики ядра прекрасно умеют отвечать на вопросы, и они проделали отличную работу со встроенной привязкой данных, тестированием модулей / e2e и документацией. Это все еще в бета-версии с 1.0, выходящим в ближайшем будущем. Бета очень стабильная.

Существует некоторая смена парадигмы, и они используют совершенно иной подход, чем большинство. Интеграция ваших любимых плагинов jquery требует немного усилий, но выполнима и уже выполнена (angular-contrib на github).

Я скажу (а это проблема для большинства js-centric-фреймворков), обязательно изучите, как сделать ваш контент SEO-дружественным (если это важно для вас). Со времени присоединения к сообществу angular в июне я заметил, что интерес растет, и многие люди публикуют сообщения о том, что они смотрели на Backbone и других, но им действительно нравится то, что они видят в Angular.








0

Can.js имеет все необходимое и весит всего 8 КБ. Он взял лучшие биты из JavaScriptMVC и превратил его в один маленький, но потрясающий фреймворк с наблюдателями, виджетами, связыванием, работами. Он совместим с основными фреймворками ( jQuery , Dojo Toolkit , MooTools и т. Д.). Документация отличная, и авторы отзывчивы. Это определенно стоит посмотреть.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.