Time for Angular 2?
The first stable version of Angular 2 was finally released this September. While the popularity of Angular 1 has a stronghold on the development community, Angular 2 is already proving to be a formidable opponent.
But why are we even pitting Angular 1 against Angular 2? Isn't v2 just an improvement on v1? The answer turns out to be a resounding 'no'. Angular 2 is written with TypeScript, giving it a more Java like syntax. It's also component based, completely eliminating the concept of $scope (a cornerstone of Angular 1).
Angular 1
Such fundamental differences may scare those that have grown to love Angular 1. It's two way data binding and revolutionary digest cycle have greatly simplified the creation of dynamic web apps. Additionally, Angular 1's use of dependency injection forces a separation of concerns that makes for highly organized MVC like JavaScript. What's not to love?
It turns out that the aforementioned strengths are also at the root of the framework's pitfalls. Although Angular's digest cycle keeps the page perfectly in sync with a Javascript controller POJO, it can get overly complex, and fast. With third party libraries, developers often times have to include $scope.apply() or $scope.digest() to manually 'sync up' with the existing scope. It can also become unclear as to which watchers and events are firing at what times and how frequently the digest loop is running.
These issues surrounding the digest cycle have also lead to performance issues with Angular 1. Developers working with larger data sets have seen first hand the performance hit inccured through a simple 'ng-repeat' with big data.
Angular 2
With Angular 2's component based approach, developers can better harness the power of change detection. What this essentially means is that different components are updated at different times. This differs from the digest loop in Angular 1, where any event listener fires a recursive search on the entire DOM tree. By allowing developers to selectively pass components through the digest loop, Angular 2 apps are proving to be more performant than their Angular 1 counterparts. Angular 2 is also more conducive to passive loading, so modules and components are only loaded when needed. This too helps Angular 2 win from the performance standpoint.
Angular 2 also wins with server side rendering. While Angular 1 is great for delivering low latency, high performance, single page apps, it takes a huge hit on SEO. And what good is a great user experience with no user base? Angular 2 allows for templates to be rendered server side, meaning web crawlers can easily read generated content (vs. reading content that is displayed dynamically through JS). For more information on the benefits of server side rendering, see Page Rendering: Client Side vs. Server Side.
Conclusion
Through their syntax and organization, Angular 1 & 2 are vastly different from one another. Angular 2 may be more strict in its syntax, but has proven to be more performant. Some even claim that Angular 2 is 5-10 times faster than it's older counterpart. Do remember that TypeScript (Angular 2's foundation) is compiled into JavaScript before it's sent to the browser. This has led to performance hits, as developers have reported 10 second+ initial load times for Angular 2 apps.
Angular 2 may have some things to improve upon. It's emphasis on server side rendering and cross platform development make it something that everyone needs to start playing around with. Angular 1 will retain it's popularity, but Angular 2's clear direction is where front end development is ultimately headed.
