A single-page application is a web application or web site that fits on a single web page. In SPA all necessary code is retrieved wit h a single page load. Resources can also load dynamically. The page does not reload at any point of processing. The control does not transfer to another page. Interaction with the single page app often involves dynamic communication with web server.
The term SPA was given by Steve Yen in 2005. Modern browsers that can parse HTML5 allow developers to replace the user interface from web servers with clients.
Some of the characteristics of SPA are:
Chunking- the webpage is developed by loading chunks of HTML modules
Controllers- the controllers separate views and modes using MVC
Routing- views and navigation are selected that preserves page state, elements
Logical storage- store data on a browser for performance
If user inputs are also bound to data, the SPA has two-way data binding, a concept known as AngularJS. Another way is to render the data using DHTMLX, Webix.
Various techniques that enable the browser to maintain a single page are as follows:
AngularJS is a fully client side library. Making templates in AngularJS is based on bidirectional UI data binding. Data binding is a better way of updating the view whenever the model changes. The HTML template is compiled in the browser. In the AngularJS framework, the controller is maintained within the client browser. Thus new pages are generated without any interaction with a server.
Websockets are a bidirectional real time client-server communication technology part of HTML5. It is superior to AJAX in performance.
Asynchronous calls to the server can also be achieved using browser plug-in technologies such as Silverlight, or Java applets.
Some SPAs can be executed from a local file using the file URI scheme. This gives users the ability to download the SPA from a server and run this file from a local storage device, without depending on server connectivity.