Что лучше Aurelia, ReactJs, VueJs или frontend для Музея Юмора

Решил написать frontend для "Музея Юмора". Так как я в основном занимаюсь backend инфраструктурами, а выбор фреймворков для frontend в настоящее время просто огромен, встал вопрос выбора. Что лучше? Как выбрать? Эти и другие вопросы решаем в этой статье.

Задача

Главная задача - сделать анализ проделанной работы. Работы по созданию трех frontend'ов для Музея Юмора, которые были созданы на базе трех разных фреймворков: Aurelia, React.js и Vue.js. Один из них (на Aurelia) можно посмотреть.

Материал для ознакомления

Для написания frontend я использовал API для сайта Музей Юмора, который был продемонстрирован на видео. Видео работы с каждым из фреймворков также можно найти на моём YouTube-канале:

Пример реализации frontend на Aurelia:

Aurelia: Frontend для Музея Юмора 1
Aurelia: Frontend для Музея Юмора 2
Aurelia: Frontend для Музея Юмора 3

Пример реализации frontend на React.js:

React: Frontend для Музея Юмора 1
React: Frontend для Музея Юмора 2
React: Frontend для Музея Юмора 3

Пример реализации frontend на Vue.js:

Vuejs: Frontend для Музея Юмора 1
Vuejs: Frontend для Музея Юмора 2
Vuejs: Frontend для Музея Юмора 3

Сравнение

Не хочу "топить" за один фреймворк, понося при этом другие. Поэтому только факты и примеры. Так как я написал один и тот же функционал на трех фреймворках, у меня есть аргументы, которые я сведу в одну таблицу:

Наименование	React JS	Vue JS	Aurelia
Документация на сайте (описание API, примеры, форум и прочие материлы)	да	да	да
Command Line Interface (CLI)	да	да	да
Поддержка различных упаковщиков модулей (Webpack, SystemJS, CommonJS, RequireJS)	да	да	да
Поддержка компиляторов в современный стандарт (например, babel.js)	да	да	да
Полноценный фреймворк для создания Single Page Application (SPA)	нет	да	да
Простота реализация MVVM подхода	нет	нет	да
Поддержка TypeScript "из коробки"	нет	нет	да

Комментарии

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

► Документация на сайте (описание API, примеры, форум и прочие материлы)

Все фреймворки должным образом описаны на официальных сайтах. Есть полный набор описания для API, примеров, GetStarted и хорошая поддрержка обратной связи. Отвечают быстро и по делу (во всяком случае мне).

► Command Line Interface (CLI)

Тут нет никаких нареканий, все фреймворки работают из CLI. Может быть есть некоторые отличия, но они не существенны.

► Поддержка различных упаковщиков модулей (Webpack, SystemJS, CommonJS, RequireJS)

Можно в процессе разработки использовать любой из упаковщиков Webpack, SystemJS, CommonJS, RequireJS. Есть некоторые нюансы для Vue и React, но если изловчиться и почитать форумы, то проблема можно быстро решить. В Aurelia проблем не замечено.

► Поддержка компиляторов в современный стандарт (babel.js)

Я люблю типизацию, мне нравится предугадывать сообщения компилятора, которые он показывает, если есть вероятность ошибки в типах. Самым удачной поддержкой typescript на мой взгляд является поддержка в Aurelia. Возможно, это связано с тем, что сам фреймворк был изначально написан на новых стандартах (ES2015).

Поддержка в VueJS и ReactJS компилятора TypeScript тоже существует, но мне показалось, что поддержка "притянута за уши". Другими словами, проще писать код без использования TypeScript в этих фреймворках.

► Полноценный фреймворк для создания Single Page Application (SPA)

Нет комментария по этому поводу. Всё понятно итак, если вам нужен, например router, то в React его можно подключить как сторониий компонент. Полноценный фреймворк обычно включает в себя уже весь набор обязательных для Single Page Application реализаций. Почему? Потому что более полная интеграции и значит... Если для вас это ничего не значит - вперед на React.

