Angular vs React vs Vue: Který rámec si vybrat v roce 2020

Tento příspěvek je komplexní průvodce, který je pro vás možná tím správným řešením: Angular vs React vs Vue.


Jen před pár lety vývojáři hlavně diskutovali o tom, zda by měli pro své projekty používat Angular vs React. V průběhu posledních několika let jsme však zaznamenali nárůst zájmu o třetího hráče jménem Vue.js.

Pokud jste vývojář začínající na projektu a nemůžete se rozhodnout, který rámec JavaScriptu použít, tato příručka by vám měla pomoci při rozhodování.

Pokrýváme různé aspekty Angular, Vue a React, abychom viděli, jak vyhovují vašim potřebám. Tento příspěvek není pouze vodítkem pro Angular vs React vs Vue, ale jeho cílem je poskytnout strukturu, která pomůže posoudit front-end JavaScript rámce obecně. Pokud příští rok dorazí nový rámec, budete přesně vědět, na jaké parametry se podívat!

* V tomto příspěvku předpokládáme, že máte základní znalosti JavaScriptu a také jste použili JavaScriptové rámce.

Angular vs React vs Vue

Začněme:

Část 1: Stručná historie Vue vs React vs Angular

Než se dostaneme k technickým detailům, pojďme nejprve hovořit o historii těchto rámců – abychom lépe ocenili jejich filozofii a jejich vývoj v průběhu času.

Jak to všechno začalo ��

úhlové logo

Úhlové, vyvinutý společností Google, byl poprvé uveden na trh v roce 2010, což z něj činí nejstarší ze série. Je to rámec JavaScriptu založený na TypeScript. V roce 2016 došlo k podstatnému posunu v souvislosti s uvolněním Angular 2 (a pádem "JS" od původního jména – AngularJS). Úhlová 2+ je známá jako úhlová. Přestože AngularJS (verze 1) stále získává aktualizace, soustředíme diskusi na Angular. Poslední stabilní verze je Angular 9, která byla vydána v únoru 2020.

logo vue

Vue, také známý jako Vue.js, je nejmladší člen skupiny. Byla vyvinuta bývalým zaměstnancem Google Evanem You v roce 2014. Během posledních tří let zaznamenala Vue značný posun v popularitě, i když nemá podporu velké společnosti. Aktuální stabilní verze je 2.6, vydaná v únoru 2019 (od té doby byla vydána malá přírůstková vydání). Přispěvatelé Vue jsou podporován Patreonem. Vue 3, v současné době ve fázi alfa, plánuje přejděte na TypeScript.

reagovat logo

Reagovat, vyvinutý společností Facebook, byl původně uveden na trh v roce 2013. Facebook používá ve svých produktech značně React (Facebook, Instagram a WhatsApp). Aktuální stabilní verze je 16.X, vydaná v listopadu 2018 (od té doby s menšími přírůstkovými aktualizacemi).

Zde je stručné shrnutí Angular vs React vs Vue z hlediska jejich stavu a historie:

Historie Angular vs React vs Vue

Úhlové
Reagovat
Vue

První vydání201020132014
Oficiální stránkaangular.ioReagovatvuejs.org
Cca. velikost (KB)50010080
Současná verze916.x2.6.x
PoužíváGoogle, WixFacebook, UberAlibaba, GitLab

Licence ��‍♂️

Před použitím open source framework se ujistěte, že projdete jeho licencí. Je zajímavé, že všechny tři rámce používají Licence MIT, což poskytuje omezená omezení opětovného použití, a to i v proprietárním softwaru. Než začnete používat jakýkoli rámec nebo software, nezapomeňte znát důsledky licence.

Tady je stručné shrnutí licence MIT jednoduše anglicky.

Oblíbenost ��

