Meta Refresh 2014

On the construction of user interface on the web

Oh, I want a SPA | Building efficient, performant & awesome Single Page Applications

Submitted by Om Shankar (@omshiv) on Wednesday, 23 October 2013

Section: Full talk Technical level: Intermediate


Gabbar: Kitne page the Samba?

Samba: Ek Sardar, sirf Ek !!

Single Page Applications are representing the web today, giving meaning to the phrase "Web as Application". Not just startups who build dashboards for their products, even Web companies like Amazon and Adobe have a suit of single page apps used internally.

In this talk I will be focusing on design principles and architecture of SPAs while starting from Scratch, technologies involved, structure, tooling & testing, workflow, etc.

I will also try to show that core JavaScript developers are pretty much efficient in implementing better designs. An intelligent Frontend developer is at least an average natural UI Designer too


So as to let the choice of tool stand on developer, following topics will be more workflow/process oriented.
They represent the things to be done while creating a SPA, without focusing on which library or piece of code to use for the same:

  1. Shifting to Client side - What's a SPA? UI as just another Client
  2. Step 1 - Building a Shell
  3. Step 2 - Building features (Modules, Fractal MVC, Anchor Interface)
  4. Step 3 - Clientside modeling and Data, going Offline, and then Wiring up with Server
  5. Step 4 - SEO and Authentication
  6. CSS (OOCSS & BEM), HTML & JavaScript Design considerations
  7. UX (Experience) Considerations. Responsiveness, Elements, Animations and Feedback.

Important Useful Links:

  • The Demo App - Built on Backbone.js, that allows you to drag drop images from Desktop, apply filters, create albums, write stuff, etc. - all from a Single Page. This app is a work in progress, to be completed before conference
  • Slideshow Link coming soon...
  • More links if any, will be added soon ...


  • A device with a beautiful screen where you can see a sample Single Page Application I will be demo-ing. (13", 1280 x 720; lesser specs = you miss out)

Speaker bio

I am a JavaScript and Front-end fanatic; but have been forced to work on RoR, Python, PHP and Java backends, at companies like Adobe, WalmartLabs and Amazon
I have managed to take a good stand on Frontend again by delivering awesome single page products consumable in the browser.

I love writing algorithms and artificial code level intelligence, and I like designs and aesthetics too, the latter I feel shy to admit.

However, a good design encompasses all, it's how "it performs", as said by hon. Steve Jobs. Hopefully, I will try to bring feel of it in the talk.




  • Kiran Jonnalagadda (@jace) Reviewer 5 years ago

    Om, I’m with Jitendra in thinking your talk is better off as a workshop since you’re capable of going into a fair bit of detail. Harish has a similar talk with a well known public website as his case study, so he has a stronger case for selection as a talk.

    • Om Shankar (@omshiv) Proposer 5 years ago

      I think you are right. But I have only “talk” material. Will have to prepare for workshop as well.
      Fine, it wouldn’t bother me if you are going ahead with Harish’s prop. Would be looking forward to his talk then.
      Also, let me see if I can convrt this to a workshop. If not, I would propose for JSfoo 2014. :)

  • Jitendra Vyas (@jitendravyas) 6 years ago

    it seem more suitable to JSFoo.

    • Om Shankar (@omshiv) Proposer 6 years ago (edited 6 years ago)

      I will be talking about design guidelines and principles, UX, technology and other considerations. JavaScript is very less here.
      That said, feel free to suggest modification. I could not make up my mind as to what to write here :)

  • Jitendra Vyas (@jitendravyas) 5 years ago

    Hi Om, Even if this talk is not much about JS but still seems there is too much to cover in 40 min. Would you be able to covery everything you mentioned?

    • Om Shankar (@omshiv) Proposer 5 years ago

      Yup. you are right. I am trimming it down to focus on Single Page Application design only.

  • Jitendra Vyas (@jitendravyas) 5 years ago
    • Om Shankar (@omshiv) Proposer 5 years ago

      LOL. Harish himself. I don’t stand a chance in front of him.
      But this is cheating, I posted before him :)

      • Jitendra Vyas (@jitendravyas) 5 years ago (edited 5 years ago)

        <p>Yes you posted before :-) I’m just saying that it seems both talks are about making “Single page app”</p>

Login with Twitter or Google to leave a comment