Oracle Commerce as a Single Page Application

Gerald Heath, Ecommerce Development Director, Lakeshore Learning Materials
December, 2016

Oracle released the Commerce Store Accelerator (CSA) with Orace Commerce version 11.2 release. This provides an extensible template for building your site as a Single Page Application (SPA). For those of you who are not familiar with this concept, think of it as way of dynamically updating a web page using AJAX with the advantage being you only update data the sections of the page which have changed.

By way of typical example, if you had a simple website which consisted of 3 sections: Header (static), Main Content (dynamic) and Footer (static). In the traditional Oracle Commerce application using JSP templates every click results in the entire page reloading with some disadvantages as a lot of the same data is regurgitated with every request, in our example the header and footer are reloaded even though they are static. In a SPA only the section which is changing is loaded, in our example the only section which changes is the main content section, resulting in efficiency gains as the amount of data requested from the application servers is significantly reduced.

This approach has a number of additional benefits to this approach:

  • Web Services Architecture. It relies on calling the Oracle Commerce REST web services making it more flexible and is much more aligned with a modern commerce micro-services architecture.
  • Experience Manager and Endeca. It is an excellent fit for the page templates and cartridges which are managed in XM.
  • Improved Performance. The reduction in amount of data transfer and the number of requests should result in a boost in the overall application performance.
  • HTML over JSP. Many of the underlying page fragments can be built in pure HTML rather than as JSPs which means that your page developers are able to focus on what they know best – HTML, CSS, and Javascript.

Some potential gotchas with this approach:

  • SEO and search engines. Many of the search engines do not support Javascript and will not be able to index your site if it is built as a SPA.  Thankfully, CSA provides a solution to this and provides components for rendering your sitemaps and web pages as static html.  This has huge advantages over the traditional Oracle Commerce approach as it allows you to host these pages on your web servers and also allows you to segment your customer traffic versus the search engine traffic.
  • BCC and XM Preview. If you create a completely custom SPA in Oracle Commerce you will have to also build custom preview functionality to support previewing content in the BCC and XM.  Again, CSA provides modules to enable the preview content from BCC and XM
  • Imposed Security Restrictions. There are some security limitations imposed on Javascript relating to the same origin policy and Cross-Origin Resource Sharing (CORS).  In a nutshell this means that your entire website should be served up securely over HTTPS as switching between secure and not secure in a SPA is a non-trivial task.  It also means that accessing data hosted on different domains is a lot more challenging.

One big take away is that the CSA solves a lot of headaches you might encounter when implementing a SPA in Oracle Commerce, and we highly recommend that you consider using this as the basis for your implementation. The Oracle Developer Documentation is excellent and talks you through all the major considerations, including providing how to customize and extend the base CSA application.

Oracle Commerce as a Single Page Application