Angular vs. Vue.js- En praktisk sammenligningsvejledning

Moderne frontend-udvikling har dramatisk ændret sig meget i de sidste par årtier. Som front-end-udvikler, når jeg tænker på moderne front-end-udvikling, kommer tre lovende teknologier op i tankerne, som jeg tror de fleste af jer kan gætte med let-

  1. Googles vinkel
  2. Facebook's React
  3. Vue.js

Hver af disse kommer med sit eget sæt af styrker og svagheder. Hvad skal jeg bruge til mit næste projekt, skal det være React or Angular eller Vue.js er et meget almindeligt spørgsmål, der dirrer i sindet for enhver front-end programmør.

Baseret på min erfaring skriver jeg denne blog for at sammenligne to af de største spillere på front-end-udviklingsmarkedet, dvs Angular (At være den ældste blandt de tre af dem) og Vue (At være den yngste blandt den givne kohort) og vil prøve for at finde ud af svaret, hvad du skal bruge i dit næste projekt. Hvis du vil finde en sammenligning mellem React og Vue.js, kan du finde den her i denne blog.

Før vi påbegynder en debat om fordele og ulemper ved disse to, lad os udforske nogle historie om Vue og Angular.

Kantet

Angular er en TypeScript-baseret JavaScript-ramme. Angular er udviklet og vedligeholdt af Google og er den omskrevne, en inkompatibel efterfølger til AngularJS. Mens AngularJS oprindeligt blev frigivet i oktober 2010, og Angular blev introduceret i september 2016 som version 2.

Der er adskillige fordele ved at bruge Angular i web-front-end-udvikling -

  • Det hele er MVC

Kerneideen bag Model View Controller eller MVC er at opdele en applikation i 3 vigtige logiske komponenter, nemlig. modellen, visningen og controlleren for at isolere applikationslogikken fra brugergrænsefladelaget.

  • Understøttet TypeScript-support

TypeScript er et supersæt af JavaScript med designtidstøtte til typesikkerhed og værktøj. Tilgængeligheden af ​​typer gør koden, der er skrevet i TypeScript, mindre modtagelig for kørselsfejl.

  • Ejes af Google

Understøttet af tech-giganten Google. Giver kantet ny version efter hvert halve år.

  • Uafhængighed Injektion

AngularJS leveres med et indbygget subsystem til afhængighedsinjektion, der forenkler processen med enhedstestning.

Vue

Vue er også en JavaScript-ramme, der først blev frigivet i februar 2014 af en tidligere Google-medarbejder Evan You. Vue er den hurtigst voksende JS-ramme, især uden støtte fra noget stort firma. Vue arver de fleste af de gode ting fra både React og Angular, og nogle teknikere betragter det derfor som et uofficielt barn af Angular and React.

Der er flere fordele ved at bruge Vue i web-front-end-udvikling -

  • Det er lille størrelse

Størrelsen på denne ramme er 18–21 KB, og det tager ikke tid for brugeren at downloade og bruge den. Dette betyder ikke, at dens ydeevne er kompromitteret - det slår faktisk alle de voluminøse rammer som React.js, Angular.js og Ember.js.

  • Det er relativt let

Personligt er jeg en stor fan af Vue. Det er meget let at lære - faktisk var jeg i stand til at lære og tilpasse Vue i daglige udviklingsopgaver på mindre end to uger.

  • Vues dokumentation er prisværdig

Selvom det ikke er sikkerhedskopieret af organisationer med flere milliarder dollars som Google eller FB, er det stadig lykkedes at udvikle sig på meget kort tid og har sikret, at opdateringerne ikke er så komplicerede at gennemvæde, som det har været tilfældet med nogle af de andre markante dominerende navne.

  • Tilbyder en stor grad af fleksibilitet

Det giver sine brugere mulighed for at skrive deres skabelon i JavaScript-fil, HTML-fil og ren JavaScript-fil ved hjælp af virtuelle noder. Denne fleksibilitet gør det også krævende at forstå for React, Angular eller andre JS-udviklere.

Sammenligning

Her er nogle nøgleparametre, baseret på hvilke vi sammenligner vinkel- og Vue-rammer-

  • Hvor modne disse rammer er?
  • Hvor meget er de kompatible med applikationernes forskellige størrelse?
  • Hvad med indlæringskurven for hver af disse rammer?
  • Hvor meget er udvikler / udviklingsvenlige disse rammer?
  • Hvilken ydelse forventer du af applikationen?
  • Hvordan kan du begynde at strukturere din ansøgning med den valgte ramme?
  • Er det sandsynligt, at denne ramme opfylder din projekt skalerbarhed?

Klar parat start!

1. Fællesskab og popularitet

Definitivt Angular er mere populært blandt store virksomheder. Det har et stort samfund og en back-support fra Google.

Også Vue vokser hurtigt og har fået meget trækkraft fra udviklere i de senere år.

Det er et lille samfund og har ingen stor støtte til virksomheden

Taler om statistik-

På Github har Angular> 41.000 stjerner og 730 bidragydere, og Vue har næsten 114.000 stjerner og kun 193 bidragydere.