Tak jako "úhlové" a "reagovat" jsou běžná slova, je obtížné pochopit jejich popularitu v Google Trends. Ačkoli, dobrý proxy pro jejich popularitu je počet hvězd, které získají jejich repozitáře GitHub. V polovině roku 2016 došlo k náhlému posunu v počtu hvězd Vue a v poslední době tam byla Vue s Reactem mezi nejoblíbenějšími rámci.

Hvězdy na projektech GitHub pro Angular vs React vs VuePočet hvězd na projektech GitHub pro Angular, React a Vue

Podívejme se, jak je trh práce pro Angular vs React vs Vue, což je také dobrá míra popularity:

Trh práce Angular vs React vs Vue ��‍♂️

Nejlepší zdroje dat které naznačují trendy na trhu práce, jsou různé pracovní desky.

Jak je patrné z trendů z konce roku 2018, počet pracovních míst, které vyžadují soubor dovedností Angular nebo React, je zhruba stejný, zatímco u Vue byl stále jen zlomek tohoto počtu (asi 20%). Tento seznam rozhodně není vyčerpávající, ale poskytuje dobrý obrázek o celkovém technologickém průmyslu.

Pokud hledáte přísně z pohledu současného trhu práce, nejlepší je naučit se Angular nebo React. Avšak vzhledem k tomu, že společnost Vue získala v posledních třech letech popularitu, může nějakou dobu trvat, než projekty použijí Vue, nebo nové projekty, které adoptují Vue, aby dosáhly úrovně zralosti, která přikazuje většímu počtu vývojářů..

Část 2: Společenství a rozvoj

Nyní, když znáte historii a trendy každého z těchto rámců, podíváme se na komunitu, abychom zhodnotili vývoj těchto rámců. Už jsme viděli, že pro všechny rámce byly v uplynulém roce pravidelně dodávány přírůstková vydání, což naznačuje, že vývoj probíhá v plném proudu.

Podívejme se na Angular vs React vs Vue s ohledem na statistiku jejich úložišť GitHub:

Úhlové
Reagovat
Vue

# Strážci3,2k6,6 k6,0 k
# Hvězdy57k144k157k
# Vidličky15,9k27,6 tis23,7 tis
# Přispěvatelé1,0891,361289

Vue má obrovské množství pozorovatelů, hvězd a vidliček. To ukazuje jeho popularitu mezi uživateli a její hodnotu při porovnání Vue vs React. Počet přispěvatelů pro Vue je však nižší než Angular and React.

Jedním z možných vysvětlení je to Vue je řízena výhradně komunitou s otevřeným zdrojovým kódem, zatímco Angular and React mají významný podíl zaměstnanců Google a Facebooku přispívajících do repozitářů.

Ze statistik vykazují všechny tři projekty významnou rozvojovou aktivitu, a to jistě bude pokračovat i v budoucnu – právě tyto statistiky nemohou být základem pro rozhodnutí, že se žádný z nich nebude používat..

Část 3: Migrace

Když pracujete s vybraným rámcem, nemusíte si dělat starosti s aktualizací rámce, která bude přicházet a zkazovat váš kód. Přestože se ve většině případů nesetkáte s mnoha problémy z jedné verze na druhou, je důležité držet prst na pulsu, protože některé aktualizace mohou být významnější a vyžadují vylepšení, aby byly věci kompatibilní.

Úhlové plánuje hlavní aktualizace každých šest měsíců. Existuje také období dalších šesti měsíců, než dojde k zastarání hlavních API, což vám dává čas dvou cyklů uvolnění (jeden rok), abyste mohli provést případné nezbytné změny.

Pokud jde o Angular vs React, Facebook to uvedl stabilita je nanejvýš důležitá pro ně, protože obrovské společnosti jako Twitter a Airbnb používají React. Upgrady prostřednictvím verzí jsou obvykle nejjednodušší v React, se skripty jako reakční kodemod pomáhá vám migrovat.

Vue o migraci v FAQ často zmiňuje Vue 90% rozhraní API je stejné, pokud migrujete z 1.x na 2. Tady je pomocný migrační nástroj který pracuje na konzole a hodnotí stav vaší aplikace.

