KualaLumpurJS: Javascript SPA (Single Page Application)

This deck discusses the historical development of SPA (Single Page Application) of Javascript, the problems that arise with it, and the alternatives to consider.

Transcript

1. What is a SPA?
2. TM Lee @tmlee github.com/tmlee
5. Single Page Apps
8. Applets Web 2.0 DB Server Early 90s Early 2000s 2010s... Early Web
9. What is a SPA? “Web app that loads only once in a browser.”
10. Why would anybody want a SPA?
11. Why would anybody want an SPA?
12. How do I build a SPA?
14. How do I build a SPA? Load all necessary JS code at the beginning of the app Pull content from the backend via an API Content gets updated dynamically JS Frameworks Backbone AngularJS MeteorJS Ember ReactJS
15. This is fantastic, SPA is great, let’s build it! Not so fast. SPA has its shortcomings.
16. What are the shortcomings of a SPA?
17. Once you start building a SPA that emulates a multi-page website, you’re suddenly jumping through hoops that the browser/HTML previously gave you for free - freyr, HN News SPA is a total b*tch to do user activity tracking and quirks and glitches just never end. - gesman, HN News I’ve seen plenty more of SPA’s become an unmaintainable spaghetti nightmare and also seen many non-SPA’s work splendidly. - voidr, HN News
18. What are the shortcomings of a SPA? • Code Structure • Navigation • Object State • Event Firing • SEO • Analytics • Automated Testing • Cross Browser Compatibility
19. What can we do?
20. Figure out if you really need a SPA?
21. Can you afford it?
22. Use an Isomorphic JS Framework
23. Standard Document Webapp + JS
24. Ruby on Rails + PJax/Turbolinks
25. Summary • SPA offers “native-like” and speedy user experience • SPA is a complex topic • Execute according to the need of the product!