Javascript-форум (https://javascript.ru/forum/)
-   Оффтопик (https://javascript.ru/forum/offtopic/)
-   -   Обзоры фреймворков, библиотек, компонентов и прочего (https://javascript.ru/forum/offtopic/55538-obzory-frejjmvorkov-bibliotek-komponentov-i-prochego.html)

Gozar 06.05.2015 01:50

Смотрю я на Ractive и напоминает он мне fj.

А на Ember кто-нибудь писал? Как оно?

kobezzza 06.05.2015 10:17

Цитата:

Я для админки хочу подобрать что-нибудь, пусть тяжелое, но чтобы быстро разрабатывалось.
ExtJS :) Там кстати, в 5-й версии, дата-биндинг тоже добавили.

nerv_ 06.05.2015 11:34

Цитата:

Сообщение от Gozar
А ты сейчас на что хочешь перейти? Или хочешь остаться на ангуляр. Я для админки хочу подобрать что-нибудь, пусть тяжелое, но чтобы быстро разрабатывалось.

я пока думаю над этим вопросом. Ангуляр форсит структуру приложения и это большая проблема.
Лично мне симпатичен Vue.js. Из коробки много полезных и нужных директив, но при этом ничего лишнего. Он не работает с vdom, а это значит, что можно будет безболезненно прикручивать жуквери плагины (например).


Цитата:

Сообщение от kobezzza
ExtJS

насколько я знаю неповоротливый монстр :)

kobezzza 06.05.2015 12:30

Цитата:

насколько я знаю неповоротливый монстр
Для админок самое то.

Gozar 06.05.2015 18:26

Цитата:

Сообщение от kobezzza
ExtJS

Точно, я ж про него совсем забыл. Спасибо :)

Gozar 06.05.2015 18:35

Цитата:

Сообщение от Gozar
про него совсем забыл

И ещё забыл что он платный. килобакс жалко.

Safort 05.06.2015 22:10

Цитата:

Сообщение от kobezzza (Сообщение 369632)
Для админок самое то.

Это почему? И что делать нищебродам, он же платный(

Тоже ищу фреймворк, у меня такие же требования к фреймворку как у Гозара, но в добавок нужен ES6. Кто-то может что-то подсказать? Или таких ещё нет.

Gozar 05.06.2015 23:45

Цитата:

Сообщение от Safort
он же платный(

А ещё, я делаю третью попытку, ставлю на распаковку, после 5 минут распаковки - где-то 10% объем около 230 мб. Сбрасываю нафиг и удаляю. Он ну очень жирный.

nerv_ 05.06.2015 23:57

Цитата:

Сообщение от Gozar
А ещё, я делаю третью попытку, ставлю на распаковку, после 5 минут распаковки - где-то 10% объем около 230 мб. Сбрасываю нафиг и удаляю. Он ну очень жирный.

сам недавно качал opencv
270 мб архива превратились в 2,7гб на диске
:)

FINoM 08.06.2015 16:17

Соглашусь с Гозаром (хотя и признаю странным такое поведение, но мы знакомы давно). Пихать все фреймворки в одну кучу - неправильно. Тот же Ember в тестах выигрывает у React, хотя они работают по-разному: первый рендерит HTML строку с помощью текстового шаблонизатора, второй - генерит виртуальный DOM. Есть еще третья группа: использующая DOM шаблонизатор (без строк и виртуалок)... Каждый подход выгоден по скорости в отдельных случаях: текстовый шаблонизатор хорош там, где контент не динамичен либо перерисовывается заново и пр.

Итак:
- Текстовый шаблонизатор
- Шаблонизатор, использующий Virtual DOM
- DOM шаблонизатор (манипулирующий нодами напрямую)

Так же следует разделить фреймворки по типу взаимодействия с данными:
- Есть двусторонний data-binding
- Нету байндинга

Кроме этого, код бенчмарков не всегда корректен. Недавно сравнивал скорость своего фреймворка с несколькими другими и удивлялся, почему у некоегого супербыстрого хитрого форка Angular такая высокая скорость. Оказалось, что разработчик, писавший бенчмарки, являясь ярым поклонником Ангуляра, использовал textContent вместо innerHTML. Этот хитрожопый трюк ускорил мой код в 4 раза.

FINoM 09.06.2015 23:14

Так ли быстр ReactJS?

Gozar 09.06.2015 23:35

Цитата:

Сообщение от FINoM
Так ли быстр ReactJS?

Так и знал, что найдется кто-то кто запостит этот шлак сюда.

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

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

FINoM 10.06.2015 01:13

Цитата:

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

Очень хрупкий аргумент. Взяли, задокументировали фичу Ангуляра, и Реакт уже не кажется таким класным.

Gozar 10.06.2015 10:09

Цитата:

Сообщение от FINoM
Взяли

Как только, так сразу. ;)

Суда по тому как они поддерживают документацию им есть к чему стремиться.

Цитата:

Сообщение от FINoM
Очень хрупкий аргумент

Этот аргумент привел к тому, что я пишу на реакте, а не на ангуляре. Начинал изучать новые фрейм-ки я с Ангуляра.

l-liava-l 10.06.2015 13:09

К слову о сокрости, почему все забыли про {{:: }} в ангуляре? в огроомном кол-ве задач нам не нужен постоянный вотч, а требуется сделать бинд лишь один раз.
+ ну и да, track by и не обсуждается. Этого хватает для 99% задач, а в остальном 1% можно запилить директиву на основе реакта.. :)

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

Из серьезных косяков у ангуляра - эт весьма многословный синтаксис и AMD, хочется юзать common.js модули и изомрофонсть.

nerv_ 10.06.2015 14:17

Цитата:

Сообщение от l-liava-l
Из серьезных косяков у ангуляра - эт весьма многословный синтаксис и AMD, хочется юзать common.js модули и изомрофонсть.

угу
во втором исправили

Цитата:

Сообщение от l-liava-l
К слову о сокрости

http://javascript.ru/forum/angular/4...itelnosti.html

Safort 10.06.2015 16:57

Что думаете об Ember.js? Недавно решил его попробовать.

Gozar 11.06.2015 23:56

Цитата:

Сообщение от Safort
Недавно решил его попробовать.

Как успехи? Сейчас тоже смотрю его и либо добавлю его к себе в коллекцию, либо останусь на react. Angular 2.0 я так понимаю ждать ещё долго, а писать в AMD стиле некошерно. И раз уж nerv смотрит фреймворки, хотя сам сидит на ангуляре, то это подозрительно...

Safort 12.06.2015 10:53

Gozar,
успехи средненькие. У Ember есть своя утилита для сборки по названием ember-cli, которая помогает собирать приложение написанное на Ember используя ES6. При всей своей мощи(лайврелоад, быстрое создание всего чего только не придумаешь с помошью встроенной команды ember-cli generate {{что-то там}}) ember-cli слишком толст для меня: тянет за собой кучу зависимостей, лагает при лайврелоаде, при генерации какой-нибудь части системы(модель, контроллер и т.д.) автоматом создаёт для неё что-то дополнительное(типа тестов) вместо меня(это мне не по душе), а в жужжании кулера может посоперничать с хромом :) Грусть в том, что в сети я не нашёл никакой альтернативы ember-cli для написания кода в ES6. Может, плохо искал(?) В итоге, сейчас изучаю Ember(используя ES5) и подумываю об альтернативе. Возможно, Angular подойдёт не смотря на отсутствие ES6, он гораздо востребованней Ember, судя по вакансиям.

Gozar 12.06.2015 12:43

Цитата:

Сообщение от Safort
судя по вакансиям

Мне не важно.

Цитата:

Сообщение от Safort
я не нашёл никакой альтернативы ember-cli для написания кода в ES6

https://github.com/babel/ember-cli-babel не оно?


https://babeljs.io/docs/setup/#ember

Safort 12.06.2015 15:27

Gozar,
всё круто, но как его использовать вместе с Gulp? Наверно, я туплю, но всё же с другими инструментами столько проблем не возникало.

