Angular vs React vs Vue: Hvilken ramme der skal vælges i 2020

Angular vs React vs Vue: Hvilken ramme der skal vælges i 2020

Angular vs React vs Vue: Hvilken ramme der skal vælges i 2020
СОДЕРЖАНИЕ
02 июня 2020

Dette indlæg er en omfattende guide, som måske er den rigtige løsning for dig: Angular vs React vs Vue.


For bare et par år siden drøftede udviklere hovedsageligt, om de skulle bruge Angular vs React til deres projekter. Men i løbet af de sidste par år så vi en vækst i interessen for en tredje spiller kaldet Vue.js.

Hvis du er en udvikler, der starter med et projekt og ikke kan beslutte, hvilken JavaScript-ramme du skal bruge, skal denne vejledning hjælpe dig med at tage en beslutning.

Vi dækker forskellige aspekter af Angular, Vue og React for at se, hvordan de passer til dine behov. Dette indlæg er ikke kun en guide til Angular vs React vs Vue, men har til formål at give en struktur, der hjælper med at bedømme JavaScript-frontrammer generelt. Hvis der kommer en ny ramme næste år, ved du nøjagtigt, hvilke parametre du skal se på!

* I dette indlæg antager vi, at du har grundlæggende kendskab til JavaScript og også har brugt JavaScript-rammer.

Angular vs React vs Vue

Lad os komme igang:

Del 1: En kort historie om Vue vs React vs Angular

Før vi går ind på de tekniske detaljer, lad os først tale om historien bag disse rammer – bare for bedre at forstå deres filosofi og deres udvikling over tid.

Hvordan det hele startede ��

kantet logo

Kantet, udviklet af Google, blev første gang frigivet i 2010, hvilket gør det til det ældste af partiet. Det er en TypeScript-baseret JavaScript-ramme. Et betydeligt skift skete i 2016 på frigivelsen af ​​Angular 2 (og droppet af "JS" fra det originale navn – AngularJS). Angular 2+ er kendt som bare Angular. Selvom AngularJS (version 1) stadig får opdateringer, vil vi fokusere diskussionen på Angular. Den seneste stabile version er Angular 9, som blev frigivet i februar 2020.

Vue logo

Vue, også kendt som Vue.js, er det yngste medlem af gruppen. Det blev udviklet af den tidligere Google-medarbejder Evan You i 2014. I de sidste tre år har Vue oplevet et betydeligt skift i popularitet, selvom det ikke har opbakning fra et stort firma. Den aktuelle stabile version er 2.6, der blev frigivet i februar 2019 (med nogle små trinvise udgivelser siden da). Vue’s bidragydere er støttet af Patreon. Vue 3, for tiden i alfafasen, planlægger at Gå til TypeScript.

reager logo

Reagere, udviklet af Facebook, blev oprindeligt frigivet i 2013. Facebook bruger React meget i deres produkter (Facebook, Instagram og WhatsApp). Den aktuelle stabile version er 16.X, der blev udgivet i november 2018 (med mindre trinvise opdateringer siden da).

Her er en kort oversigt over Angular vs React vs Vue med hensyn til deres status og historie:

Historien om Angular vs React vs Vue

Kantet
Reagere
Vue

Første udgivelse201020132014
Officielt webstedangular.ioreactjs.orgvuejs.org
Ca.. størrelse (KB)50010080
Nuværende version916.x2.6.x
Brugt afGoogle, WixFacebook, UberAlibaba, GitLab

Licens ��‍♂️

Inden du bruger en open source-ramme, skal du sørge for at gennemgå dens licens. Interessant nok bruger alle tre rammer MIT-licens, som giver begrænsede begrænsninger for genbrug, selv i proprietær software. Sørg for, at du kender konsekvenserne af licensen, inden du bruger nogen rammer eller software.

Her er en hurtig oversigt over MIT-licensen i almindelige engelske termer.

Popularitet ��

Som "kantet" og "reagere" er almindelige ord, er det vanskeligt at forstå deres popularitet fra Google Trends. Dog er en god proxy for deres popularitet antallet af stjerner, som deres GitHub-lagre får. Et pludseligt skift i antallet af Vue-stjerner skete i midten af ​​2016, og for nylig har Vue været der oppe med React blandt de mest populære rammer.

Stjerner på GitHub-projekter til vinkelformet vs reaktion vs vueAntal stjerner på GitHub-projekter til Angular, React og Vue

Lad os kontrollere, hvordan jobmarkedet er for Angular vs React vs Vue, som også er et godt mål på popularitet:

Jobmarked for Angular vs React vs Vue ��‍♂️

Det bedste kilder til data der angiver tendenser på jobmarkedet er de forskellige jobbrætter.

Som det ses af tendenserne i slutningen af ​​2018, er antallet af job, der kræver et færdigheds sæt Angular or React, stort set det samme, mens Vue stadig kun var en brøkdel af dette antal (ca. 20%). Denne liste er bestemt ikke udtømmende, men giver et godt billede af den samlede tech-industri.

Hvis du ser nøje ud fra det nuværende jobmarkeds synspunkt, er dit bedste alternativ at lære vinkel eller reaktion. I betragtning af at Vue har vundet popularitet i løbet af de sidste tre år kan det dog tage nogen tid, før projekter bruger Vue, eller nye projekter, der vedtager Vue for at nå et modenhedsniveau, der kommandoerer et større antal udviklere.

Del 2: Fællesskab og udvikling

Nu hvor du er bekendt med historien og tendenser for hver af disse rammer, vil vi se på samfundet for at vurdere udviklingen af ​​disse rammer. Vi har allerede set, at trinvise frigivelser for alle rammer er blevet afsendt regelmæssigt i det forløbne år, hvilket tyder på, at udviklingen foregår i fuld gang.

Lad os se på Angular vs React vs Vue med hensyn til statistik om deres GitHub-lagre:

Kantet
Reagere
Vue

# Seere3.2k6.6k6.0k
# Stjerner57k144K157k
# Gafler15.9k27.6k23.7k
# Bidragydere10891.361289

Vue har et stort antal seere, stjerner og gafler. Dette viser dets popularitet blandt brugerne og dets værdi, når man sammenligner Vue vs React. Antallet af bidragydere til Vue er dog lavere end Angular and React.

En mulig forklaring er det Vue drives udelukkende af open source-samfundet, hvorimod Angular og React har en betydelig andel af Google- og Facebook-medarbejdere, der bidrager til depoterne.

Fra statistikken viser alle tre projekter betydelig udviklingsaktivitet, og dette vil helt sikkert fortsætte i fremtiden – bare disse statistikker kan ikke være grundlaget for ikke at beslutte at bruge nogen af ​​dem.

Del 3: Migrationer

Når du arbejder med din valgte ramme, behøver du ikke at bekymre dig om, at en rammeopdatering kommer sammen og messer din kode. Selvom du i de fleste tilfælde ikke støder på mange problemer fra en version til en anden, er det vigtigt at holde din finger på pulsen, fordi nogle opdateringer kan være mere betydningsfulde og kræver justeringer for at holde tingene kompatible.

Kantet planlægger større opdateringer hver sjette måned. Der er også en periode på yderligere seks måneder, før store API’er afskrives, hvilket giver dig tiden til to udgivelsescykler (et år) for at foretage de nødvendige ændringer, hvis nogen.

Når det gælder Angular vs React, har Facebook udtalt det stabilitet er yderst vigtig til dem, da enorme virksomheder som Twitter og Airbnb bruger React. Opgraderinger gennem versioner er generelt de nemmeste i React, med scripts som f.eks reagere-codemod hjælper dig med at migrere.

I migrationsafsnittet i ofte stillede spørgsmål nævner Vue det 90% af API’et er det samme, hvis du migrerer fra 1.x til 2. Der er en migrationshjælperværktøj der fungerer på konsollen til at vurdere status for din app.

