Reager vs. Angular: Hvorfor er React så meget mere populær?

Angular og React er begge populære, når det kommer til udvikling af webapplikationer. Reacts popularitet er dog steget mere end Angulars for nylig.

Lad os tage et kig på ydeevne, hastighed, oppustethed og kodedetaljer for hver ramme, og hvordan disse kan have påvirket deres popularitet.

Hvad er Angular?

Angular er en populær webudviklingsplatform du kan bruge til at bygge dynamiske webapplikationer eller enkeltsidede applikationer. Den ankom først i 2010 som AngularJS og udviklede sig til Angular 2 i 2016.

Som mange andre rammer gør Angular stor brug af komponenter. Disse er i det væsentlige genbrugelige HTML-elementer, som du kan oprette. Du kan derefter importere og bruge disse brugerdefinerede elementer på flere sider i din app.

Virksomheder, der bruger Angular, omfatter Nike, UpWork, Forbes, HBO, Sony og Google. Populære apps bygget ved hjælp af Angular inkluderer PayPal, Upwork, Microsoft Office Home og Overleaf. Adskillige Google-produkter, herunder Google Voice og Gmail, bruger også rammen.

Hvad er React?

React er et JavaScript-bibliotek bruges også til udvikling af webapplikationer. Ligesom Angular er React også baseret på brugen af ​​komponenter.

Hver komponent administrerer tilstanden af ​​sine data og gengiver appen baseret på ændringer i disse tilstande. Dette gør React meget god til at skabe apps med dynamiske, konstant skiftende data.

Mange sociale medievirksomheder bruger React, herunder Facebook, Instagram og Skype. Andre virksomheder, der har bygget apps ved hjælp af React, inkluderer Uber, AirBnB, Netflix og Amazon.

Popularitet mellem React vs Angular

Som set på Reacts Github-side, React har 185.000 stjerner, 1.500+ bidragydere og mere end 9,5 millioner brugere. Angulars Github-side viser 80.500 stjerner, 1500+ bidragydere og mere end 2,2 millioner brugere.

Ifølge Xing, Huang og Lai, React har haft 9,2 millioner downloads sammenlignet med Angular 2 med 2,6 millioner downloads i maj 2018.

Selvom begge platforme har deres styrker, viser disse data, at React er den mest populære af de to. Disse to rammer håndterer ting som ydeevne, appstruktur eller modulimport forskelligt. Sådanne forskelle kan hjælpe med at forklare deres respektive popularitet.

Sprog

Angular bruger en kombination af HTML, CSS og TypeScript. HTML-filerne viser UI-elementerne, CSS'en indeholder styling, og TypeScript'et indeholder kodelogikken.

React bruger JavaScript og CSS. En JavaScript-fil kan indeholde kodelogikken, der repræsenterer en komponent. Komponenten kan også have en tilsvarende CSS-fil.

I JavaScript-filen kan du returnere den HTML-kode, der er knyttet til den pågældende komponent.

Moduler og import

Du kan installere og opsætte Angular ved hjælp af Angular CLI-værktøjet. Du skal også installere Node.js. Under denne proces kan du konfigurere appen til at inkludere routing, en StyleSheet-type eller endda Bootstrap.

Angular-appen kommer med flere moduler ud af æsken. Selvom dette gør appen mere oppustet, betyder det også, at den tilbyder flere standardfunktioner, som du ikke behøver at installere individuelt.

React kræver også Node.js. Du kan køre en simpel kommando på kommandolinjen for at oprette React-appen.

Derefter skal du manuelt tilføje eventuelle ekstra moduler, du har brug for. Dette sikrer, at du kun har de moduler, du har brug for, i appen, hvilket får den til at være mindre oppustet end Angular.

Indlæringskurve

Angular har en specifik struktur i forhold til at bruge TypeScript og dets egne Angular funktioner. Dette betyder, at hvis du vil lære Angular, skal du også lære selve TypeScript-sproget sammen med Angular-rammen.

TypeScript og JavaScript er ekstremt ens i deres syntaks. Angular har dog en særlig struktur, som den følger i TypeScript-filen. For eksempel definerer den sin egen rækkefølge for kodeudførelse ved hjælp af dens AfterViewInit eller ngOnInit funktioner.

Med React kan udviklere, der allerede kender JavaScript, springe direkte ind og begynde at bygge webapplikationer. Læringskurven for React omfatter for det meste forståelse af, hvordan statsstyring fungerer.

Hastighed og ydeevne

React indlæser en app hurtigere i browseren sammenlignet med Angular. Dette skyldes, at den bruger en virtuel DOM, en mere let implementering, der bare genererer DOM-elementer baseret på de komponenter, du skriver.

vægt

Ifølge Xing, Huang og Lai, React er velegnet til små til mellemstore webapplikationer. Angular kan dog være meget kraftfuld, når det kommer til større, mere komplekse applikationer.

De foreslår også, at selvom Angular er mere kompleks at lære, kan de ekstra funktioner, det giver, gøre det mere velegnet til større kommercielle projekter. Dette kan omfatte projekter, der kræver, at udviklerne løser vanskelige forretningsproblemer.

Implementering af specifik kode

Både Angular og Reach har deres egne unikke funktioner.

Angular giver dig mulighed for at bruge indbyggede strukturelle direktiver som f.eks *ngHvis eller *ngFor. Et interessant eksempel på dette er, hvis du havde brug for at tilføje en for-løkke i en HTML-fil for at oprette en div for hver bruger.

React bruger statsstyring. Hver komponent administrerer dataenes tilstand og gengiver appen baseret på ændringer i disse tilstande.

const [item, updateItem] = useState([]);

Databinding

React bruger envejsbinding, hvilket betyder, at du kun kan sende data i én retning (data går enten fra kodelogikken til HTML-elementerne eller omvendt).

Angular bruger to-vejs databinding, hvilket betyder, at du kan overføre data både fra HTML-filen til TypeScript-filen og omvendt ved hjælp af en enkelt variabel. Dette kan være meget nyttigt for komplekse apps.

eksport klasse AppComponent {
 someValue = "defaultValue"
}

En advarsel med dette er, at det får Angular til konstant at se efter opdateringer i begge filer. Dette skaber yderligere indlæsnings- og gengivelsestider. Mængden af ​​data, som Angular skal kontrollere, stiger med kompleksiteten af ​​applikationen.

Reacts vedvarende popularitet

Både React og Angular er populære, når det kommer til udvikling af webbaserede løsninger. Begge har deres styrker og specifikke funktionaliteter.

Angular selv kan tage mere at forstå og komme i gang. Det kan dog være et ekstremt stærkt værktøj, når det kommer til webudvikling.

React ser ud til at være den enkleste og hurtigste platform, du kan bruge til at komme i gang med at bygge webapplikationer. Dette er sandsynligvis hovedårsagen til, at den står som den udviklingsplatform med flest downloads og højeste forbrug.

Sådan opretter du din første React-app med JavaScript

Læs Næste

Om forfatteren