коли мені сказали вибрати між ангуляром і реактом - я вибрав Vue.js і продовжую писати на vanilla.js

Реакт не фреймвокр, це просто вюха.

По-перше, з точки зору архітектури, краще порівнювати React з  Angular v2+, але не з першою версією. Хоча старт може й легший у AngularJS, але Angular v2+ таки значно-значно кращий у багатьох інших аспектах. Раджу не витрачати час на вивчення першої версії, якщо ви ще її не знаєте.

По-друге, з тих багатьох порівнянь, які я встиг почитати, виходить що React - це щось середнє між jQuery й Angula v2+, з усіма вихідними наслідками. Angular, на відміну від React, надає комплексне рішення.

Не зважаючи на простіший старт з React, в подальшому вам прийдеться вивчати й ряд інших бібліотек, без яких React є неповноцінним рішенням. Так, в Angular важчій старт, через необхідність вивчати ще й TypeScript, але повірте мені - тому, хто спочатку "боявся" вчити TypeScript - воно того варте, причому не лише стосовно Angular, й навіть не лише стосовно фронтенда.

Краще розповісти за офіційну документацію у мене навряд чи вийде, тому ось вам докладне порівняння.

Вам подавай "Мед та ще й ложку".

https://trends.google.com/trends/explor … ular,react

Графік на користь реакту, якщо дивитися на останній рік

Цей сервіс не відрізняє AngularJS від Angular, тобто першу від другої+ версії.

Значно більш показовий аргумент - кількість вакансій:
JavaScript - 595 вакансій
AngularJS - 261 вакансій
ReactJS - 153 вакансії
Angular 2 - 28 вакансій.

Звичайно ж, це лише поточна картина, яку ще потрібно інтерпретувати для конкретної метрики.

Можна сказати, що AngularJS на даний момент найпопулярніший фронтенд-фреймворк, як мінімум, серед роботодавців. Майже у половині вакансій, де потрібен JavaScript, хочуть щоб кандидат мав навички роботи з AngularJS.

Ось тут би було б цікаво глянути динаміку популярності. Можу лише сказати, що буквально пів року назад Angular 2 згадувався десь у 3 актуальних вакансіях, зараз - у 28. І це при тому, що AngularJS стабільно тримається біля 250-300 вакансій.

Стосовно конкретики власного досвіду використання, то потрібна конкретика у питаннях, що саме вас цікавить.

Дуже відчутний плюс - відпала потреба "ворожіння" над $scope, бо тепер такої змінної і такого поняття немає. Є компонент або директива, і є клас, що відповідає за його роботу. У цьому класі усі публічні члени доступні у шаблоні.

Наприклад, я використовую наступний компонент для показу повідомлень:

import { Component, Input, OnChanges } from '@angular/core';

@Component({
  selector: 'cst-msg',
  templateUrl: './msg.component.html',
  styleUrls: ['./msg.component.css']
})
export class MsgComponent implements OnChanges
{
  @Input() msg: string[];
  printMsg: string[] = [];

  constructor(){}

  ngOnChanges()
  {
    if(this.msg && this.msg[0])
    {
      this.printMsg = this.msg;
    }
    else if(this.msg && !Array.isArray(this.msg))
    {
      console.warn(`Для компонента 'cst-msg', повідомлення повинні бути в масиві`)
    }
    else
    {
      this.printMsg = [];
    }
  }
}

Ми тут бачимо що є selector: 'cst-msg', він говорить Angular, що за усі елементи <cst-msg></cst-msg>, у батьківському HTML-шаблоні, відповідальний даний клас.

Також ми тут бачимо @Input() msg, де Input - це декоратор, який говорить Angular що змінна msg у цьому компоненті прийде ззовні, тобто в батьківському HTML-шаблоні очікується ось такий запис:

<cst-msg [msg]="message"></cst-msg>

Батьківський компонент передасть дочірньому компоненту змінну message у змінну msg. Усі такі конструкції у HTML-шаблоні заміняться на наступний шаблон:

<ul *ngIf="printMsg[0]">
  <li *ngFor="let m of printMsg; let i = index" class="animate-repeat msg-warning">
    {{ m }}
    <i
      title="Закрити"
      (click)="printMsg.splice(i, 1)"
      class="fa fa-close msg-close msg"></i>
  </li>
</ul>

Очевидно, що DOU має меншу вибірку вакансій, а значить - і меншу точність.

vue.js всіх взуває Хоча це ще треба вміти рівноцінні тренди вибрати.

Бо мені Google каже що з angular часто шукають momentum