Presentation is loading. Please wait.

Presentation is loading. Please wait.

Vineel Vutukuri. What is SPA? Why SPA? Pros & Cons When to use SPA?

Similar presentations


Presentation on theme: "Vineel Vutukuri. What is SPA? Why SPA? Pros & Cons When to use SPA?"— Presentation transcript:

1 Vineel Vutukuri

2 What is SPA? Why SPA? Pros & Cons When to use SPA?

3 What is SPA? Single-Page Applications (SPA’s) are web apps that load a single HTML page and dynamically update that page as the user interacts with the app. In SPA data is separated from presentation, It often includes templating, Ajax, Routing.

4 Why SPA? Reach: You want to reach wide audience across many devices and in variety of browsers Rich User Experience: Supports rich interactions with multiple components on a page, and by keeping pages moving fluently because of client side navigation. Single page apps are distinguished by their ability to redraw any part of the UI without requiring a server roundtrip to retrieve HTML. Reduce Roundtrip: It makes less trips between the client and server and less post backs to the page.

5 Dis Advantages of SPA:  These are complex to develop when compared  Client must enable JavaScript, Single Page Application build with JavaScript, So JavaScript should be enabled in client browser  Download all the content at initial page load  SEO considerations:- Indexing the all pages

6  Broken Back Button: Browser does not Store the state, Browser stores only URI  Cross-site scripting (XSS): Single Page Application is less secure because it enables attackers to inject client-side script into web pages

7  Memory Leak: Memory leak in JavaScript cause system to slow down.  Scroll History Position:- The position of scroll bar changes when we navigate between the pages

8  Analytics: We cannot keep track of page views, hits etc. These should be handled with extra script triggered by app router

9  Error Tracking: It is difficult to keep track of errors while using SPA.

10 Advantages of SPA:  Ability to go offline  Application like Interactions.  Fluid transitions between states. Richer Interaction between Ui components  Data Transfer is less (Only XHR requests).  Queries are lesser than traditional web pages.  Less load on server, Load is distributed to clients. Network latency is drastically reduced  Transition between the views is quicker.

11 When to use SPA?  SPA is a lean server, fat client app  SPA are not recommended for highly secure applications like banking, because when you depend on client, HTTP protocol can be easily manipulated.  SPA are recommended mainly for simpler workflow and where the usability, visualization plays a key role than security.

12 Architecture Of SPA:

13 Frameworks which can be used to build SPA:-  Backbone.js  Ember.js  Angular.js  Knockout.js  Angular.js Few SPA  http://www.innowhere.com/jnieasy/#!st=jnieasy_home http://www.innowhere.com/jnieasy/#!st=jnieasy_home  https://www.madewithangular.com/#/ https://www.madewithangular.com/#/  https://www.godaddy.com/

14


Download ppt "Vineel Vutukuri. What is SPA? Why SPA? Pros & Cons When to use SPA?"

Similar presentations


Ads by Google