The Reinvention of Single Page Applications (SPA)
Single Page Application (SPA) solutions are experiencing a surge in popularity and quickly becoming the talk of the industry. Though far from new, these solutions have been matured with the emergence of client-side frameworks, like Angular and React.JS, and are being introduced into enterprise applications in new ways. For companies seeking to optimize performance levels, as well improve development speed, SEO rankings, and infrastructure, these solutions are too important to be discounted. However, when considering a SPA solution, it’s imperative to understand the reinvented solution and its inherent benefits and shortcomings.
A Quick History Lesson
In an effort to simplify the development and testing of Rich Internet Apps (RIAs), AngularJS was released in 2010, which introduced the concept of client-side Model View Controller (MVC). This advancement prompted organizations to rethink how they designed, resourced, implemented, and deployed their web applications. However, the early versions of these frameworks lacked the advanced capabilities needed for large-scale implementations and were consequently relegated to delivering small pieces of functionality like list sorting or multi-step form presentation. Since then, these frameworks have evolved into fully functional platforms, addressing not only the issues of their earlier uses but also some issues that hindered the success of traditional SPA solutions. Collectively, these advancements made it easier to integrate SPAs into an enterprise architecture stack while still being able to take advantage of previous investments in areas such as security, web services, and caching.
The Turning Point
With all the technical advances that have made SPAs a viable solution for IT, it is the way that these new frameworks manage the separation of content from presentation, and the corresponding SEO impact, that has really piqued the interest of Marketers. Traditionally, when search engines index pages on a site, they have to parse the underlying HTML to extract the different elements used for calculating the page ranking. Starting in 2018, Google, who is the primary contributor to Angular, has announced that they will begin boosting the rankings of SPAs that provide content outside of presentation, a move that should lead to better accuracy and consistency of rankings while pushing companies to focus on making content relevant and accessible.
Pros and Cons of Traditional SPA Solutions
After the initial migration, this shift continues to provide long-term benefits, including lower development costs, and reduced overhead and maintenance on back-end servers. It can also allow organizations to move to a more agile development and delivery model. Using a componentized, service-based approach, SPA solutions can focus on delivering the user experience asynchronously, allowing data-calls to focus on small, cacheable chunks of data or content for a given section, rather than waiting for an entire page to load. The ability to present content and data in these discrete chunks enables businesses to leverage data from many different repositories, for use across a variety of channels and customer touchpoints, under a single unified experience. By separating the presentation from the content and data, development teams can work at different speeds while still being integrated for the overall solution. This means that the presentation tier can be updated to meet business needs without having to wait for a full application deployment.
While these benefits certainly make SPA solutions appealing, traditional solutions models have a number of shortcomings that center on their interplay with Content Management Systems (CMS). When using a CMS, a SPA solution often inhibits the ability for contributors to use basic experience management features because the presentation templates are predefined. This forces the CMS into needing to support a “headless” model where content is managed within the CMS, but its presentation; colors, fonts, layout, targeting, and personalization; is defined outside of the system. For those seeking to leverage the full experience management features provided to them by their CMS – including inline preview features and personalization, amongst others – these solutions have been cumbersome, and a cause of discourse between marketers and IT teams.
With the development of new frameworks and the advancement of Google Search, truly functional SPA solutions that were once reserved for LinkedIn and Facebook can now be easily leveraged by any company or organization seeking to advance their management of multi-channel digital experiences. At Authentic, we are currently focusing on delivering the very first contributor-centric SPA solution based on Angular – enabling businesses to obtain the full benefits of SPA solutions, while retaining the full experience management capabilities provided for in a CMS. For those seeking improved development speed, reduced overhead and hardware costs, and a move to micro-services, SPA solutions should be seriously considered.