Úhlové vs React. Nebo je nový Angular opravdu hovno?

Ahoj všichni,

Chci mluvit o nejpopulárnějších rámcích JavaScriptu. Podle mého názoru existuje spousta zbytečných srovnávacích článků. Ačkoli obsahují opravdu zajímavé poznatky, není jich moc využíváno.

Mnoho lidí říká, že je nemůžete porovnat, protože Angular je framework a React je knihovna. Na druhé straně většina reagujících vývojářů (těch, které znám) přidává některé knihovny a mění je v kompletní rámec.

Počkej, možná ještě něco?

Jsem opravdu zvědavý na Angular a vybral bych si ho pro malé a střední aplikace, ale pro ty opravdu velké bych bezpochyby zasekl React. Existuje však mnoho dalších možností. A některým z nich se daří opravdu dobře, například VueJS nebo EmberJs vypadají opravdu dobře. Myslím si však, že hlavní konkurenční výhodou Angular and React je vývojářská komunita. Jediné lib, které dokáže udržet krok s jejich popularitou, je jQuery, ale nepovažujme jQuery za konkurenty těchto dvou.

Začněme tedy. Co je lepší, hranaté nebo reagovat?

Řízení státu

Myslím, že největším rozdílem mezi Angular a React je správa státu. Úhlový je dodáván s vázáním dat, zatímco React obvykle nemůže žít dlouhý život bez Redux, který poskytuje jednosměrný tok dat a práci s neměnnými daty. To přináší mnoho diskusí, což je lepší? Vazba dat nebo neměnná / jednosměrná vazba? Určitě to záleží na mnoha aspektech.

Templating

Myslím, že to opravdu stojí za zmínku, jak snadné Angular pracuje se šablonami. Díky jednoduchému uživatelskému rozhraní pro vaše data vám Angular umožňuje získat požadovaný výsledek s logičtějším přístupem k uživatelskému rozhraní, které vyžaduje méně kódu a zdá se být jasnější.

React vyžaduje funkce pro zpracování reprezentace dat. To znamená, že byste měli definovat způsob, jakým budou vaše data zobrazena, než budou vložena do DOM.

Velikosti a výkon

Jak víme, velikost úhlového souboru je mnohem větší než Reacts.

Úhel 2 + Rx = 766 K
Reakce 0,14,5 + Reakce DOM + Redux = 139 kB

GZipped verze

Úhlová 2 + Rx = 143K
Reakce 0,14,5 + Reakce DOM + Redux = 42 kB

Když ale začnete přidávat do knihovny React mnoho knihoven třetích stran, bude mít velikost svazku také tendenci růst poměrně rychle.

Výkon úhlové 2 může způsobit nějaké problémy, pokud jde o opravdu velké aplikace, protože vytváří strážce pro každou vazbu, aby bylo možné sledovat všechny změny v DOM.

Na druhou stranu, React uvedl do života koncept virtuální DOM. Pokaždé, když se v aplikaci React změní základní data, vytvoří se nové reprezentace uživatelského rozhraní Virtual DOM. Jinými slovy, pokaždé, když uživatel interaguje s webovou stránkou, React vytvoří novou virtuální DOM. Proto je výkon React stabilní, pokud jde o velké množství dat, protože neexistují žádní pozorovatelé.

CLI

Moderní rámce mají tendenci mít nástroj CLI. Angular's CLI se daří docela dobře a šetří spoustu času. Díky Angular-cli a jeho konstrukci je Angular snadno škálovatelný. Na druhou stranu, React má svůj vlastní CLI, který byl zaveden nedávno, se tak moc nepoužívá.

Ladění

Je zajímavé, jak každý z nich zpracovává ladění. Úhel 2 a jeho běhové ladění má sklon poskytovat méně informací než React a je to kompilace časového ladění.

TypeScript a Flow

TypeScript a Flow jsou podobné nástroje, které se zaměřují na stejný problém: nedostatek statických typů JavaScriptu. Nakonec oba existují, aby vám pomohly napsat správný kód. Jak TypeScript, tak Flow poskytují možnosti postupného statického psaní. Také používají podobnou syntaxi pro typové anotace a deklarační soubory.

Pokud pracujete s Angular, možná budete raději TypeScript, protože je to dominantní jazyk používaný v Angular komunitě. Pokud používáte React, můžete naopak preferovat Flow, protože se snadno integruje s Babel a další infrastrukturou, kterou již pravděpodobně máte.

Mnoho vývojářů (zejména React) se TypeScript bojí. Není čeho se bát. Je to jen typ ES6 +. ES6 je platný kód TypeScript. To bylo silně ovlivněno Java a .NET, takže pokud vývojář má zázemí v jednom z těchto jazyků, pravděpodobně najde TypeScript snadnější se naučit než prostý JavaScript.

Proces učení

V Angular je více věcí, které se musíme naučit, než v React. Na druhou stranu se musíte hodně naučit o doporučených postupech React, protože existuje mnoho způsobů, jak můžete udělat to samé nebo se pokazit.

Úhlová pověst a jakou úhlovou verzi byste měli použít?

Vím, že s Angularem se zachází s komunitou JavaScript nespravedlivě. Mnoho lidí s tím vyjadřuje nespokojenost. Ve skutečnosti existuje několik důvodů, ale myslím, že Angular 4 vyřešil spoustu problémů. Došlo k obrovskému posunu z původního AngularJS do nového Angular. Výkon a design byly v Angular 2.0 ve srovnání s Angular 1 výrazně vylepšeny (podle mého názoru byste měli používat Angular 1 pouze v případě, že jste odborníkem a máte pevné termíny). Myslím, že je to velmi produktivní rámec, který by mohl být mnohem úspěšnější, kdyby nebylo tolika verzí, tolik změn. Měl jsem šanci změnit Angularovu verzi z kandidáta na vydání 5 na 6 a poté na verzi vydání. To téměř znamenalo přepis celé aplikace. Ale nyní se Angular 4 zdá být opravdu stabilní a spolehlivý.

Závěr

Takže je nový Angular opravdu hovno?

Ne, není.

Zde je můj seznam použití Angular-React.

Pokud máte rádi šablony, použijte Angular.
Pro velké týmy a projekty bude React lepším řešením, protože vám umožní znovu použít komponenty s menším kódem a rychlejším prototypováním.
Pokud nechcete trávit mnoho času nastavením, použijte Angular.
Pro odborníky a nadšence JS bude React snazší zvládnout.
Lepší, pokud vyzkoušíte oba :)