It’s a question every developer faces when creating a web product: use emerging technologies and build a single-page application, or stick to the traditional route of a multi-page concept? The answer has implications in terms of cost, complexity, flexibility and, perhaps most importantly, user experience.
Over the past 5 years, the team here at Handsome has built dozens of web applications. They all vary in size, complexity and purpose. During this time the world of web application development has divided into two categories: single-page applications (SPAs) and multi-page applications (MPAs). Let’s start with some simple definitions.
The multi-page application (MPA) is the traditional way of building web applications. In an MPA, every attempt to display data or submit data back to the server requires a request of an entirely new page that is then rendered in the web browser. With the introduction of AJAX, it became possible to refresh only parts of the page, rather than the whole page. As a result, user experience improved dramatically, although technical complexity increased as well.
“So why not build every site as an SPA? That depends on the goals of your business and the purpose of your site.”
The web experience we created for Walsh, an innovative master-planned community in the Dallas/Ft. Worth area, is a good example. Here you can see the elegant transitions that are possible in an SPA.
So why not build every site as an SPA? That depends on the goals of your business and the purpose of your site. Let’s take a look at the advantages and disadvantages, to show you how we decide here at Handsome.
More control over the user experience. Very often, this is the determining factor. With an SPA, you are no longer dependent on how the browser behaves when it loads new pages, or when certain action are performed within the page; rather, you, as a creator, control the way browser behaves when it makes requests for new content, when it receives new content or when it interacts with the user. A majority of award-winning websites and applications are built as an SPA precisely for this reason.
Lighter request load. An SPA makes fewer resource requests in general. But even more importantly, since the browser doesn’t load every page from scratch the requests made can be much lighter than in an MPA.
Less server-side load. Instead of generating pages for thousands of users, the server only transmits the necessary pieces of data – and the browser on those thousands of machines generates the front end. With the capacity of modern day computers and mobile devices, and as long as the application is programmed properly, users will never see any slow-downs in the experience. In fact, it’s quite the opposite: because the server isn’t overloaded anymore, it responds to the browser’s requests much faster!
Ability to use existing APIs. If you already have a mobile application that is communicating with the API on server side, more often than not you can use the same API in an SPA, with no or minimal adjustments to it. And if the mobile application is in the planning stages, creating an API for an SPA will save time later on.