Deconstructing Single Page Applications at CodeMash

Article summary

In such a rapidly changing industry as the web, we can’t be expected to keep track of everything that’s going on. But by taking a few minutes to look around and see what the other approaches are, it’s easier to stay on top of the technology as it evolves and grows. This has certainly helped me to be a better web developer and make more educated choices about the pieces of it I choose to invest my time in.

A few weeks ago at CodeMash, I gave my first ever full length talk: Deconstructing Single Page Applications (SPAs). I’ve worked professionally in BackboneJS, AngularJS, and EmberJS. And I really enjoyed taking this opportunity to use my experiences to talk about what it’s like to write code in different frameworks and how SPAs as a whole approach web application problem solving.

Making a feature-based comparison and talking about how each framework handles the basic SPA problems of routing, controlling and event handling really gives each framework a chance to showcase the differences between them.  It also helps us characterize the bigger picture of SPAs and better understand how they work as a whole.

I think the most telling comparison is the router, which is how a SPA knows which page of the application to display.

  • A Backbone router has no opinions; it leaves it completely to the developer to decide what should happen when a route is hit.
  • An Angular router, however, wants to know what controller and what template it should load, which shows Angular’s focus of treating the UI layer as a first class citizen.
  • An Ember router requires a lot of knowledge of Ember convention, and is the most powerful yet most complex of the three.

Taking a look at the code is a good way to see this firsthand and really start to understand the advantages and disadvantages from a technical standpoint. Also, taking a closer look at other frameworks is a good way to understand more about a framework that you already know, and what it is or isn’t already doing for you.

Looking forward at the Angular 2.0 and Ember 2.0 roadmaps and at the big splash ReactJS has made in such a short time is also a really fascinating glance into how quickly the single page application landscape is changing, and what kinds of things we can look forward to working with in the future (components, anyone?).

speaking at codemash

Abstract

The modern web has introduced new demands for performance that cannot be met solely on the server side, and Single Page Applications (SPAs) have rushed in to meet those demands. The SPA universe is full of choices (Backbone, Angular, Ember and more). What sets them apart, and how do you choose one? They all address the same problem set: rendering, routing, data-binding, event handling, composability and others. By dissecting how different frameworks approach these problems, we can investigate the quirks that set frameworks apart and gain a more intimate understanding of the SPA architecture itself. For beginners, ninjas and anyone in between, this talk can guide you further in the search for SPA enlightenment.