Интеграция, кривая обучения, размер пакета и многое другое

Моя последняя статья Что мне нравится в Angular как разработчике на React »была принята довольно хорошо.

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

Я устал от технических войн. Я устал от статей, в которых утверждается, что определенная структура была бы лучшим выбором. Больше всего раздражают эти статьи, когда они проводят глупое сравнение. Angular против React. React vs. Vue - и так далее. Я не думаю, что когда-либо будет явный победитель. Причина в том, что все технологии имеют разные сильные стороны - и лучший способ положить конец техническим войнам - это указать на эти сильные стороны.

Поэтому вот что мне нравится в Vue.js - как я надеюсь, непредубежденный разработчик React.js. Повеселись!

1. Начать работу очень просто

React.js, Angular и многие другие фреймворки и библиотеки зависят от интерфейса командной строки для начала работы. Angular даже позволяет вам настроить TypeScript прямо из коробки.

Конечно, вы можете написать React.js без сборщика. Но если вы решите это сделать, вам придется отказаться от JSX. И, честно говоря, писать React без JSX обременительно. Vue отлично подходит для таких сценариев.

Библиотеку можно включить в CDN или загрузить файл самостоятельно - затем импортируйте его в свой HTML, и вы можете начать писать Vue.js - без интерфейса командной строки и сборщика.

Ваше приложение будет выглядеть примерно так:

Конечно, использование Vue таким образом означает избавление от полезных готовых функций, таких как линтинг, TypeScript, минимизация и многое другое - тем не менее, я видел людей, использующих Vue.js подобным образом. В основном при интеграции библиотеки в существующий проект, например, в простое приложение JS и HTML.

Еще один вариант использования, который пришел мне в голову, - это интеграция интерфейсной библиотеки на сайт, который использует внутренние шаблоны.

2. Вероятно, у него самая плоская кривая обучения.

Один из аргументов против Angular в конфликте Angular и React.js заключается в следующем: Angular гораздо сложнее выучить, React.js легче выучить.

Поскольку я разработчик React.js и почти ничего не знаю об Angular, я не хочу судить об этом как таковом. Однако я могу судить следующее: Vue.js имеет более низкий начальный уровень, чем два других.

Неслучайно Vue часто называют лучшим из обоих миров. В то время как Angular кажется намного более строгим, свобода и структура React.js могут быть ошеломляющими и привести к реализации всего остального, кроме лучших практик. Vue кажется сочетанием обеих философий.

Каждый компонент Vue состоит из трех частей:

  • Раздел разметки, где вы можете писать HTML с помощью специального синтаксиса шаблона Vue.
  • Раздел для кода JavaScript, в котором мы определяем наш компонент под капотом. Сюда входят функции, данные, свойства и т. Д.
  • Раздел для стилей, который может быть ограничен только одним компонентом.

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

3. Размер связки

В своей статье «Что мне нравится в Angular» я обратился к одному распространенному заблуждению - мифу о том, что Angular будет полон из коробки. Я создал простое приложение как на Angular, так и на React.js. Затем я сравнил размеры производственного пакета.

React.js был размером 135 КБ, то же приложение Angular 145 КБ - разница только в 10 КБ. Итак, а что насчет Vue?

Опять же, я создаю то же приложение счетчика. Затем я собрал его для производства, и оказалось, что приложение Vue имеет размер 93 КБ. Какая разница!

Теперь перейдем к следующему вопросу, касающемуся производительности.

4. Производительность

На самом деле, я не большой поклонник сравнения производительности фреймворков и библиотек. Почему? Потому что часто метрики совершенно бесполезны для обычных приложений. Тем не менее, мне интересно представить эту точку зрения (и потому, что я знаю, сколько людей прокомментируют, что Vue не обладает высокой производительностью).

Итак, поехали. Вот результаты для Vue, Angular, React и Preact. Я решил включить Preact, потому что это более быстрая альтернатива React и часто лучшая альтернатива обычному React.

Собственно, результаты меня удивили. Я знал, что Vue имеет лучшую производительность, чем React и Angular, но я не ожидал, что разница будет более чем незначительной. Кроме того, меня удивил тот факт, что Vue превосходит Preact.

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

Тем не менее, вы можете увидеть, при каких обстоятельствах на самом деле проявляются различия. Обновление 1 000 строк или создание 10 000 строк - не типичный сценарий в веб-приложении.

5. Отличные готовые инструменты.

Это момент, который меня уже удивил в Angular. Angular поставляется с потрясающим интерфейсом командной строки, который поддерживает вас во всем, что вы хотите делать.

Поскольку я в основном работаю с React, у которого нет такого богатого интерфейса командной строки, я был очень доволен Vue CLI - он напоминает мне тот, который управляет Angular.

С официальным интерфейсом командной строки Vue мы можем делать все:

  • Добавление таких инструментов, как eslint, vuex или даже apollo.
  • Мы можем добавлять сторонние компоненты из NPM.
  • Мы можем запустить UI-версию интерфейса командной строки, которая также дает нам доступ к прекрасному анализатору веб-пакетов.
  • Обновите проекты до новой версии Vue.

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

Я слышал о Vue.js: в качестве комментария к статье об Angular я получил отзыв о том, что Vue CLI так же хорош, как и интерфейс Angular. Попробовав оба варианта, я могу согласиться.

Спасибо за чтение!

Подробнее о технических войнах:





Больше контента на plainenglish.io