Základní Rundown of React vs Vue

Čas letí ve Flatiron School. Právě jsme zabalili 10. týden učením React Framework. React se skládá z JavaScriptu a JSX (kombinace vanilského JavaScriptu a specifické syntaxe, která vypadá podobně jako HTML). JSX je krok preprocesoru, který přidává syntaxi XML do JavaScriptu. Určitě můžete použít React bez JSX, ale JSX dělá React mnohem elegantnějším. Pomocí úryvků JSX můžete vytvářet komponenty, které se stanou stavebními kameny webové aplikace. Doposud se mi to líbí, ale byl jsem zvědavý na výhody a nevýhody jiných rámců, zejména Vue.

S React, když komponenta změní svůj stav, spustí opětovné vykreslení celého stromu komponenty. Chcete-li se vypořádat s těmito opětovným vykreslováním, můžete použít shouldComponentUpdate nebo React.PureComponent. Pokud místo React.Component použijete React.PureComponent, implementuje shouldComponentUpdate automaticky.

V React by metoda shouldComponentUpdate měla být použita pouze jako optimalizace výkonu. Použili byste metodu shouldComponentUpdate, abyste informovali React, pokud výstup komponenty není ovlivněn aktuální změnou stavu nebo rekvizit.

Ve Vue systém Vue ví, které komponenty je třeba při změně stavu znovu vykreslit. Tím se odstraní zbytečné opětovné vykreslení komponenty.

Nejzjevnější rozdíly mezi React a Vue jsou se syntaxí

Jak bylo uvedeno výše, React se skládá z JavaScriptu a (volitelně) JSX za účelem vytvoření komponent, které se stanou stavebními bloky aplikace. Vue může také používat funkce vykreslování a podporovat JSX, ale také nabízí výchozí šablony. Platné HTML funguje jako šablona ve Vue. To umožňuje i začátečníkům pracovat s kódem a přidávat jej, protože je přirozenější číst a psát. Komponenty ve Vue lze označit jako prezentační nebo logické. Doporučujeme používat šablony pro prezentační komponenty a funkce vykreslování s JSX pro logické komponenty.

Styl CSS v React se většinou provádí jako CSS v JS. Výchozí metoda stylingu ve Vue je jako tagy stylů v komponentách s jedním souborem. Stylingový kód v komponentách s jedním souborem je ve stejném souboru jako kód komponenty.

React a Vue mají také některé podobnosti

Pro větší aplikace nabízejí React a Vue dobrá řešení. Redux lze použít s React pro správu stavu a reakci na akce jeho uživatelů. Vue může také použít Redux, ale existuje něco, co se nazývá Vuex, což je další specifičtější systém správy státu specificky pro Vue. Další podobností mezi React a Vue je jejich běhový výkon. Jsou velmi podobné, takže zde není výhoda ani nevýhoda.

Je React nebo Vue populárnější?

Knihovny Vue pro státní správu jsou aktualizovány základní knihovnou, zatímco React používá svou komunitu, aby se o to postarala. React je však populárnější, takže je schopen držet krok s obavami. Podle průzkumu StackOverflow je React 3. nejoblíbenější knihovnou mezi vývojáři. Podle LinkedIn jsou vývojáři React více žádáni než Vue s poměrem 5: 1.

Pokud chcete spustit projekt React nebo Vue, máte štěstí!

Vue i React nabízejí projektové předkrmy. React's je create-rea-app, zatímco Vue má generátor CLI. Jednou z nevýhod startéru projektu React je to, že nabízí pouze jednu šablonu za předpokladu, že děláte SPA (jednostránková aplikace), zatímco Vue nabízí větší rozmanitost.

Podle mého názoru má React strmější křivku učení než Vue. S aplikací Vue stačí zadat jednu značku skriptu, abyste mohli začít vytvářet malé aplikace. Abyste mohli začít, musíte s Reactem znát JavaScript (ES2015 +) a JSX.

Stejně jako u jakéhokoli rámce používejte to, co pro vás má největší smysl (nebo co vaše společnost používá!) Oba mají klady a zápory a existuje mnoho dalších rámců jako Angular nebo AngularJS.

Který front-end nástroj dáváte přednost vaší práci v těchto dnech? Šťastný kódování!

Prameny: