Чем лучше сделать двухсторонний data-binding помимо AngularJS?

Question

[c030f5da]

Есть HTML-формы с множеством пар input[range] + input[number]. Нужно связать в обе стороны значения этих форм. Посмотрел как это сделать на Ангуляре. Просто, легко, но больно он уж жирный для этого, да и сия статья не вдохновляет, да и сия тоже.

UPD: В результате выбор пал на Angular Light. Но всёже пришлось использовать AngularJS, т.к. он нативно поддерживает валидацию форм, а такая задача впоследствии всплыла.

Answer 1

[Павел Кононенко]

Тоже были сомнения насчет ангуляра из-за этих статей. Когда изучил его на отличном уровне и покопался в потрохах, то понял, что авторы этих статей разбираются в ангуляре, примерно как свиньи в апельсинах. В таком тоне, который присущ этим статьям, можно написать о чем угодно, и это будет иметь уничижительный эффект.
Можете попробовать Angular Light. Коллега на нем проект пилит. Мелкие вещи, вроде двухсторонней связи данных, он разруливает хорошо.

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

Comments

[Никита Гущин]

Эх, мне бы вашу уверенность) Я, после изучения ангуляра, понял, что он безумно хорош для всяких админок (где не нужна СЕО). Потом начали выходить все эти статьи, как плох ангуляр ... в итоге решил попробовать что-то еще. И на данный момент осваиваю реакт.

[Павел Кононенко]

iNikNik: реакт и ангуляр, это как белое и теплое) Реакт — это прикладной инструмент, который так же прекрасно сочетается с ангуляром.
Если честно, то никогда не занимался поисковой оптимизацией. Но по seo у реакта перед ангуляром уж точно нет никаких преимуществ. Если вы про серверную сторону компиляции шаблонов, то на ангуляре это делается совсем не сложно)) Плюс в подавляющем большинстве случаев достаточно простого сайтмапа.
В любом, когда мы хотим создать быстрое SPA-приложение, то должны быть готовы к проблеме оптимизации.

[c030f5da]

Павел Кононенко: Павел, примерно час мне потребовался чтобы сбиндить инпут-слайдер, цифровой инпут и два спиннера (больше/меньше). Незнаю долго ли это для человека никода не работавшего с JS-фреймворками, да и вообще не знающего JS, но мне понравилось))

[Никита Гущин]

Павел Кононенко: я и не пытался сравнивать) Имелась ввиду в целом инфраструктура реакта (flux, например).

Да, я как раз таки про серверный рендеринг. А насчет обработки JS поисковиками - пока у них в доках висит статья о HTML-снапшотах я буду руководствоваться ей, но prerender (или фантом) это слишком кривое решение).

А вот концепция изоморфных (универсальных) js-приложений мне очень понравилась ... а тут еще и react-native на подходе :)

[c030f5da]

Павел Кононенко: Павел, не подскажете пустяковый вопрос, дабы не создавать новый на Тостере. Как изолировать пары инпутов jsfiddle.net/trd8w269 не плодя новых сущностей типа ng-model="num1", ng-model="num2"?

[Павел Кононенко]

c030f5da: это делается через директивы с изолированным скоупом. Сразу советую писать на ангуляре в строгом стиле., как здесь jsfiddle.net/trd8w269/2

[c030f5da]

Павел Кононенко: Хорошо, Павел, спасибо! Как раз в эту сторону копал.

Answer 2

[Алексей Уколов]

Knockout

Comments

[c030f5da]

А чем лучше, Алексей?

[Алексей Уколов]

c030f5da: лучше Ангуляра? Тем, что не такой жирный и изучается за полчаса.

[Алексей Уколов]

Ну а на статьи я бы на вашем месте не смотрел при такой постановке задачи. Вам же не энтерпрайз-SPA писать.

[c030f5da]

Алексей Уколов: ну да, на 30% меньше жирности. Щас попробую, спасибо.

[Валентин Дубровский]

c030f5da: я бы не советовал.

[c030f5da]

Алексей Уколов: Я считаю что всегда надо смотреть наперёд. Когда-то я выбирал между LESS, SASS и Sylus, когда в этом (в выборе) небыло никакого смысла. Пришлось попробовать все три. Сегодня, когда задачи стали сложнее, Stylus с лихвой окупает то потраченное время.

[c030f5da]

Валентин Дубровский: Опять же, почему?

[Валентин Дубровский]

c030f5da: долго описывать, но вот тут Какие преимущества у AngularJS vs KnockoutJS? уже отвечали. И опять же там посоветовали angular light. После того, как на работе приходилось поддерживать knockout, меня теперь чуть ли не трясет от data-bind атрибута

[c030f5da]

Валентин Дубровский: Спасибо, Валентин. Объективного решения я на данном этапе собственной некомпетентности принять не могу, но интуиция подсказывает что выбор в сторону Angular Light в персперктиве может оказаться более удачным решением.

[c030f5da]

Валентин Дубровский: Хотя возможно я и поторопился с выводом. Вот уже как пол часа я не могу допетрить как связать input[range] и input[number] в обе стороны на AL.

[Сергей Протько]

Валентин Дубровский: хватит сравнивать фреймворки и библиотеки.

[Валентин Дубровский]

Сергей Протько: Причем тут это? Вопрос стоял в духе: "какой инструмент выбрать для two-way биндинга". А не какой фреймворк мне выбрать для этой цели.

[Сергей Протько]

Валентин Дубровский: я это о статье "преимущества angularjs vs knockout". Это бессмысленные статьи.

Answer 3

[Владимир]

Matreshka.js
ru.matreshka.io/#home

Comments

[c030f5da]

Владимир, в сравнении с Knockout и Angular, я заметил что Matreshka не требует дополнительных атрибутов и работает напрямую с селекторами (термин из CSS). Это не таит в себе подводных камней?

[Владимир]

c030f5da: Сложно сказать, опыта маловато. Тут частенькоо разработчики сидят, думаб ответят.

Answer 4

[Сергей Мельников]

Пример