Část 4: Práce s Vue vs Angular vs React

Zde je několik důležitých charakteristik, jejichž hlavní náplní je celková velikost a doba načítání, dostupné komponenty a křivka učení.

Velikost a doba načítání ⏲️

Velikost knihoven je následující:

  • Úhel 4+: Závisí na velikosti vytvořeného svazku
  • Reakce: 116 KB
  • Vue: 91 KB

Přestože existuje významný rozdíl mezi velikostmi rámců, ve srovnání s průměrnou velikostí webové stránky jsou stále malé (2+ MB v roce 2018). Pokud navíc k načtení těchto knihoven používáte populární CDN, je vysoce pravděpodobné, že uživatel má knihovnu již načten v místním systému.

Komponenty ��️

Komponenty jsou nedílnou součástí všech tří rámců, ať už mluvíme Vue, React nebo Angular. Komponenta obvykle získá vstup a na základě toho mění chování. Tato změna chování se obvykle projeví jako změna uživatelského rozhraní některé části stránky. Použití součástí usnadňuje opětovné použití kódu. Komponentou může být košík na webu elektronického obchodování nebo přihlašovací pole na sociální síti.

Úhlové Úhlové:
V Angular jsou komponenty označovány jako směrnice. Směrnice jsou pouze značky na prvcích DOM, které Angular může sledovat a připojit také specifické chování. Proto Angular odděluje UI část komponent jako atributy značek HTML a jejich chování ve formě kódu JavaScript. To je to, co ho odlišuje, když se díváme na Angular vs React.
Reagovat Reagovat:
Zajímavé je, že reaguje na uživatelské rozhraní a chování komponent. Například zde je kód pro vytvoření komponenty hello world v React. V React je stejná část kódu zodpovědná za vytvoření prvku uživatelského rozhraní a za diktování jeho chování.
Vue Vue:
Ve Vue jsou UI a chování také součástí komponent, což činí věci intuitivnějšími při pohledu na Vue vs React. Vue je také vysoce přizpůsobitelný, což vám umožňuje kombinovat uživatelské rozhraní a chování komponentů ze skriptu. Dále můžete také používat předprocesory ve Vue spíše než CSS, což je skvělá funkce. Vue je skvělá, pokud jde o integraci s jinými knihovnami, jako je Bootstrap.

Chcete-li porovnat, jak stejná aplikace vypadá s různými knihovnami, je zde skvělý příspěvek Vytváření totéž seznamu aplikací na React and Vue a kontrastující rozdíly obou rámců.

Křivka učení ��

Jak je tedy obtížné naučit se každý z těchto rámců?

Úhlové Úhlové:
Úhlové má strmou křivku učení, vzhledem k tomu, že jde o kompletní řešení, a zvládnutí Angular vyžaduje, abyste se naučili související pojmy, jako je TypeScript a MVC. I když to trvá dlouho, než se naučíme Angular, investice vyplatí dividendy, pokud jde o pochopení toho, jak funguje frontend.
reagovat Reagovat:
React nabízí Začínáme průvodce, který by měl pomoci jednomu nastavit React asi za hodinu. Dokumentace je důkladná a úplná, s řešeními běžných problémů, která již existují v zásobníku Přetečení. React není kompletní rámec a pokročilé funkce vyžadují použití knihoven třetích stran. Díky tomu není křivka učení základní struktury tak strmá, ale závisí na cestě, kterou si vyberete s dodatečnými funkcemi. Naučit se používat React však nutně neznamená, že používáte osvědčené postupy.
vue Vue:
Vue poskytuje vyšší přizpůsobitelnost, a proto se snáze učí než Angular nebo React. Dále se Vue překrývá s Angular a React s ohledem na jejich funkčnost, jako je použití komponent. Z tohoto důvodu je přechod na Vue z obou těchto možností snadnou volbou. Jednoduchost a flexibilita Vue je však dvojsečný meč – umožňuje špatný kód, což ztěžuje ladění a testování.

