04:26
Paragyte Technologies
With web pages becoming more fluid and offering rich interaction with the users, writing codes for such flexible pages presents a complex challenge to developers. That is because the more the elements on a page and more the states of interaction, the complex the code, and laborious its loading on the server side. Loading such huge chunks of code on the server and sending it back and forth according to user action greatly increases the loading time of the page and brings down performance, thus striking a blow to the very intent of creating a fluid experience for the user.
The Single Page Applications approach has emerged as the solution for this challenge. Simply put, SPA is an approach for building web applications that fit on a single page and yet provide a rich experience to the user. While traditional approaches for building web applications entail that a trip needs to be made to the server for every action, i.e. Opening a menu, selecting an item on the menu, etc. The SPA approach allows for an ability to redraw any part of the UI according to the user action, without requiring a round trip to the server. The resultant advantage is easy to discern – simple code, lesser load times, lighters and manageable applications.
While the approach might seem to sophisticated and mind boggling at first glance, a closer scrutiny will reveal that this is nothing but stringing together all the best practices of programming and application development. Writing maintainable code by utilizing standard mechanisms to their maximum potential is the primary USP of an SPA. Single Page Applications score over the traditional approaches on three fronts -
Architecture
While traditional architectures give more emphasis to DOM, in SPA DOM is only restricted to a write only mode, output-ing HTML and operations on elements. No data or states are stored in DOM. Instead a set of in-memory models are used to represent all the intermediate states and can be easily pulled up according to the user action. As a result managing the back and forth loading of states and data becomes much more manageable. Reducing the dependence on DOM also increases cross-browser compatibility.
Asset Packaging
Asset packaging helps in making an application modular, which in turns helps in faster loading and increased performance. Needless to say, assets that are correctly packaged are easily manageable and testable compared to random pieces of codes.
Run Time State
The SPA approach provides greater visibility into the run-time state of an application, since the distance from a HTML event to your event handler is shorter. There is also reduced level of detailing associated with the URL, so that the URL supports one primary activity and the rest of the secondary activities are reset to default on page load. This helps in increased support of bookmarks.
There are quite a number of frameworks prevalent today that support the SPA approach. Prominent among them are -
Lean Approach
In a nutshell, Single Page Application is a amalgamation of all the good things about coding web applications, and a way to make website more user-friendly and awesome, while still keeping the coder's life easy. This approach is but the outcome of numerous iterations of solving the same problem, and choosing the single golden way from the process. The approach is still in its nascent stages of catching on, but with the number of developers adopting it, SPA is definitely the way to the future.
Resources:
The Single Page Applications approach has emerged as the solution for this challenge. Simply put, SPA is an approach for building web applications that fit on a single page and yet provide a rich experience to the user. While traditional approaches for building web applications entail that a trip needs to be made to the server for every action, i.e. Opening a menu, selecting an item on the menu, etc. The SPA approach allows for an ability to redraw any part of the UI according to the user action, without requiring a round trip to the server. The resultant advantage is easy to discern – simple code, lesser load times, lighters and manageable applications.
While the approach might seem to sophisticated and mind boggling at first glance, a closer scrutiny will reveal that this is nothing but stringing together all the best practices of programming and application development. Writing maintainable code by utilizing standard mechanisms to their maximum potential is the primary USP of an SPA. Single Page Applications score over the traditional approaches on three fronts -
Architecture
While traditional architectures give more emphasis to DOM, in SPA DOM is only restricted to a write only mode, output-ing HTML and operations on elements. No data or states are stored in DOM. Instead a set of in-memory models are used to represent all the intermediate states and can be easily pulled up according to the user action. As a result managing the back and forth loading of states and data becomes much more manageable. Reducing the dependence on DOM also increases cross-browser compatibility.
Asset Packaging
Asset packaging helps in making an application modular, which in turns helps in faster loading and increased performance. Needless to say, assets that are correctly packaged are easily manageable and testable compared to random pieces of codes.
Run Time State
The SPA approach provides greater visibility into the run-time state of an application, since the distance from a HTML event to your event handler is shorter. There is also reduced level of detailing associated with the URL, so that the URL supports one primary activity and the rest of the secondary activities are reset to default on page load. This helps in increased support of bookmarks.
There are quite a number of frameworks prevalent today that support the SPA approach. Prominent among them are -
- Backbone.js
- Agility.js
- Stapes.js
- Epitome
- Kendo.UI
Lean Approach
In a nutshell, Single Page Application is a amalgamation of all the good things about coding web applications, and a way to make website more user-friendly and awesome, while still keeping the coder's life easy. This approach is but the outcome of numerous iterations of solving the same problem, and choosing the single golden way from the process. The approach is still in its nascent stages of catching on, but with the number of developers adopting it, SPA is definitely the way to the future.
Resources:
