Реагирайте срещу Angular: Защо React е толкова по-популярен?

Angular и React са популярни, когато става въпрос за разработване на уеб приложения. Въпреки това, наскоро популярността на React нарасна повече от Angular.

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

Какво е Angular?

Angular е популярна платформа за уеб разработка можете да използвате за изграждане на динамични уеб приложения или приложения с една страница. За първи път пристигна през 2010 г. като AngularJS и се разви в Angular 2 през 2016 г.

Подобно на много други рамки, Angular използва силно компоненти. Това са по същество HTML елементи за многократна употреба, които можете да създавате. След това можете да импортирате и използвате тези персонализирани елементи на няколко страници в приложението.

Компаниите, които използват Angular, включват Nike, UpWork, Forbes, HBO, Sony и Google. Популярните приложения, създадени с помощта на Angular, включват PayPal, Upwork, Microsoft Office Home и Overleaf. Няколко продукта на Google, включително Google Voice и Gmail, също използват рамката.

Какво е React?

React е библиотека на JavaScript използва се и за разработване на уеб приложения. Подобно на Angular, React също се основава на използването на компоненти.

Всеки компонент управлява състоянието на своите данни и повторно изобразява приложението въз основа на промените в тези състояния. Това прави React много добър за създаване на приложения с динамични, постоянно променящи се данни.

Много компании за социални медии използват React, включително Facebook, Instagram и Skype. Други компании, които са изградили приложения с помощта на React, включват Uber, AirBnB, Netflix и Amazon.

Популярност между React срещу Angular

Както се вижда на Страницата на Github на React, React има 185 000 звезди, 1500+ сътрудници и повече от 9,5 милиона потребители. Страница в Github на Angular показва 80 500 звезди, 1500+ сътрудници и повече от 2,2 милиона потребители.

Според Син, Хуанг и Лай, React е имал 9,2 милиона изтегляния в сравнение с Angular 2 с 2,6 милиона изтегляния към май 2018 г.

Въпреки че и двете платформи имат своите силни страни, тези данни показват, че React е по-популярната от двете. Тези две рамки обработват неща като производителност, структура на приложението или импортиране на модули по различен начин. Такива разлики могат да помогнат да се обясни съответната им популярност.

език

Angular използва комбинация от HTML, CSS и TypeScript. HTML файловете показват елементите на потребителския интерфейс, CSS съдържа стил, а TypeScript съдържа логиката на кода.

React използва JavaScript и CSS. JavaScript файлът може да съдържа кодовата логика, представляваща компонент. Компонентът може също да има съответен CSS файл.

Във файла на JavaScript можете да върнете HTML кода, свързан с този компонент.

Модули и внос

Можете да инсталирате и настроите Angular с помощта на инструмента Angular CLI. Ще трябва също да инсталирате Node.js. По време на този процес можете да конфигурирате приложението да включва маршрутизиране, тип StyleSheet или дори Bootstrap.

Приложението Angular идва с няколко модула от кутията. Въпреки че това прави приложението по-раздуто, това също означава, че предлага повече функции по подразбиране, които не е нужно да инсталирате поотделно.

React също изисква Node.js. Можете да изпълните проста команда в командния ред, за да създадете приложението React.

След това ще трябва ръчно да добавите всички допълнителни модули, от които се нуждаете. Това гарантира, че имате само модулите, от които се нуждаете в приложението, което го кара да бъде по-малко раздуто от Angular.

Крива на обучение

Angular има специфична структура по отношение на използването на TypeScript и неговите собствени Angular функции. Това означава, че ако искате да научите Angular, ще трябва да научите и самия език TypeScript, заедно с рамката Angular.

TypeScript и JavaScript са изключително сходни по своя синтаксис. Въпреки това, Angular има определена структура, която следва във файла TypeScript. Например, той дефинира свой собствен ред на изпълнение на код, като използва своя AfterViewInit или ngOnInit функции.

С React разработчиците, които вече познават JavaScript, могат да влязат направо и да започнат да създават уеб приложения. Кривата на обучение за React включва най-вече разбиране как работи управлението на състоянието.

Скорост и производителност

React зарежда приложение по-бързо в браузъра в сравнение с Angular. Това е така, защото използва виртуална DOM, по-лека реализация, която просто генерира DOM елементи въз основа на компонентите, които пишете.

Мащаб

Според Син, Хуанг и Лай, React е подходящ за малки до средномащабни уеб приложения. Angular обаче може да бъде много мощен, когато става въпрос за по-големи и по-сложни приложения.

Те също така предполагат, че въпреки че Angular е по-сложен за научаване, допълнителните функции, които предоставя, могат да го направят по-подходящ за по-големи търговски проекти. Това може да включва проекти, които изискват от разработчиците да решават трудни бизнес проблеми.

Внедряване на специфичен код

Както Angular, така и Reach имат свои собствени уникални характеристики.

Angular ви предоставя възможността да използвате вградени структурни директиви като напр *ngАко или *ngЗа. Интересен пример за това е, ако трябва да добавите цикъл for вътре в HTML файл, за да създадете div за всеки потребител.

React използва управление на състоянието. Всеки компонент управлява състоянието на данните и повторно изобразява приложението въз основа на промените в тези състояния.

const [елемент, updateItem] = useState([]);

Обвързване на данни

React използва еднопосочно обвързване, което означава, че можете да предавате данни само в една посока (данните или отиват от кодовата логика към HTML елементите или обратно).

Angular използва двупосочно обвързване на данни, което означава, че можете да предавате данни както от HTML файла към файла TypeScript, така и обратно, като използвате една променлива. Това може да бъде много полезно за сложни приложения.

експортен клас AppComponent {
 someValue = "стойност по подразбиране"
}

Едно предупреждение при това е, че кара Angular постоянно да следи за актуализации и в двата файла. Това създава допълнително време за зареждане и изобразяване. Количеството данни, което Angular трябва да провери, се увеличава със сложността на приложението.

Устойчивата популярност на React

Както React, така и Angular са популярни, когато става въпрос за разработване на уеб-базирани решения. И двете имат своите силни страни и специфични функционалности.

Самият Angular може да отнеме повече, за да разбере и да започне. Въпреки това, той може да бъде изключително мощен инструмент, когато става въпрос за уеб разработка.

React изглежда е най-простата и бърза платформа, която можете да използвате, за да започнете да създавате уеб приложения. Това вероятно е основната причина, поради която стои като платформа за разработка с най-много изтегляния и най-висока употреба.

Как да създадете първото си React приложение с JavaScript

Прочетете Следващото

За автора