Del 4: Arbejde med Vue vs Angular vs React

Der er en håndfuld vigtige egenskaber, man kan se på her, og chef for dem er den samlede størrelse og belastningstider, de tilgængelige komponenter og indlæringskurve.

Størrelse og belastningstid ⏲️

Størrelserne på bibliotekerne er som følger:

  • Vinkel 4+: Afhænger af den producerede bundtstørrelse
  • Reaktion: 116 KB
  • Vue: 91 KB

Selvom der er en signifikant forskel mellem størrelserne på rammerne, er de stadig små sammenlignet med den gennemsnitlige webside-størrelse (2+ MB i 2018). Hvis du bruger et populært CDN til at indlæse disse biblioteker, er det meget sandsynligt, at en bruger har biblioteket allerede indlæst i deres lokale system.

Komponenter ��️

Komponenter er integrerede dele af alle tre rammer, uanset om vi taler Vue, React eller Angular. En komponent får generelt et input og ændrer adfærd baseret på det. Denne adfærdsændring manifesterer sig generelt som en ændring i brugergrænsefladen på en del af siden. Brug af komponenter gør det let at genbruge kode. En komponent kan være en indkøbsvogn på et e-handelswebsted eller et loginfelt på et socialt netværk.

Kantet Kantet:
I vinkel kaldes komponenter direktiver. Direktiver er kun markører på DOM-elementer, som Angular også kan spore og knytte specifik opførsel til. Derfor adskiller Angular UI-delen af ​​komponenter som attributter for HTML-tags og deres opførsel i form af JavaScript-kode. Det er det, der adskiller det, når man ser på Angular vs React.
Reagere Reagere:
Reager, interessant, kombinerer brugergrænsefladen og opførsel af komponenter. For eksempel er her koden til at oprette en hej verdenskomponent i React. I React er den samme del af koden ansvarlig for at oprette et UI-element og diktere dets opførsel.
Vue Vue:
I Vue er UI og adfærd også en del af komponenter, hvilket gør tingene mere intuitive, når man ser på Vue vs React. Vue kan også tilpasses meget, hvilket giver dig mulighed for at kombinere brugergrænsefladen og opførsel af komponenter fra et script. Yderligere kan du også Brug forprocessorer i Vue snarere end CSS, hvilket er en fantastisk funktionalitet. Vue er fantastisk, når det kommer til integration med andre biblioteker, som Bootstrap.

For at sammenligne, hvordan den samme app ser ud med forskellige biblioteker, her er et godt indlæg om oprette den samme til at gøre-app på React og Vue og kontrasterer forskellene mellem de to rammer.

Læringskurve ��

Så hvor vanskeligt er det at lære hver af disse rammer?

Kantet Kantet:
Kantet har en stejl indlæringskurve, i betragtning af at den er en komplet løsning, og at mestre Angular kræver, at du lærer tilknyttede koncepter som TypeScript og MVC. Selvom det tager tid at lære Angular, betaler investeringen udbytte med hensyn til at forstå, hvordan frontend fungerer.
reagere Reagere:
React tilbyder a Kom godt i gang vejledning, der skal hjælpe en med at konfigurere React på cirka en time. Dokumentationen er grundig og komplet med løsninger på almindelige problemer, der allerede findes på Stack Overflow. React er ikke en komplet ramme, og avancerede funktioner kræver brug af tredjepartsbiblioteker. Dette gør indlæringskurven for kernerammen ikke så stejl, men afhænger af den sti, du tager med yderligere funktionalitet. At lære at bruge React betyder ikke nødvendigvis, at du bruger den bedste praksis.
vue Vue:
Vue giver højere tilpasningsevne og er derfor lettere at lære end vinkel eller reaktion. Yderligere har Vue en overlapning med Angular og React med hensyn til deres funktionalitet som brugen af ​​komponenter. Derfor er overgangen til Vue fra en af ​​de to en let mulighed. Imidlertid er Vue enkelhed og fleksibilitet et dobbeltkantet sværd – det tillader dårlig kode, hvilket gør det vanskeligt at fejlsøge og teste.

