Angular Connect 2016 is now over. And what a spectacle it was indeed. Great speeches from both Angular core team members and other community influencers. This blog post will contain my catches from the conference, mainly concentrating on the stuff that has just became ready or is just about to be published.
Angular CLI
Angular CLI is the command-line interface to generate new Angular 2 applications. It also allows users to generate core parts of the applications such as components, services, pipes etc. The CLI is officially maintained by Angular, though most of the people building it are actually doing it on their spare-time as open source contributions.
It is currently in beta stage and has been updated to the Angular 2.0.0. It supports the basic generation options and now uses Webpack 2 internally. So what is there to happen then?
So far, the Angular core team hasn’t been promoting any Angular 2 starter kit over another and there has been multiple projects competing on this category. Well, not anymore. Angular core team declared that they recommend every project to be bootstrapped with the Angular CLI. The reasoning behind this is simple. They will provide all the upgrades between major versions of Angular in the future via Angular CLI so it will be as seamless as possible for developers. It will also contain everything readily configured for it to be as easy as possible for newcomers – without lacking any more advanced features needed by others.
Currently the CLI isn’t supporting the Ahead-of-Time compilation. Not yet, that is. But the support for it is now ready and was already demoed by core team member Martin Probst on his talk Optimizing Angular 2 Apps during the day 1 of Angular Connect. The support is built as a separate plugin called X, but it integrates easily to CLI as soon as it is released and will be covered by the CLI developers. According to Probst, the support will be merged in within the next few days already, so you might want to stay tuned.
Another interesting question raised at the Q&A session about tooling was that why does Angular CLI hide the Webpack configuration from the developers by not including it in the generated project? The answer by core team member Rob Wormald states that it shouldn’t basically matter to the user of Angular CLI. The target is to create such a good configurability for the CLI projects that there is no need to customize the Webpack configuration by hand. This allows the CLI developers to upgrade it as they wish without breaking anyone’s application. It shouldn’t matter for the developer whether there is Webpack, SystemJS or any other used behind the scenes as far as it does the job.
As you might already know, there is currently no support for Angular Universal within the Angular CLI. This is also going to change soon as there is going to be a switch called --universal for ng newcommand that also generates the Node.js server with universal rendering enabled, as told by core team member Jeff Cross. There is also an upcoming switch called --mobile which will let you for example add an app shell along with other stuff explained in the mobile.angular.io.
Angular Compiler
Angular compiler is essential piece of the Angular core. It provides the functionality to compile Angular applications into plain JavaScript that is then executed on the browsers. Compiler can be ran on two different phases. Either while loaded into the browser, or during the static build step. First approach, called JIT (Just-in-Time), is the one that was the only one available for long time during Angular 2 development phase. The another option, called AoT (Ahead-of-Time), was just recently finalized and is now available for usage in all projects. Running the compiler in AoT mode not only boosts the start-up time significantly but also makes it possible to leave the whole compiler module out of bundle sent to the browsers. Also, the unused parts of modules can be tree-shaken and dead-code eliminated out of the bundle thus reducing the size even further.
With these recent improvements along with the traditional minification and gzipping of bundles the size of the Angular hello world application is now only 30kB. This is absolutely awesome and overrules all the allegations of Angular 2 being too massive. As usual, this can be compared to the traditional arch enemy React whose bundle is over 30kB.
Besides the bundled size being that small there is also the other important factor related to the performance. This can be measured with deep tree benchmark where the baseline result is 1 and results are presented as folds to that. When looking into the results, Angular 2 is totally rocking it. Compared to the AngularJS the performance is already almost four times better with the score being 1.5 for Angular 2 and 5.7 for AngularJS.
But. The compiler guru Tobias Bosch isn’t quite ready yet. The target is to hit 10kB size for the hello world application and beat the baseline in the deep tree benchmark. Absolutely fantastic job on this too guys!
Reactive Programming
Angular 2 already makes quite some use of RxJS to do reactive programming. This has turned out to be really working way to structure the applications. Core team, especially Rob Wormald, isn’t still quite done with the usage of observables yet. There is multiple areas where this pattern can be applied even further. Also let’s see what is going to happen with the @ngrx/store (Redux equivivalent implementation with RxJS) gaining such a strong momentum at the moment. I most certainly hope to see these patterns applied even more in the future. Could be interesting to see the @ngrx/store as one of the core modules of Angular.
Progressive Web Applications (PWA)
Jeff Cross gave extensive introduction to the details of providing your app for mobile users. This comparison included the PWAs, hybrid solutions (such as Cordova & Electron) and native solutions (such as NativeScript). While other solutions aren’t that related to Angular 2 support, the main thing that was interesting to me was the PWA support already available. You can already do app shells, service workersand web app manifests while there is still more guides coming and support for universal returning to Angular CLI. To find out more on the topics mentioned above, check Alex Rickabaugh’s speach titledRescue your mobile experience!.
Electron Support
I’ve waited for long to finally test out Electron. Being motivated by Christian Weyer and Thorsten Hans talk One Code to rule them all: Cross-platform development with Angular 2, Cordova & Electronshowing how easy it is to build your Angular 2 app with Electron to run it as desktop application (supports Windows, Linux and Mac) I finally made it and generated my first Electron application. Turns out is really easy to get started and to even compile your application to binary. I’ll add another blog post showing the steps needed to get started with Angular CLI and Electron soon so stay tuned for that also.
Ionic RC0
Even though Ionic 1 wasn’t the top choice of everyone when building mobile applications, Ionic 2 looks really promising at this point. They’ve been collaborating with the core team actively and were able to ship the first release candidate during the night between the conference days! This release candidate contains already support for AoT which is essential to mobile applications. Other important pieces contain upgrade to Angular 2.0.0 and new build process. Check out the link above for more details!
Community
Last but not the least there is a single keyword community. What does it mean and why is that pointed out here along with all the technical stuff? This point made it to my blog post simply because of an excellent talk titled Why I am betting my future on Angular 2 by Shai Reznik in which he describes how the Angular core team has done such an excellent job on community building. The first and foremost reason for betting his future to Angular 2 is the core team. The reasoning behind this is the comparison to the decision that investors have to do when investing into start-ups whether the team can make it or not. In Angular 2 there is a great team behind it. Another keypoint is that Angular 2 is built from the basis of the most popular web application framework – AngularJS. There is already a strong community based on the amount of people visiting the documentation for AngularJS and Angular 2 (image below from Jules Kremer’s keynote from day 2). There was 623k visitors on Angular 2 documentation compared to 1.2M of AngularJS. That is a huge crowd taking into notice that Angular was just released few weeks ago. Having a strong community leads to following benefits: more projects, more use cases, more fixes, more potential developers. I’m really glad to part of this community!
Wrap-up
The Angular Connect 2016 was a total success. Besides learning so many valuable things, I also got great awareness of what is going to happen next with the platform. Also it was really eye-opening to see all the ecosystem built around the Angular 2 doing so well and I expect even more open source projects to come up. During the party there was also talk about organizing an Angular conference in Finland also. Let’s see if we can make it happen at some point. If you are interested in attending or even organizing it with us, please leave a comment so that we know it too :)