► Простота реализация MVVM подхода

Aurelia в самом своем начале была ориентирована исключительно на новые стандарты (ES2015) и жесткие правила реализации. Речь идет о Conventions Over Configuratiion. Это очень важный паттерн как для фреймворка, так и различных подходов реализации (коммандная разработка и в том числе управления командами разработчиков). Другими словами, MVVM в Aurelia "со сранья", то есть на основе этого паттерна и была основана реализация фреймворка.

►Поддержка TypeScript "из коробки"

Друзья, я приверженец управляемог кода, а полноту процесса управления кодом гарантируют только типизированные языки, а если нет разницы на backend или на frontend писать управляемый код (а значит очень похожие компоненты, модели, реализации), то зачем "платить больше"? Для меня типизация имеет значение, поэтому я выбираю TypeScript. Ну, и наверное, вы догадались уже какой фреймворк я выбрал?

Выводы

Мне показалось, что ReactJS является продвинутой версией jQuery. Во-первых, потому что это не фреймворк, а сборка (library). Вот что сам Facebook говорит про своё творение:

A JavaScript library for building user interfaces

Другими словами, это не полноценный фреймворк, который предназначен для создания Single Page Application (SPA), а сборка для создания пользовательских интерфейсов. Конечно, существуют реализации на основе ReactJS в купе с другими библиотеками и фреймворками, с помощью которых существует возможнось создавать SPA. Но в мире разработки кода поняние "из коробки" имеет очень большое значение. Во-вторых, сама парадигдма включает слова User Interface, что не может не говорить о направленности тенденций в развитии библиотеки, и не может не говорить о том, что MVC (да и MVVM тоже) паттерн реализован в библиотеке только наполовину. То есть, буква "М" отсутствует. Вот более подробное объяснение, я с ним согласен на 100%.

Далее по возрастанию идет VueJS (по возрастанию моего интересна к фреймворку). Надо сказать, что сама парадигма, очень похоже на ReactJS. Мне вообще показалось, что VueJS - это следующая версия ReactJS, хотя конечно же это не так. Самодостаточный VueJS имеет все возможности для реализации любых приложений. Единственное, что в нем не понравилось, так это то что TypeScript не поддерживается "из коробки". А те реализации, которые мне довелось посмотреть в интернете, не решают или решают не до конца реализацию либо MVVM, либо TypeScript поверх MVVM.

Меня, как любителя типизации, не оставила равнодушным Aurelia. Но это мой, сугубо личный выбор, вам предлагаю сделать свой выбор самостоятельно.

Angular

Специально не стал использовать Angular. Был у меня опыт использования этого фреймворка. Скажу одним словом - "нет". Сама концепция реализованная в Angular предполагает использование антипаттерна "singleton". От версии Angular принцип не изменился. Сначала был scope (паттерн Ambient Context, что по сути singleton), а потом в 2+ версиях  появились декораторы, через которые в "выносился в разметку" тот же самый scope. В общем, "нет", потому что я не считаю, что Angular является фреймворком, который следует изучать. Но на вкус и цвет все фломастеры - разные или как в том анекдоте: "жила-была девочка, так ей и надо". :)

Заключение

Не смотря на то, что я во основном работаю на стороне backend (светлая сторона силы), по долгу службы мне положено знать как "работает" и frontend (темная сторона силы).  При наличии знаний основополагающих законов разработки программного обеспечения (это я так высокопарно о паттернах и принципах) не имеет значение на каком из фреймворков вы будете писать код. По большому счету, это не имеет никакого значения. С другой стороны, фреймворки бывают разные, кому-то нравится одни, кому-то другие. Кто-то может осилить только один, и на остальные не посмотрит. А бывают и такие, которые выбирают фремворки и библиотеки в зависимости от задач, которые надо решить.

P.S.

Про силу: Светлая - потому что есть типизация. Темная - потому что нет типизации.