3

I'm learning about single page application and after read document itself

I wonder that single page application pattern is just one page(e.g: html page) in web application using knockout with external template?

I mean ( i'm using MVC ):

-mywebsite
 + some js files
 + some css files
 + index.html
 + controllers
 + models

I hope someone can explain for me more about this pattern.Thanks.

Jayantha Lal Sirisena
  • 21,216
  • 11
  • 71
  • 92
vietvoquoc
  • 813
  • 1
  • 10
  • 23
  • Refer http://stackoverflow.com/questions/3050869/architecture-of-a-single-page-javascript-web-application?lq=1 – Sridhar R Nov 06 '13 at 04:27
  • Project Silk - this could be helpful - http://msdn.microsoft.com/en-us/library/hh396380.aspx – aked Nov 07 '13 at 01:51

3 Answers3

5

Yes, you generally have a single HTML page that acts as a "shell" that has views of information loaded into that "shell". The JavaScript files act as the medium to call out to get this data, parse the data and apply templates to the data. Models, controllers, etc. allow for a module approach to the JavaScript structure, as opposed to spaghetti JavaScript code. CSS serves the same purpose as usual.

In my opinion, it is what pure AJAX applications were intended to be about 10 years ago, where a single page would load and then only requests to the server or services would load data, only performing partial page updates instead of posting back to the server to render (or re-render) the page (like WebForms does).

UPDATE:

The Single Page Application: KnockoutJS template incorporates KnockoutJS, but there are other options as detailed in Know a library other than Knockout?, which enumerates the features of each template in a grid for easy viewing.

Karl Anderson
  • 34,606
  • 12
  • 65
  • 80
  • Browser JS performance where not ready for Angular or KO 10 years ago though ;) – Anders Nov 06 '13 at 08:19
  • @Anders - yes, structurally JS performance was not there 10 years ago, but I was speaking more conceptually. I suppose we will look back 10 or 20 years from now and wonder the same thing, because of technology XYZ in browsers; just the nature of the beast. – Karl Anderson Nov 06 '13 at 12:03
  • Thanks all of yours! All of yours is right! I want to ask a little thing in this issue. Does anyone can show me all the javascript library that can help us create a SPA like Knockout and Angularjs ( Both of them that i learning ). I wanna learn more libraries! Thanks everyone. – vietvoquoc Nov 07 '13 at 13:44
  • @vietvoquoc - see `UPDATE:` in answer for a list of other libraries and templates that you can use. – Karl Anderson Nov 07 '13 at 14:17
3

Actually you can separate your application in to set of html files and java script files. What Single page application supposed to have is do all the application stuff without refreshing the browser. You can lazy load your views (html) and JavaScript whenever you need . I think you can start with a template or sample to get the idea of it. you can get more details from John Papa

Here are some frmameworks which supports SPA

http://durandaljs.com/
http://www.asp.net/single-page-application/overview/introduction/knockoutjs-template

Jayantha Lal Sirisena
  • 21,216
  • 11
  • 71
  • 92
2

A single page application typically provides a shell in the form of a single page that invokes ajax calls to provide functionality. The key idea is that the shell doesn't refresh as a full page, but rather the content is refreshed through ajax calls that target sub sections of the shell. One benefit of this model is that users don't have to deal with the disruptive user experience of refreshing the entire page and losing client side state.

Knockout can certainly be used as part of your design, but it's not directly part of the pattern.

TGH
  • 38,769
  • 12
  • 102
  • 135