Angular JS vs Angular
AngularJS is the name of the first JS framework developed by Google to create Single Page Application (SPA). It has existed for some years and has recently been replaced by Angular (without the “JS” suffix), the new name of the framework since the version 2.
The loss of its suffix is not insignificant, it announces complete rework of the framework as well as a change on languages that can be used to build and develop SPA. From now, Angular highlights the usage of Typescript; a superset of Javascript ES6 developed by Microsoft that compile ES5 & ES6 compatible Javascript code.
In addition to Typescript usage, Angular has chosen to add UI based components to replace controllers, directives and the (in-)famous $scope
.
Controllers are not the only thing that have changed, services have changed too. They now have only one way of defining them: classes.
We can also note that Dependency Injection is more reachable with the @Injectable decorator.
The new RoutingModule class is dedicated to define the routes inside the application.
In order to generate the route links in the templates, the ng-href
attribute has been replaced by [routerLink]
.
Regarding events, Angular introduces a new syntax in camelCase, also used for the few built-in directives.
New tools available
Angular uses and promotes new tools that prove to be practical and efficient:
- Typescript : the typed overlay of javascript ES6.
- Sass : an extension of CSS3, adding new rules in our way to integrate a web design. Use of variables, mixins, inheritance selection and various very useful options.
- SystemJS : which allows to load the ES6, AMD, CommonJS and global scripts modules in the browser.
- Webpack : which also allows to load modules but which provides the possibility of packing our application (concatenation of files, file uglify, etc …).
- RxJS : a library allowing to create asynchronous and event programs using observable sequences.
Getting started and performance
Angular comes with so many changes compared to AngularJS that learning it is almost learning a new framework.
All of its changes make it possible to have a more orderly and more efficient code. Indeed, for similar projects, we can see major performance improvements in Angular. AngularJS had the unfortunate tendency to show signs of weaknesses and slowdowns as the application became more and more complex.
Thanks to Angular, it is almost over, although some of it’s base concepts (two way data binding…) are still heavily discussed and questioned.
But performance come with a price, Angular is harder and slower to learn than its predecessor. This is due to its new architecture — use of the Typescript Language and the addition of new tools (Sass, Webpack and RxJS).
However, Angular now has a console called AngularCLI to generate components / modules / services as well as other things, making it easier to handle.
AngularJS or Angular
By comparing AngularJS to Angular, we are entitled to ask two questions.
1) Should I migrate all my AngularJS projects to Angular?
In the case of a simple project, it does not have much interest. In contrast, if it’s complex and needs a performances boost, it may be interesting to perform the migration. If you have time to do it, because it will not be an easy and straightforward task.
2) Should I use AngularJS or Angular to start a new project?
For a complex projet, the answer is definitely “Angular”.
For a simple project, you should actually ask yourself “Do I need Angular(JS) at all ?”. Angular(JS) is known to be a very comprehensive framework but also quite heavy compared to other frameworks.
A quick note about support. AngularJS is still maintained and supported but this will eventually end. Google is known to sometimes end support of their tools or technologies quite suddenly so you never know when it will come.
Do you want to know more about Wassa?
Wassa is an innovative digital agency expert in Indoor Location and Computer Vision.
Whether you are looking to help your customers to find their way in a building, enhance the user experience of your products, collect data from your customers or analyze the human traffic and behavior in a location, our Innovation Lab brings scientific expertise to design the most adapted solution to your goals.
Find us on: