Load Testing Single-Page Application (SPAs)

A Single-Page Application (SPA), also sometimes referred to as a Single-Page Interface (SPI), is a web application or website that “fits” on an individual page and updates the page dynamically, rather than loading a new page.  The main benefit of SPAs is that they provide a more reactive and smoother user experience.  The SPA concept has been around for over 15 years, but only in the last few years has gained traction. Advancements in technology and frameworks have made SPAs a real possibility for developers and organizations.  Web browser JavaScript frameworks, such as AngularJS, Ember, Ext JS, Knockout, React, and Vue all support SPA principles. Some of the largest companies in the world use SPAs, including Google (Gmail), Netflix, Facebook, Trello, and Twitter.

Multi-Page Applications: A Quick Summary

Most websites and applications operate in the following manner:  A user accesses the Internet via their browser, and they type in a web address. When that happens, the browser sends a request to the server asking it to send the homepage.  Once the page loads, the user navigates through the page, creating additional requests for the server. Any actions, such as clicks or searches, result in another page request. This method, known as Multi-Page Application (MPA), has been how the majority of websites and applications are built today.

Single-Page Applications: The Next Big Thing

Testing Page Applications
Single-page applications on the other hand, use a completely different approach.  To a normal user, they may not even realize the difference. If they’re paying attention, they’ll notice that their refresh button in the browser doesn’t reload once the initial page loads.  With a SPA, the browser downloads, saves, and runs a JavaScript program behind the scenes, in an instant.  It’s a complete application, as if the user downloaded and installed an application on their computer, but only this time, it’s in their browser.

Once this application is running, the page doesn’t need to reload again. The program controls everything the user sees and communicates with the server, if necessary.  Again, the page is not actually reloading, just some parts of the DOM change.  This saves a lot of bandwidth, time, and most importantly, gives the user a more fluid experience. Additionally, after the SPA has loaded, it can generally run in the browser when no Internet connection is present.

MPAs vs. SPAs:  Advantages and Disadvantages

This sounds great, right? So how can there be any disadvantages to SPAs? Well, as with anything in life, there are some, and we’ll cover a few of them here.

  • SPAs encounter issues with SEO.
    • SPAs load content on the page asynchronously, meaning that the data updates in the application without refreshing the page  SEO crawlers do not like this because they depend on JavaScript. With a SPA, once the page loads, the crawler’s work is complete.  The crawler agent doesn’t know that the data changes as a user navigates through the page, and eventually, that data renders on the page.
  • SPAs cannot run without JavaScript.
    • Most pages have JavaScript on, so it’s not an issue, but if JavaScript is off, your page won’t function.
  • SPAs tend to favor modern browsers.
    • This can be a limitation if you’re trying to utilize as many browser versions as possible for your application.  You may find yourself in a position where it’s not supported.  MPAs would be the better option here, and consequently, would have more existing frameworks and best practices to pull from.  As a new developer, this makes it much easier to work with MPAs.

Conclusion: What is the Best Option for Load Testing SPAs?

As you can see, you need to consider the goal of the application before deciding to go with an MPA or SPA. If your site can be developed as a single-page experience, a SPA is probably the way to go. If you have an online shop with multiple categories and lots of content, for example, MPA might be the better option.  Whatever you decide, before any of your applications get put into production, various testing methods, especially load and stress testing, must be executed to ensure the user experience is as seamless as possible.The goal of SPAs is that they can provide a responsive, feature-driven user experience.  To make sure the development work that goes into creating a SPA doesn’t go to waste, it’s critical that your SPA be load tested to ensure a first-rate user experience under production-like load.

The LoadView platform can test SPAs the same way you would for any other web application and also supports many other protocols and technologies.  Script the user experience and spin up virtual users to perform those tasks under load, in real browsers, ensuring your customer’s get a great experience.  Other load testing tools on the market, such as BlazeMeter and Flood that user JMeter, aren’t great at load testing SPAs because JMeter is NOT a browser and works at the protocol-level and unable to execute JavaScript. Yes, there are workarounds, but that requires more time and resources, even with a skilled engineer or developer.  It’s not as straightforward or easy as using a solution like LoadView.