Here is one of the rare occasions when, unlike in the movies, the sequel is actually better than the original. Angular 2, the latest iteration of the AngularJS open source web application framework developed and maintained largely by Google, has made significant improvements in extending HTML for developing modern web, mobile and desktop applications. The goal is to make a web application framework that stays within the constructs of building dynamic web software as opposed to just a web page.

“Angular 2 aims to be one framework for mobile and desktop, by incorporating other emerging technologies for building native mobile and even native desktop applications with HTML 5 technologies. The same concepts are there from Angular 1. But it has been completely rebuilt with a lot of new features,” said James Dickman, TDK Technologies Web & Mobile Team Lead. “Angular 2 is trying to pull all these things together and to put some structure around it.”

How Angular 2 Arrived on the Scene

At the beginning of the world wide web, about the mid 1990’s through the mid 2000’s, JavaScript was introduced to do simple tasks on web pages. It was the industry norm.  Using simple logic, a browser would request a web page. But the server would be in control of almost everything. It would gather data from the database, apply its business rules, construct the HTML page, and return the page back to the browser.

“That worked great for very simple pages. If you needed a different page or new data, you had to make another request and the process would start all over again. It would essentially have to recreate the web page every time you wanted to see something different,” Dickman said.

But as web pages became more complicated, technology had not advanced to the point where user experience would be satisfactory. In fact, the experience was very slow. In 2005, the emergence of AJAX allowed for the use of a series of widgets on a page to request new data without requiring the entire page to reload. That made it easier to bring the pages to life and allow more interaction with them.

“That concept led to the rise of Rich JavaScript web apps between 2006 and 2010 with the ability to essentially recreate entire web pages without ever interacting with the server,” Dickman said. “It allowed programmers to decouple web applications from servers. The approach made web applications much more responsive. But it was done using a tool (JavaScript) that was not originally intended for this job.” Libraries like jQuery provided APIs which greatly improved JavaScript web apps, but still fell well short in making JavaScript a first class tool for building software for the web.

More structured frameworks, like Backbone.js and Sencha’s ExtJS, began to appear in 2011 to develop web applications. All of them had limitations which sacrificed flexibility, among other things. AngularJS then emerged as a new framework that provided enough structure to create single page, full-featured, web applications. It permitted the client to be decoupled from the server, so developers could focus on the user without being hamstrung by server-side technologies. It kept HTML at the forefront while providing a framework for flexible design alternatives.

“When we started working with Angular we were amazed how much more productive we could be. It was easier to build applications compared to other frameworks that don’t utilize the best of what HTML has to offer,” Dickman said.

Many applications written with Angular 1 didn’t take advantage of the fact that it can actually behave like a mobile application; most developers used it only as a thin presentation layer. Many Angular 1 applications still relied heavily on the server to maintain the state of the application.

“We are seeing the ability to leverage HTML 5 for mobile and desktop applications with Angular. But there wasn’t structure around how to make it happen to a far greater degree,” Dickman said. “That is where Angular 2 has impact.”

The All-platform Benefits of Angular 2

Angular 2 moved the framework in the direction of developing apps for all platforms -  web, mobile web, native mobile and native desktop - using HTML 5. It is a single page JavaScript application framework that works best with the server through web services. It allows developers to build truly cross platform, enterprise grade software.

Prior to Angular 2 it was up to the developer to figure out a way to use the framework on various platforms. Angular 2 pulls all of that in and applies some structure and conventions to more fully take advantage of the possibilities. If done properly Angular 2 has an enterprise-grade software architecture and structure that includes these elements:

  • Unit and end-to-end testing
  • Build and automated task running
  • Modular architecture, which is encouraged
  • Object Oriented Programming using TypeScript, which is encouraged

“It provides the best of both worlds with best quality practices from server-side frameworks and the portability of HTML5 technology. It delivers responsive, fast and excellent user experiences,” Dickman said. “With Angular 2 the application can be written once and deployed everywhere. Plus, it’s easy to maintain and very flexible.”

The focus on modular architecture, reusable components and common building blocks at the Angular core permits developers to focus on business-specific logic rather than reinventing the web application wheel. Angular 2 can maximize productivity simply be extending HTML in a way developers and designers understand, without abstract server-side template syntax. It uses clean, powerful HTML that can be easily incorporated into responsive layouts and styled.

  • Angular apps provide the benefit of writing apps within a convenient framework that generates code optimized for the JavaScript runtimes in modern browsers.
  • It delivers optimal performance, regardless of the back-end technology.
  • The component router only loads the parts of the app needed to render the view with which the user is presently interacting.

“You get to focus on the features of the application rather than figuring out how to deploy it on all those platforms. As a result, the app can get to market much faster than if you had to build it for each native use. That’s a big advantage,” Dickman said.

The way the framework is structured and how it leverages well-known web technologies makes it easier for organizations to build a core competency around Angular. It extends and enhances traditional web development while making it more like software development. To learn more about how Angular 2 could be an option for your next web application, contact TDK Technologies.

An IT pro who'll take the time to learn my business. Is that too much to ask?