Aurelia och Angular är populära JavaScript-klientramverk som gör det möjligt för dig att bygga moderna applikationer för webben, mobilen och datorn. De ger moderna funktioner som databindning, förlängningsbar HTML, SPA, Routing, UI-komposition etc. för att bygga komplexa appar.
I det här blogginlägget har jag försökt att jämföra Aurelia och Angular och belysa fördelarna med Aurelia jämfört med angular tillsammans med för- och nackdelar med båda.
Aurelia är diskret, lätt att lära sig och förstå på grund av dess filosofi ”konventioner framför konfigurationer”, du behöver bara följa några enkla konventioner utan sådana konfigurationer som krävs för Angular. Syntaxen är lätt att komma ihåg och gör det möjligt att bygga komponenter i Typescript och i Vanilla JavaScript också.
Aurelia och Angular är båda baserade på Components approach och liknar varandra på många sätt. Angular stöds i princip av IT-jätten Google medan Aurelia utvecklas av Rob Eisenberg och hans team, Eisenberg har tidigare varit anställd i Googles Angular 2-team, han lämnade detsamma på grund av viss oenighet och bestämde sig för att bygga en ”diskret” plattform med anslutning till webbstandarder.
Detta är en av fördelarna med Aurelia. Det är dess strategi ”konvention framför konfiguration” som gör den diskret. Du behöver inte oroa dig för ramverkssaker, du kan i första hand fokusera på din applikationslogik.
I Aurelia, om du skapar en komponent, behöver du ingen dekorator för att annotera en komponent, du behöver inte oroa dig för metadataspecifikation, följ bara de enkla konventionerna och Aurelia kommer att göra många saker av sig själv.
Låt oss se ett exempel. För att skapa en grundläggande komponent för att skriva ut ”Hello World!”, kan din komponent Typescript-kod vara:
HTML-mall:
Standardväljaren för din komponent är <hello></hello> och dess HTML-mall identifieras av filnamnskonventionen.
Samma komponent i Angular
Typescriptkod:
HTML-mall:
I Angular måste du också deklarera komponent i deklarationsavsnittet i ngModulen.
Skapandet av komponenter verkar vara enklare i Aurelia, eller hur?
Bindningssyntax
Aurelias syntax är enklare att lära sig och komma ihåg.
Värdebindningssyntax: attribute.command=”expression”
e.t.ex. <input value.bind=”firstName”>
Event binding syntax: event.command=”expression”
d.v.s. <button click.trigger=”sayHello()”>Säg hej</button>
Klassbindning:
detta gäller t.ex. <div class.bind=”isActive ? ’active’ : ””></div>
Angular’s binding syntax
Value binding: I Angular används ngModel-direktivet för att binda inmatningar, Observera att ”ngModel” är skiftlägeskänslig.
Till exempel <input =”firstName” >
Händelsebindning: Detta är ganska enkelt (event)=”expression”
dvs. <button (click)=”sayHello()”>Say Hello</button>
Klassbindning: Den har syntaxen =”some-condition”
dessutom =”hero === selectedHero”
Routing och navigering
Routingkonfigurationen är i princip likadan i båda ramverken men med en viktig skillnad. I Angular definieras vägar för en modul centralt i en enda config som definierar vägar och de routabla komponenterna tillsammans med alla undervägar, detta gör det enormt och komplext.
Vidare i Aurelia kan du definiera de överordnade vägarna på ett ställe och lägga konfigurationen av undervägarna i den underordnade komponenten, detta döljer den inre komplexiteten och gör komponenterna helt inkapslade.
Språkstöd
Aurelia erbjuder dig breda valmöjligheter att välja mellan ES5, ES 2015, ES 2016, ES.Next och Typescript för att skriva din JavaScript-kod.
Varför Angular begränsar användaren till att endast skriva kod i Typescript.
Standardöverensstämmelse
Aurelia är vederbörligen förenlig med befintliga standarder och även med framväxande webbstandarder.
Angular ligger långt efter i det här fallet, vilket påpekas av samhället att det avviker från standarder. Till exempel är HTML inte skiftlägeskänslig, men Angular har antagit syntax som är skiftlägeskänslig, t.ex. ngFor, ngModel, som inte kan hanteras av webbläsaren.
Ekosystem och kommersiellt stöd
Angular stöds av IT-jätten Google och har ett brett ekosystem och stöd från samhället. Aurelia är något eftersatt i det här fallet, dess ekosystem är mindre och komponenter från tredje part är inte allmänt tillgängliga.
Men dess ekosystem växer kontinuerligt och det håller på att växa fram som ett populärt ramverk på grund av att det är lätt att utveckla det, att det följer standarder och att det är enkelt.
Dokumentation
Både Angular och Aurelia har en riklig dokumentation och handledning, du kan lära dig ramverkets grunder bara genom att följa de handledningar som finns på deras webbplatser.
En negativ punkt med Angular är att det har en ”brant inlärningskurva”, Angular-teamet uppdaterar kontinuerligt sitt ramverk och dessa uppdateringar är mycket frekventa så du måste fortsätta att lära dig och anpassa dig till nödvändiga förändringar.
Slutsats
Aurelia och Angular är båda kraftfulla ramverk, Angular är mer känt på grund av Googles kommersiella stöd och ett bredare stöd från samhället.
Aurelia är enklare, diskret och mer standardanpassad, och dess ”konvention över konfiguration”-policy gör utvecklingen enklare och snabbare.