Selvom Angular, React og Vue har en betydelig læringskurve, er deres anvendelser ved mestring ubegrænsede. For eksempel kan du integrere Angular og React med WordPress og WooCommerce for at oprette progressive webapps.

Angular vs React vs Vue: Who wins?

Lad os i slutningen af ​​dette indlæg huske de karakteristiske træk ved hver ramme for at forsøge at besvare spørgsmålet: Angular vs React vs Vue: hvilken skal du vælge?

kantet logo Kantet er den mest modne af rammerne, har god opbakning med hensyn til bidragydere og er en komplet pakke.

Imidlertid er indlæringskurven stejl, og begreber om udvikling i Angular kan udsætte nye udviklere.

Angular er et godt valg for virksomheder med store teams og udviklere, der allerede bruger TypeScript.

Ekstra �� Her er nogle kantede admin-dashboardskabeloner, som du måske er interesseret i.

reager logo Reagere er lige gammel nok til at være moden og har et enormt antal bidrag fra samfundet. Det har vundet bred accept. Jobmarkedet for React er virkelig godt, og fremtiden for denne ramme ser lys ud.

React ligner et godt valg for nogen, der kommer i gang med front-end JavaScript-rammer, startups og udviklere, der kan lide noget fleksibilitet. Evnen til at integreres med andre rammer problemfrit giver det en stor fordel for dem, der gerne vil have en vis fleksibilitet i deres kode.

Vue logo Vue er nyest på arenaen uden opbakning fra et større firma.

Det har dog gjort det rigtig godt i de sidste par år at komme ud som en stærk konkurrent for Angular and React. Dette spiller måske en rolle med mange kinesiske giganter som Alibaba og Baidu, der vælger Vue som deres primære JavaScript-ramme.

Det skal dog ses, hvordan det går i fremtiden, og man er berettiget til at være forsigtig med det. Vue skal være dit valg, hvis du foretrækker enkelhed, men også kan lide fleksibilitet.

Ekstra �� Her er nogle Vue admin-skabeloner bygget med Bootstrap, som du måske vil være interesseret i.

Svaret på debatten om Angular vs React vs Vue er, at der ikke er noget absolut rigtigt valg, som du sandsynligvis har forventet.

Hvert af disse biblioteker har deres egne fordele og ulemper. Baseret på det projekt, du arbejder på, og dine individuelle krav, vil en af ​​dem være mere passende end de andre. Det er altid nøglen at lave din egen research, inden du beslutter dig, især hvis du skal arbejde på et forretningsforetagende og ikke på et personligt projekt.

Hvilke rammer synes du er vinderen her – Angular vs React vs Vue? Lad os vide det i kommentarerne herunder.

Yderligere læsning: ��

  • Materiale designskabeloner til Vue, kantet, reagerer (Material UI)
  • Bedste React UI-komponentbiblioteker / -rammer
  • Interessante Vue UI-komponentbiblioteker
  • Bedste kantede admin-instrumentbordskabeloner
  • Bedste gratis bootstrap-skabeloner til ReactJS
  • Gratis reagerer indfødte skabeloner
  • Gratis og Premium VueJS-administratorskabeloner, der er bygget med bootstrap

På en anden note, hvad med at bruge WordPress lidt mere? WordPress er perfekt egnet til at køre næsten ethvert webstedsprojekt, man kan forestille sig, og der er nogle fantastiske temaer tilgængelige for at få dit design til at se godt ud (mange af dem gratis). For ikke at nævne, at du kan være vært for et WordPress-websted for billigere.

Glem ikke at deltage i vores nedbrudskursus om at fremskynde dit WordPress-sted. Med nogle enkle rettelser kan du reducere din indlæsningstid med endda 50-80%:

Layout og præsentation af Karol K.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Это интересно
    Adblock
    detector