… Every drop has ability to survive .

Leave a comment

Angular4 on top of Angular2

The journey of AngularJS to Angular:

In 2009 Hevery (developer at google) began working on a project called Google Feedback. But the code grown up to almost 17000+ lines. So he decided to come with some strong framework or end-to-end tool that allowed web designers to interact with both the frontend and the backend. And from here the journey of Angular began. In older versions of angular (i.e. Angular 1.x) are known as AngularJS. Angular got released with massive success and got popular within no time. But after the time when Angularjs got involved in heavy projects, the drawbacks are started appearing epically about the core features of Angular. Especially regarding one of the core features of AngularJS like $scope and digest cycle. Those features started creating problems and such challenges leads to the newer version of AngularJS (known as only ‘Angular’) Angular 2. Then other major release comes up As Angular 4 (latest version).

Why not Angular 3:

Of course, after seeing the version number Angular 4 the oblivious question comes to mind why not Angular3?
Angular is being developed in a ‘MonoRepo’. The advantage of MonoRepo is, you don’t have to deal with the versioning of the code dependencies. But along the side huge developments were going on in the router section, like route-preload. So, @angular/router was already having the version 3.x. So, to avoid further confusion by launching Angular 3 having router version 4. It was better to release with Angular 4

Angular 4 compared with Angular 2:

More over Angular 4 or simply Angular is the next logical version of Angular2 but it has nothing in common with Angular 1 also called AngularJS. Angular 4 is continuation of Angular2.

  • Performance Improvement:

    The major worked have been carried out in Angular4 is regarding the performance. IT has been observed that initial loading time of the angular2 App was quite noticeable.
    The most of Angular 2’s life, there has just been the JIT (just in time) compiler, the compiler that runs in the browser. When an Angular2 application is bootstrapped in the browser, the JIT compiler performs a lot of work to analyze the components in the application at runtime and generate code in memory. When the page is refreshed, all the work that has been done is thrown away, and the JIT compiler does the work all over again.
    After that Angular team come up with AOT (Ahead-of-Time compiler). And using few commands Angular2 was could use AOT compilation to improve the performance.
    While releasing the Angular4, this was one of the major change which has been integrated in Angular4. The view engine of Angular4 has been significantly improved. These AOT modifications decrease the size of the generated code for those parts by approximately 60 percent. The more complicated the templates are, the greater the savings.

  • Animations:

    Animations being pulled out of @angular/core to remove the extra code being imported into our production bundle. Though you can easily add animation by importing {BrowserAnimationsModule} from @angular/platform-browser/animations into NgModule.

  • Email validation:

    In Angular2 we must apply RegEx. But now just put email as an attribute to input field where you want to have email id.

  • Typescript compatibility:

    In Angular 4 we can use typescript 2.1 or more earlier only up to typescript 1.8 was supported.

  • Debugging with Source Maps:

    In Angular4 if an error caused by something in one of the templates, they create source maps that provide a meaningful context concerning the original template.

  • Angular Universal:

    This release now contains the result of the external & internal work from the Universal team throughout the last few months. Most of this Universal code is currently located in @angular/platform-server.

  • Migrating to Angular4 from Angular2:

    Updating to Angular4 from Angular2 is easy. It’s as simple updating your Angular dependencies to the latest version, and double checking if you want animations.


I would say, Angular will be a bit confusing for those who are from migrating from AngularJS 1.x. Due to significant changes between Angular and AngularJS. But for experienced developers who have more exposure to server-side coding standards along with some UI experience, then it will be very easy for them to use Angular and they will find it very helpful. I am saying this just because of the power given by the integration of typescript to the Angular. It empowers developer from server-side to use same standards and coding style while developing the UI applications. 😊
Yes, one should go ahead with Angular 4 instead of version 2.0. There is lot of update on existing feature and bug fixes in version 4 compared to version 2.0. As well as whatever the dependencies are going to be used in the application will be compatible with version 4.x. So, it is better to go with version 4.x and up.