Gozar 12.06.2015 16:40

Цитата:

Сообщение от Safort
как его использовать вместе с Gulp?

понятия не имею, а ещё я не имел понятия про cli 2 часа назад, пока не прочел твой коммент.

А ещё я использую cli в phpstorm, а ещё я использую grunt, а ещё у меня было много проблем с разными инструментами. А ещё мне всё больше начинает нравится Ember, хотя бы за то, что он делают магию вместо меня. Тот же react не предлагает магию по умолчанию и мне пришлось самому искать и дописывать eventEmitter под es6. А ещё у ember мне нравится документация в отличии от Angular-а.

Но это пока, дальше будет видно...

nerv_ 12.06.2015 18:45

Цитата:

Сообщение от Gozar
И раз уж nerv смотрит фреймворки, хотя сам сидит на ангуляре, то это подозрительно...

:D

Цитата:

Сообщение от Safort
У Ember

эмбер расширяет прототипы встроенных js объектов

Цитата:

Сообщение от Gozar
А ещё мне всё больше начинает нравится Ember, хотя бы за то, что он делают магию вместо меня. Тот же react не предлагает магию по умолчанию и мне пришлось самому искать и дописывать eventEmitter под es6. А ещё у ember мне нравится документация в отличии от Angular-а.

все-таки понимание начинает приходить :D

nerv_ 12.06.2015 22:08

Тесты производительности фреймворков
 
В качестве испытуемых были выбраны:
  • angular // v1.4.0
  • ractivejs // v0.7.3
  • riotjs // v2.1.0
  • rivetsjs // v0.8.1
  • vuejs // v0.11.10
MVVM фреймворки.

Данные - таблица 5000 элементов https://yadi.sk/i/MvfBu_jahDwro

Проверялось:
1. стартовая отрисовка
2. отрисовка при изменении значения модели (two-way binding) [ввод в поле]
3. отрисовка при удалении записи [remove]
4. отрисовка при удалении произвольных 100 записей [remove random 100]

Тестирование производилось в ручном режиме (на глаз) в браузере Chrome последней версии с использованием секундомера. Время реакции ~ 300мс :)

Использовались только очевидные документированные возможности без хаков и ухищрений.

стартовая отрисовка
  • angular ~ 13.5 (сек)
  • ractivejs ~ 16.5
  • riotjs ~ 16.1
  • rivetsjs < 16
  • vuejs < 16

отрисовка при изменении значения модели
  • angular < 1 (сек) при условии, что размер таблицы не меняется
  • ractivejs ~ 1.1 (сек) при условии, что размер таблицы не меняется
  • riotjs < 1 (сек) при условии, что размер таблицы не меняется
  • rivetsjs < 0.5 (сек) при условии, что размер таблицы не меняется
  • vuejs < 0.5 (сек) при условии, что размер таблицы не меняется

отрисовка при удалении записи
  • angular ~ 3 (сек)
  • ractivejs ~ 3.2
  • riotjs ~ 1.5
  • rivetsjs не удалось протестировать, т.к. не понял как биндить обработчики событий
  • vuejs ~ 1

отрисовка при удалении произвольных 100 записей
  • angular ~ 3 (сек)
  • ractivejs > 1 min, не дождался :)
  • riotjs ~ 1.5
  • rivetsjs не удалось протестировать, т.к. не понял как биндить обработчики событий
  • vuejs ~ 1

Все примеры для тестов написаны лично мной в течении ~ 4ч., находятся здесь

---

Послесловие
Изначально никакого бенчмарка не планировалось. Было любопытно:
1. скорость разработки новичка
2. удобство разработки

По скорости разработки (быстро-долго):
1. vuejs, ractivejs, angular,
2. rivetsjs
3. riotjs
т.к. у фреймворков под п.1,2 много коробочных решений, в т.ч. двусторонний биндинг

По обучаемости (быстро-долго):
1. vuejs, riotjs, ractivejs
2. rivetsjs (дока не очень)
3. angular

