07september

Van AngularJS naar Angular2 - deel 1

Introductie

In een korte serie blogposts kijk ik vooruit naar de komst van Angular2, de volgende versie van het populaire JavaScript-framework AngularJS. Ik schreef eerder over AngularJS, bijvoorbeeld:

ng2-01

Een van de populairste frameworks voor webdevelopment de afgelopen jaren was zonder twijfel AngularJS. Waar MVC-applicaties traditioneel het domein van de server waren met .NET MVC en Java Spring als bekendste varianten, bracht AngularJS het MVC-principe naar de browser. De complete app wordt hierbij geschreven in JavaScript en uitgevoerd door de browser.

De rol van de server in dit scenario is voornamelijk nog het authenticeren van gebruikers en het ophalen en serveren van gegevens uit de achterliggende database via een API. Oneerbiedig gezegd zou je kunnen stellen dat een server in dit plaatje niets meer is dan een “JSON-fabriek” die op verzoek van de gebruiker gegevens ophoest. Hierbij chargeer ik uiteraard een beetje, maar het geeft wel aan dat een bedrijf voor dezelfde applicaties veel minder hardware nodig heeft en dus fors kan besparen op aanschaf, onderhoud en beheer van het serverpark. Of omgekeerd: met dezelfde hoeveelheid machines kunnen veel meer bezoekers worden bediend.

Waar hebben we het over? De eerste versie heet AngularJS (alles in de 1.x-codereeks), de tweede versie wordt vaak eenvoudig Angular2, of kortweg ng2 genoemd (alles in de 2.x-codereeks)

AngularJS is populair

AngularJS is dus een grote hit. Het is een van de populairste repositories op Github (een wereldwijde code-sharingdienst voor programmeurs). Ik heb sinds eind 2012 honderden cursisten opgeleid of bijgeschoold in dit framework.

Maar: Angular2 staat voor de deur. En de upgrade van AngularJS naar Angular2 zal niet zonder slag of stoot verlopen. De frameworks zijn grotendeels incompatibel met elkaar! Dit betekent dat bestaande applicaties niet, of slechts tegen aanzienlijke kosten geüpgraded kunnen worden naar Angular2.

Waarom Angular2?

Wat bezielt het Angular-team in vredesnaam? Waarom hebben ze deze moeilijke weg gekozen? Zou het niet veel makkelijker zijn geweest om na 1.4 (de huidige versie) gewoon door te gaan met 1.5, 1.6 en zo verder?

Ja, dat had zeker gekund (en terzijde: ook na het verschijnen van Angular2 zal de 1.x-stack ook onafhankelijk verder ontwikkeld blijven worden, met die al genoemde versies 1.5 en 1.6 en zo verder), maar dan had het framework niet kunnen profiteren van allerlei nieuwe ontwikkelingen in webdesignland.

Immers, er verandert veel voor de webdeveloper. Want hoewel AngularJS nog steeds te boek staat als een ‘nieuw’ framework, stamt de eerste versie alweer uit 2009. Het is dus al ruim zes jaar oud. De huidige codebase is niet geschreven met webtechnieken van nu. ECMASCript 2015, de nieuwe versie van JavaScript staat voor de deur. We kunnen straks ook in JavaScript werken met classes, modules en componenten. TypeScript (een uitbreiding bovenop ECMAScript 2015) gaat deel uitmaken van Angular2. Hiermee komt type-safety binnen het bereik van de webdeveloper. Traditioneel was dit altijd een zwak punt van JavaScript.

Angular2 is nog niet beschikbaar. Er wordt veel gesproken en geblogd over Angular2, maar laten we niet vergeten dat het framework op dit moment nog niet gereed is. Het verkeert nog in de alpha-fase. Veel online voorbeelden die je op dit moment ziet, werken allen met die specifieke versie van Angular2. Er vinden continu aanpassingen plaats. Als mogelijke releasedatum wordt gesproken over Q4-2015 tot Q2-2016.

Wildgroei in het framework

De huidige versie van AngularJS werkt goed, zonder meer. Maar er zijn ook duidelijke tekenen dat het framework is ontwikkeld zonder vooropgezet plan. Er is langzamerhand allerlei wildgroei in AngularJS geslopen: er zijn meerdere uitwerkingen voor hetzelfde concept.

  • Denk aan het probleem ‘Services vs Factories vs Providers’. Welke variant te gebruiken?
  • Er zijn constanten die eigenlijk helemaal geen constanten, of zelfs maar read-only zijn.
  • Er zijn controllers op talloze manieren, met en zonder $scope.
  • De mogelijkheid om eigen componenten te schrijven (‘directives’ in AngularJS-taal) is complex en bevat eveneens veel doublures.

En zo zijn er nog meer eigenschappen die het leren van AngularJS op zijn zachtst gezegd een hele uitdaging maken. Het is geen framework voor beginners. Angular2 streeft naar meer consistentie op een moderne en eenvoudiger te leren manier. Voor beginners wordt Angular2 sneller en eenvoudiger te leren dan AngularJS.

Bent je dan in het voordeel als je nu al een AngularJS-veteraan bent? Misschien wel, want veel concepten en uitgangspunten blijven gelijk. Maar je zal ook veel moeten afleren! Angular2 kent een volkomen nieuwe syntaxis, zowel in de logica als in de user interfacecode.

Training in Angular2

In oktober ga ik (opnieuw) naar de VS voor conferentie en training over onder meer Angular2. Vanaf medio november 2015 zal ik deze kennis gebruiken om de eerste Angular2-trainingen in Nederland en België op te gaan zetten. Neem contact op als je hier alvast meer over wilt weten.

Medio voorjaar 2016 – zo snel mogelijk na de definitieve releasedatum – schrijf ik een boek over Angular2 in de Web Development Library.

 

Peter Kassenaar
-- 7 september 2015

Reacties zijn gesloten