Simplicity is one of this year’s main trends in web development and design. And a single page application, or SPA, is one of the ways you can stay simple. SPAs combine minimalistic and smooth mobile-like user experience with high performance and outstanding load speeds.
A single page application is a web app with all the website content on a single page. An SPA doesn’t reload when you click a button. Instead, it displays the content you’ve requested on the same page.
Think of Gmail, a classic example of a single page app. You can create a new email, switch to a draft, or send a message in Hangouts without leaving the page or loading another one.
And what about your Facebook feed? You can scroll it forever and it will continue to display new posts. You can chat with someone, check out who is currently online or check your notifications – the page won’t change.
Single page applications have many advantages, and we’ve discussed most of them in one of our previous articles. But distrust in this technology is still a big issue because of certain limitations to SPAs.
Issues with SPAs. Why the doubt?
We have comprehensive experience with SPA development, and we confidently argue that every SPA issue can be solved. So, let‘s get acquainted with the dark side of single page apps. Don’t worry, it won’t turn out too dark in the end.
Longer web app loading time
Single page applications strongly depend on client-side code, since it is fully responsible for everything we can do in the app. Connection with the server is established only to obtain extra data. Everything else is done in the frontend.
This may lead you to a logical conclusion – an SPA’s client side code must be more complex than for a multi-page application. This may cause issues for the initial website load when all this code is downloaded to ensure later smooth use and quick interactions.
We’ve already mentioned that an SPA takes a bit longer to launch initially, and complex frontend code may increase wait times.
That’s why it’s crucial to keep your single-page app fast. 40% of visitors leave your website if it takes longer than three seconds to load – that’s what the statistics say. If you feel like your SPA is in danger – check out the methods for increasing website speed.
Search engine optimization is important since it helps potential users discover your website. But optimization of a single-page application works a bit different from a traditional page.
Search engines couldn’t crawl apps based on AJAX interactions with servers for quite a while. This meant Google or Yahoo couldn’t get the information from your website to properly rank it in the search results list. As a result, a lot of single-page applications were left behind by search engines and rendered unfindable by potential clients. But there’s no longer anything to fear.
In 2009, Google suggested a solution to make AJAX based apps crawlable, and that did its job well until October 2015, when it was deprecated by the issuer.
If you are aware of the main principles of search engine optimization, you’ve probably guessed that a single page can rank higher because there are more opportunities for inbound links.
Inbound links are an important ranking factor for Google. Multi-page websites may link a lot to different pages inside the website, and this means the authority of the website is divided between multiple pages. But, for a single-page app, all sources link to a single page, and the website ranks better.
Even though SPAs didn’t use to be a good solution for SEO-dependent websites, those times are now gone. When you follow all the tips for technical SEO, single-page apps can consistently outrank their multi-page competitors.
But the situation has changed dramatically. Today, almost every device can execute JS files, modern adblockers successfully fight annoying popups, and progressive antivirus software protects computers without the need to sacrifice anything.
At the end of 2016, Blockmetry published fresh statistics on JS disabled internet traffic. The company claims that only 0.2% of users worldwide have JS turned off in their browsers. The numbers vary depending on different regions. In Taiwan and China, for example, the average percentage is higher but still low, at 2.3% and 1.9%.
So, if your project targets an Eastern Asian market, you might want to think twice before implementing an SPA. There’s a danger that 1 in 50 users won’t be able to access your website.
Linking to the current page state
One of the main reasons users fear SPAs is their perceived inability to share a link to something they currently see on the screen. Link sharing works perfectly with multi-page websites, where you can link to any page without any issues. But in SPAs, this can prove an issue, since there is only one single page and all page states are displayed under one link.
Users are used to sending links to friends and colleagues or bookmarking pages to open later. Single-page apps seem to undermine this behavior.
But this problem can be solved. SPAs can work perfectly with deep links. They are used to link directly to a piece of content on a given page. To implement deep links for AJAX, the “#” or a so-called “hash” is used. The initial aim of a hash is to link to the anchor tag on the same page, which usually refers to subtitles.
As a result, website visitors will be able to save a particular page state as a bookmark or share the direct link.
As you can see, single page apps aren’t faultless. However, all their issues are minor and can be easily solved with the right approach.
Have you faced other disadvantages when developing or using an SPA? Don’t hesitate to share your experience in the comments below. We will happily update our article with new information or insights.
Thinking of developing your website as an SPA? You can discuss all the benefits and drawbacks of this approach with our manager. We will help you make the right decision!