Какие преимущества у AngularJS vs KnockoutJS?

Question

[Kir ---]

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

Подскажите, пожалуйста, примеры приложений, где AngularJS раскрывает свои преимущества. Пока что всё, что я видел, говорит не в пользу AngularJS.

Comments

[Kir ---]

Да и по производительности он уступает:
jsperf.com/angular-vs-knockout-vs-ember/284

Answer 1

[lega]

Да и по производительности он уступает:

Есть ещё такой тест который показывает обратное: plnkr.co/edit/leZaT043Yffz4LfG8Ykq?p=preview

Я перешел от Knockout.js к Angular.js (а потом и к Angular Light), вот некоторые минусы первого:
1) В ng есть декларативный биндинг, в ko нет (раньше не было), хотя недавно натыкался на какие-то решения.
2) Из-за того что в angular dirty check - не нужно заворачивать данные в observable, это очень удобно.
3) В ng можно без проблем оперировать с данными (большие вычисления), в ko для этого нужно достать данные из observable, провести операции, потом положить обратно.
4) Так же в ko происходит "мгновенное" обновление, что несет 2 неприятности: 1) нагрузка, возможно не нужно обновлять именно сейчас 2) иногда нужно учитывать порядок обновления данных, т.к. зависимые расчеты могут сломаться.
5) Есть ещё не маленькая неприятность, когда в большом проекте нужно сделать доработку - и нужно сделать обычную переменную как observable - заставляет рефакторить, или наоборот перевести из observable в обычную для оптимизации, этой проблемы в angular нет.

Можете так же посмотреть Angular Light, он попроще, + есть некоторые полезные фичи которых нет в Angular.js

Comments

[Kir ---]

А что делать с читабельностью у AngularJS. Ведь основная проблема при разработке приложений, это как раз скорость разработки. Правило 80/20 пока что до сих пор остаётся верным.

[Kir ---]

Я сегодня сел изучать KnockoutJS и написал уже админку к вечеру. С AngularJS я плакал к концу дня :)

[lega]

Объекты observable усложняют разработку, на маленьких приложениях оно не чувствуется, но в больших - оно будет раздражать и тормозить разработку.

У меня есть опыт того и другого, дак вот скорость разработки и читаемость у Angular Light выше (имхо). А вообще это в первую очередь зависит от того что лучше знает разработчик.
Для сравнения попробуйте на ko сделать такой биндинг-элемент6 jsfiddle.net/lega911/v2uf2

> С AngularJS я плакал к концу дня :)
Попробуйте Angular Light, там нет таких "барьеров" как модули, сервисы, провайдеры, константы. Директивы делаются просто - почти так же как биндинги в ko, и там тот же applyBindings ;)

[Kir ---]

@lega
> Для сравнения попробуйте на ko сделать такой биндинг-элемент6 jsfiddle.net/lega911/v2uf2
Самое топорное решение вот у меня такое получилось: jsfiddle.net/KTW34
Если нужно возвращать значение и использовать отдельно где угодно, можно завернуть это в custom bindings, не стал делать, т.к. это просто дело техники.

за Angular Light, спасибо попробую.

На счёт ваших 5ти пунктов.
Первый пункт я вообще не понял, что вы имели в виду.
Третье и четвертое, очень сомнительно. Т.к. ko.observable не глупый и оптимизация, скорее всего будет нужна в другом месте.

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

[Kir ---]

@lega Пытаюсь сейчас разобрать код в вашем примере, блин, извините, конечно, но он не читабельный вообще. Честно говоря, я вообще не понимаю как это работает :(

[Kir ---]

www.knockmeout.net/2014/03/knockout-3-1-released.html
Как я и говорил, вопрос ограничения обновлений больше не актуален

[lega]

1 пункт, про удобный биндинг {{model}} в тексте и атрибутах.

> Второй пункт и пятый
Да.

> Третье и четвертое, очень сомнительно
Оно не критично, но есть.

>Как я и говорил, вопрос ограничения обновлений больше не актуален
Нет, это про другое, попробуйте такой observable вызвать 1М раз - оно будет в "десятки тысяч" раз медленнее чем на голом js. Грубо говоря это while{ a(a()+1) } вместо while{ a++ }.

> но он не читабельный вообще
Просто там, coffeeScript

[lega]

Что-то jsfiddle жутко тормозит и не логинится :(
Вот переделал ваш пример на Angular Light за 1-2 мин. jsfiddle.net/S3nc9

[lega]

Кстати обратите внимание на al-repeat - "крутится" текущий элемент, а не вложенный - это гораздо удобнее в большинстве случаев. Например когда перед "крутящимся" li-элементом есть статические li-элементы.
Так же мне больше нравится биндинги по атрибутам чем в одном: al-css="", al-click="" вместо data-bind="css:{}, click:{}", причем в aLight у директив разные приоритеты выполнения.

[lega]

jsfiddle вроде ожил, добавил начальный рейтинг: jsfiddle.net/lega911/N8y4M
Ну и к предыдущему комментарию, сравните вывод текста: (span data-bind="text: raiting")(/span) и просто {{rating}}

[Kir ---]

@lega Теперь понял что вы имели в виду про binding, в ko он конечно есть, но излишне длинный: ""

В общем вы меня полностью убедили, что Angular Light имеет ряд весомых преимуществ перед knockout :)

[Kir ---]

< !-- ko text: raiting -->< !-- /ko -->

Answer 2

[Damir Makhmutov]

Различия в том, что KO по своей философии не годится для больших SPA приложений. Почему ? Потому что делается там всё через eval. Из этого следует большая вероятность утечек памяти. У него гораздо меньше возможностей "из коробки".
Angular работает несколько иначе. Он больше подходит для больших SPA приложений, больше возможностей из коробки, больше вероятности сделать качественное приложение.
И всё таки гуглите больше, и найдете ответы на все вопросы :-)

Comments

[Damir Makhmutov]

Добавлю еще: по скорости КО быстрее, и правда, потому что он меньше, и работает гораздо прозрачнее чем Angularjs. "не годится для больших приложений" - это моё личное мнение, но глядя на 2gis.ru можно сделать вывод что всё-таки годится. Но я бы не стал делать большое приложение на КО :-) Если выбирать среди MVVM фреймворков - то я выбираю Angular.

[Kir ---]

Пока что в сети я встречал лишь мнения, что AngularJS подходит для больших приложений, лишь потому что потому. Без аргументов. Хотя время показывает, что когда какой то framework оправдывают подобным образом лишь потому что он монструозный и не более.

Что есть философия KA которая не годится для больших SPA приложений?

[Damir Makhmutov]

@SowingSadness KO работает по принципу: eval('alert(123)'). Всё что вы пишете в data-bind="...your code here..." потом вставляется в eval. Это и есть то зло, которое не рекомендуется использовать в больших приложениях.

[Kir ---]

@doodoo есть такой javascript шаблонизатор - doT. Он на данный момент самый быстрый из существующих, так вот он тоже во всю использует eval.
Пока что я не нашел ни одного "против" почему нельзя использовать сторонюю библиотеку, которая реализует свою концепцию с использованием данного функционала.
Я знаю лишь "против", когда вы реализуете своё RIA что ни коем образом не пересекается предыдущем.

Отдельно можно упомянуть решение mail.ru получать объект из DOM-элемента путем вызова onclick, что по своему подобию и есть eval

[lega]

Сейчас посмотрел исходники, у них не через eval сделано, а через new Function, да и eval при правильном использовании не плох.

[Kir ---]

@lega "new Function" и "eval" это по сути одно и тоже.