Whats coming with Angular 2
Joao Garin / November 04, 2015
5 min read • ––– views
Angular 2 was first announced in Paris at the ng-europe conference and it caused quite a sensation after anouncing that a lof of the things from angular 1 would be "killed" like controllers or scope.
But lets take the steps and analyze each of these things.
On of the things Angular2 focuses on is making sure that mobile is a first target and not just something that "works". This meand improving perfomance drastically as well as making sure animations are smooth and integration with tools like ionic are on the edge of mobile. By the way the Ionic team is working closely with the angular team to develop angular2 and they actualy released a alpha version of Ionic2 running on Angular 2 already.
Another of the challenges of the Angular team for Angular2 is making sure the size of the framework is smaller. Aming at less than 70K. For this a lot of the modules where removed from the core and they are integrated as you need them. This is great because for simple apps where you dont need as much you dont have to pack things that are really not necessary making loading time smaller and increasing performance.
Like mentioned before one of the key things right now is making sure Angular leverages all the features of ES6, as well as targeting modern browsers making sure that making hacks and workarounds for basic things dont have to be done by developers and possibly can be handled by the framework itself.
So lets dig in into the changes that Angular2 will bring to the table and how good / challenging they can be for us developers.
Dependency injection is a design pattern where an object is passed its dependencies instead of assigning them himself was one of the key points and a big differentiator in Angular1. But in Angular1 DI was full of problems and these problems are now being addressed in Angular2 as well as improving with some additional features like child injectors or lifetime/scope controll.
In Angular2 templating processing changes quite a lot. As the code is based on the ES6 module spec, the module loader will load dependencies by simply referencing them in the component definition.
In Angular2 there are 3 types of directives.
- Decorator directives - These directives are used to decorate elements like adding tooltips or showing / hiding elements (using ng-show / ng-hide)
- Template directives - Examples of these directives are ng-if and ng-repeat. They will turn HTML into a reusable template. The instantiating of the template and its insertion into the DOM can be fully controlled by the directive author.
Angular2 includes what is known in the angular community as the "new router" by default. It is a much more flexbile and powerfull routing solution as oposed to the first router included in Angular1. Altough this router is included by default in Angular2 it can also be used in Angular1 (from angular 1.4 forward).
It includes the following features :
- Simple JSON-based Route Config
- Optional Convention over Configuration
- Static, Parameterized and Splat Route Patterns
- URL Resolver
- Query String Support
- Use Push State or Hashchange
- Navigation Model (For Generating a Navigation UI)
- Document Title Updates
- 404 Route Handling
- Location Service
- History Manipulation
Angular2 will come with a pack of new features, focused on support for ES6 features and modern web browsers, new router, increase performance and of course a component driven approach to how web apps will be built.
While angular1 will stay for a long time, as there is not even a release date to angular2, it is good to keep an eye on what will be a new dawn for the angular community and a lot of the community is already making plans on how to upgrade apps to angular 2 and start using it right away.
A full detail on the progress and plan into Angular2 first betas can be found here : https://github.com/angular/angular/milestones
Subscribe to the newsletter
Get emails from me about web development, tech, and early access to new articles.