Single Page Applications (SPA) in AEM

What is Single Page Applications - SPA?
Single Page applications are pages that dynamically update its content using AJAX calls to create a fluid & responsive experience.

In traditional applications, each request reloads/renders the HTML; but in SPA all interactions happen through AJAX calls. The return data is in JSON format. Previous versions of AEM had a miss on the SPA but with upcoming releases, AEM SPA Editor provides a wonderful solution for supporting SPAs within AEM.

Single Page Applications - Features
· This avoids page reloading.
· Reusable Content.
· Majority of the work happens in the client-side.
· Good separation between content and UI
· Provides interactive experience
· RESTFul JSON

SPA(Single Page Applications) Basics
The below image gives an overview of Single Page Applications in general.
As mentioned, only the first request is responded with a complete HTML. Further requests are made in AJAX way to the server and the response is provided in JSON format.


SPA with AEM.
The latest AEM releases are enabling users to develop Single Page Applications using AEM. AEM SPA Editor allows users to author a page with Content Fragments in addition to other normal components like title, footer, images, etc, and AEM Sling models generate the Page equivalent JSON. This RESTFul JSON can be made available for other SPA frameworks like Angular React etc.


In upcoming posts, I will explain, how to create a SPA in AEM.