Использование компонентного подхода это тяжеловесно, медленно, не гибко. Так ли это?
Доклад с фестиваля 404, Самара, 13 октября 2013
Видео: https://www.youtube.com/watch?v=QpZy0WW0Ig4
18. Много вопросов
• Как поступать со сложносоставными
моделями?
• Как разбивать большие view на части?
• Часто не понятно, кто должен отвечать
за функциональность
18
26. «Component-based software engineering
(CBSE) ... is a reuse-based approach
to defining, implementing and composing
loosely coupled independent components
into systems...»
http://en.wikipedia.org/wiki/Software_component
26
35. Недостатки
• Сложные – необъятное API, много
классов, свойств и пр.
• Большой объем (ext-all.js min ~1.5 MB)
• Медленные
• Сложно кастомизировать,
переопределять поведение и стили
• Слишком большие для простых
приложений
35
42. Особенности
• Для отрисовки нужно работать с GDI
и другими системными API
• Управление памятью
• Компилируемые языки и статическая
типизация
• Для упрощения множество классов были
объеденены в единое целое и представлялись
одним компонентом
42
46. Сложности перевода
• Отсутсвие в javascript приватных свойств
(private, protected etc), getters/setters*
→ большое количество свойств и
сложное API
• В javascript используется прототипное
наследование
→ эмуляция классической модели в
ущерб производительности
* стандартизированы только в ES5
46
47. Наследство
• Подходы к построению API, именованию
• Структура компонент
• Большие компоненты
• Стилизация в коде
47
54. Ext.js
• Больше часа, чтобы разобраться
• Примеры не помогают
• Вручную дерево не построить, только
через store или «хитрым» методом,
найденым методом научного тыка
54
55. Google Сlosure
• ~20 минут чтобы разобраться
• Помог пример
• +15 мин чтобы оптимизировать
и уменьшить время вдвое
(можно манипулировать узлами)
55
56. qooxdoo
• Не взлетел Потребовалась "помощь из зала"
• Чтобы сделать приложение надо
использовать инструменты на python (!)
• Примеры в скомпилированом виде
• Примеров мало
56
57. Dojo
• Очень сложно
• Запутанная документация и примеры
• Кое как получилось построить дерево,
но не получилось разобраться как его
менять
57
58. basis.js
• Ну вы понимаете ;)
• Есть примеры
• Документация пишется (готово ~30%)
• Сам интерфейс – большое дерево
• Можно быстро собрать собственное
дерево используя basis.ui.Node
58
59. basis.ui.Node
• listener, состояние, синхронизация,
подписка
• хранение данных, привязка данных
• управление дочерними узлами
• сортировка, группировка
• selection, disabled/enabled
• взаимодействие с шаблоном
59
68. TodoMVC
100 todo
1000 todo
AngularJS
125 ms
1491 ms
Backbone.js
53 ms
523 ms
Knockout
39 ms
489 ms
vanilla
23 ms
1882 ms
jQuery
20 ms
184 ms
basis.js
8 ms
95 ms
68