Ačkoli Angular, React a Vue mají významnou křivku učení, jejich použití po zvládnutí je neomezená. Můžete například integrovat Angular and React s WordPress a WooCommerce a vytvářet progresivní webové aplikace.

Angular vs React vs Vue: Kdo vyhraje?

Ke konci tohoto příspěvku si připomeňme charakteristické rysy každého rámce, abychom se pokusili odpovědět na otázku: Angular vs React vs Vue: který z nich byste si měli vybrat?

úhlové logo Úhlové je nejvyspělejší z rámců, má dobrou podporu, pokud jde o přispěvatele, a je úplným balíčkem.

Křivka učení je však strmá a koncepty vývoje v Angular mohou odkládat nové vývojáře.

Angular je dobrou volbou pro společnosti s velkými týmy a vývojáři, kteří již používají TypeScript.

Extra �� Zde jsou některé šablony řídicího panelu Angular admin, které by vás mohly zajímat.

reagovat logo Reagovat je dost starý na to, aby byl zralý, a má obrovské množství příspěvků od komunity. Získal široké přijetí. Trh práce pro React je opravdu dobrý a budoucnost tohoto rámce vypadá jasně.

React vypadá jako dobrá volba pro někoho, kdo začíná s front-end skripty JavaScript, startupy a vývojáře, kteří mají rádi určitou flexibilitu. Schopnost integrace s jinými rámci bezproblémově poskytuje velkou výhodu pro ty, kteří by chtěli určitou flexibilitu v jejich kódu.

logo vue Vue je nejnovější v aréně, bez podpory velké společnosti.

V posledních několika letech se však ukázalo, že je silným konkurentem společnosti Angular and React. Tohle možná hraje roli s mnoha čínskými giganty, jako je Alibaba a Baidu a vybírají Vue jako svůj primární front-end JavaScript framework.

Je však třeba vidět, jak se to v budoucnu děje, a je odůvodněné být opatrný. Vue by měla být vaše volba, pokud dáváte přednost jednoduchosti, ale také jako flexibilita.

Extra �� Zde jsou některé šablony Vue admin vytvořené pomocí Bootstrapu, o které by vás mohl zajímat.

Odpověď na debatu Angular vs React vs Vue je, že neexistuje absolutní správná volba, kterou jste pravděpodobně očekávali.

Každá z těchto knihoven má své výhody a nevýhody. Na základě projektu, na kterém právě pracujete, a podle vašich individuálních požadavků bude jeden z nich vhodnější než ostatní. Před rozhodnutím je vždy klíčové provést vlastní výzkum, zejména pokud se chystáte pracovat na podnikání a ne na osobním projektu..

Jaký rámec si myslíte, že je zde vítězem – Angular vs React vs Vue? Dejte nám vědět v komentářích níže.

Další čtení: ��

  • Šablony návrhů materiálů pro Vue, Angular, React (Material UI)
  • Nejlepší složky / knihovny komponent uživatelského rozhraní s nejlepší reakcí
  • Zajímavé knihovny komponent VU Uue
  • Nejlepší šablony úhlového administrátorského panelu
  • Nejlepší bezplatné zaváděcí šablony pro ReactJS
  • Zdarma Reagovat Nativní šablony
  • Zdarma a prémiové šablony VueJS pro správu vytvořené pomocí zaváděcího systému

Na další poznámku, co takhle používat WordPress? WordPress je dokonale vhodný ke spuštění téměř jakéhokoli webového projektu, který si lze představit, a existuje několik úžasných témat, díky nimž bude váš design vypadat skvěle (mnoho z nich zdarma). Nemluvě o tom, že můžete hostovat web WordPress za levnější.

Nezapomeňte se připojit k našemu havarijnímu kurzu při urychlení vašeho webu WordPress. Pomocí několika jednoduchých oprav můžete zkrátit dobu načítání až o 50–80%:

Rozvržení a prezentace Karol K.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map