Safort 12.06.2015 23:26

Решил забить на Ember и взял Angular. Пока читаю оффдоки, кто-нибудь может дать ссылки на какую-нибудь хорошую инфу? Можно и на английском.

l-liava-l 12.06.2015 23:52

:lol: ноччелось

Gozar 13.06.2015 00:10

Цитата:

Сообщение от Safort
ссылки на какую-нибудь хорошую инфу?

А по Ember есть хорошее видео :)

Safort 13.06.2015 08:01

l-liava-l,
чо-чо?)

Safort 13.06.2015 08:06

Gozar,
да, видео хорошее, но похожих видео полно на ютюбе, из всех объединяют две вещи - отсутствие ES6 и помещение всех шаблонов в один файл.


Пока разбирался с Эмбером, параллельно написал чатик на Ангуляре, лол)

Gozar 16.06.2015 00:40

Цитата:

Сообщение от Safort
Пока разбирался с Эмбером

Хз, что там разбираться, уже пол админки накатал, пару раз видео посмотрел за чаем. До конца недели подниму вместе с плюшками. Ember чем-то похож на backbone, только с блекджеком и магия мне очень сейчас нужна. Сроки уже все вышли. Ориент студио на сервере не взлетела, приходится в срочном порядке писать управление базой. Подниму админку на Имбире, если будет не лень, гляну что там из себя ангуляр.

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

Safort 16.06.2015 21:33

Gozar,
Цитата:

Хз, что там разбираться
Имелось в виду, разбирался не только как писать на нём, но и как писать используя синтаксис ES6 не используя ember-cli.


Цитата:

уже пол админки накатал, пару раз видео посмотрел за чаем.
Судя по отзывам в сети, правильно осилить Эмбер не так просто. У некоторых уходят недели/месяцы.


Цитата:

По поводу es6, зря ты батенька. В FF, да и в Хроме уже многие фичи нативно работают, к тому же магия вполне себе кавайная ^^
Самое главное, сударь, это модули. Модули даже в кэнэри/найтли ещё не начали делать. Я ваще хз, почему разрабы так тормозят с ними(

Gozar 16.06.2015 22:20

Safort,
Забей. Я уже приостановил разработку. Дока запутанная и неадекватная(см. депрекейтед), магия перекрученная, deprecated куда ни плюнь(половина примеров в доке не работает, приходиться лезть в stackowerflow за каждым шаблоном или атрибутом), плагины отладки не работают и опять двадцать пять они лезут в мой сервер...

Я поднял на snakeskin от kobezzza + es6.

Будет потом время может сделаю второй заход или может уже ангуляр 2.0 выйдет.

Safort 16.06.2015 23:00

Gozar,
Цитата:

Я поднял на snakeskin от kobezzza + es6.
Коби сделал не только крутую шаблонку, но и отличную доку к ней)

kobezzza 17.06.2015 10:24

Цитата:

Сообщение от Safort (Сообщение 375337)
Gozar,

Коби сделал не только крутую шаблонку, но и отличную доку к ней)

:)

nerv_ 28.07.2015 20:00

Сравнение Vue.js & React

Рендеринг может больше: Vue.js vs React

nerv_ 26.09.2015 13:50

Сравнение производительности фреймворков, библиотек, шаблонизаторов, натива, канваса для наглядности

join 19.10.2016 15:56

Font Awesome стал платным?
https://fonticons.com

Makarov 20.10.2016 11:56

join,
блин, не пугайте. Это не font awesome, это "fort awesome". Font awesome вот: http://fontawesome.io/

join 20.10.2016 12:04

Makarov,
Спасибо за ссылку. Думал у автора дела совсем туго идут, платными сделал популярные икони.

join 20.10.2016 12:57

Svg enerator of avatars http://svgavatars.com/

Дэйв, создатель "font awesome", достаточно близко к тому ,чтобы стать в ближайшие 30 дней, доллоровым миллионером. ))
https://www.kickstarter.com/projects...font-awesome-5


Часовой пояс GMT +3, время: 16:03.