På Github Stars, History for Angular, React and Vue, ser det ud til, at Vue trender meget godt. Ifølge bestof.js har Angular fået gennemsnit på 37 stjerner og Vue 135 stjerner pr. Dag.

Kilde: Medium

2. Syntaks og kodelængde

Mens jeg arbejdede på begge rammer, har jeg bemærket, at Angular bruger mere kompleks syntaks, mens Vue er let at lære på grund af dets enkelthed med hensyn til syntaks. Den tid, jeg har brugt til at gøre enkle ting i Angular, er mere. Nogle gange fører dens kompleksitet ofte til forvirring.

Vue er let at lære på grund af dets ukomplicerede natur syntaks. Her er syntaksen pæn og ren. Og fra baggrunden af ​​JavaScript er det ganske let for mig at lære Vue. Fordi Angular bruger TypeScript (brug af dekoratører og injektorer), så man skal have den grundlæggende viden om TypeScript eller have arbejdet på OOPS-koncept.

3. Struktur

Vinkelform er mere struktureret og uddybet. Det tvinger udvikleren til at gøre alt på en standard måde. De vigtigste store virksomhedsprojekter er afhængige af Angular på grund af dens foruddefinerede struktur, der sikrer, at enhver udvikler følger den samme arkitektur.

Vue er mere fleksibel, og det giver udvikleren mulighed for at strukturere projektet, som du ønsker. Det giver brugeren mulighed for at skrive deres skabelon i HTML-fil eller Javascript-fil. Du kan bruge Angular, hvis din personlige præference er TypeScript og OOPS. Desuden leverer Vue også typeskrift til projektudvikling, men der er ikke mange biblioteker i det.

4. Kode skalerbarhed

Når du skal have en massiv kodebase, er Angular god med hensyn til kodeskalerbarhed, fordi det er en fuldgyldig ramme at det begrænser udvikleren til at udvikle kode i en bestemt kodestruktur.

På den anden side mangler Vue.js en liste over de bedste skaleringspraksis. Der er ingen specifik applikationsstruktur anvendt til brugere fra Vue.js at følge, hvilket er meget vigtigt, når du skal have en stor kodebase.

5. Indbyggede biblioteker

Da Vue er nyt, har det mindre rammespecifikke biblioteker, så du er nødt til at medtage de fleste tredjepartsbiblioteker eksplicit.

Angular har så mange rammespecifikke biblioteker, og også de fleste af bibliotekerne er inkluderet tidligere i Angular-CLI-projektet.

For eksempel- Biblioteket ligesom RxJS er indbygget i Angular CLI-projekter, men i Vue skal du eksplicit installere andre biblioteker inklusive RxJS for at få det til at fungere.

Angular har også indbyggede API-specifikke biblioteker, som udvikleren ikke behøver at installere det eksplicit. Vue leveres ikke med API-specifikt bibliotek og skal bruge AXIOS-bibliotek eksplicit til API-opkald.

6. Ydeevne

Brugen af ​​Virtual-DOM-koncept gør Vue mere performativ sammenlignet med Angular.

På den anden side bruger Angular seere til datavendring.

Lad os starte med Virtual DOM. Antag, at du har en dynamisk tabel med n rækker.

Nu ændrer der sig noget i den første række. Hvad de fleste rammer gør, er at genopbygge og gendanne hele listen. Det er n gange mere arbejde end nødvendigt, da vi kun har brug for at opdatere den første række.

Lad os ikke se på, hvad virtuel DOM vil gøre i denne situation.

Før enhver opdatering opretter den kopien af ​​DOM og fungerer med denne kopi. Når virtuel DOM er blevet opdateret, sammenligner den den samme med den ældre version, der er blevet fanget før opdateringen og finder elementer, der skal opdateres. Når du har kontrolleret forskellen, opdateres kun de ægte DOM kun de dele, der ændres.

7. Ud over Internettet

Angular leveres med ionisk og native script til mobil applikationsudvikling. Vue er det bedste valg for udviklere, der nyder indbygget mobiludvikling ved hjælp af Alibaba Weex og Vue-Native, men alle disse er ret nye i forhold til Ionic.

Men ingen af ​​disse mobile rammer giver dem mulighed for at nå præstationen fra React Native.

Resumé

Vue.js er meget let og let at lære rammer, der giver dig mulighed for at oprette fantastiske applikationer på din måde. Det er ikke så meget berømt som Angular (vedligeholdt af Google) blandt udviklere, men skaber bestemt store bølger af forandringer. Det ved du måske ikke, men Laravel-samfundet har også betragtet det som et af deres foretrukne front-frame-rammer. Vinkelformet er en meget udviklet ramme og har adskillige værktøjer lige ud af kassen. Du kan beslutte, hvad du skal vælge på baggrund af nøglepunkterne nedenfor -

Hvis du stadig ikke kan beslutte det, skal du først lære Vue, derefter Angular.

Vi i Systango har en gruppe af ekspert front-end og full-stack udviklere, som alle er dygtige til at designe alt slankt og skarpt. Vi bruger alle avancerede teknologier, herunder React, Angular og Vue.js til at skabe styrke og sømløse online oplevelser.

Diskuter dit næste projekt - vi vil meget gerne høre fra dig!

Denne artikel blev oprindeligt offentliggjort på Systango Technologies.