Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED
Progressive web application vs Single page application in AEM
1 Accepted Solution
Correct answer by
A PWA is almost always a SPA.
SPA, a Single Page Application, means that the web-page has not been developed in the traditional way. The browser is not sending a request to load the whole new page when user clicks a link, but instead uses JavaScript to manipulate current page and making it look like the user has navigated away. They are typically developed using a framework such as Angular or a library such as React.
PWA, a Progressive Web Application, is a term coined by Google recently, and it’s more of a mindset than a technique. It doesn’t have a specific definition and different people mean different things when they say PWA. The most commonly referred feature, though, is usage of service workers which makes it possible for the application to be available offline. However, it doesn’t stop there: you also need to use HTTP, make the user experience smooth on mobile, work cross-browser, enable SSR, etc. Check out Google’s PWA checklist for more. A Single Page Application (SPA) can be a Progressive Web App (PWA) but a PWA doesn't need to be a SPA. They are two different things. A PWA as defined by Google is:
Reliable - Load instantly and never show the downasaur, even in uncertain network conditions.
Fast - Respond quickly to user interactions with silky smooth animations and no janky scrolling.
Engaging - Feel like a natural app on the device, with an immersive user experience.
The Google PWA site is a good place to start learning about PWA and why and how you would build one.
https://developers.google.com/web/progressive-web-apps/
Properly combining the principles of PWA and SPA can result in a much improved user experience especially on mobile phones with unreliable internet connections.
Probably the best example today of a well implemented PWA is Twitter Lite. Check it out here:
https://mobile.twitter.com/home
...and read about it here:
https://blog.twitter.com/en_us/topics/product/2017/introducing-twitter-lite.html
Neither is “better”. PWA definitely offers more features, but it also requires much more time spent during development.
Arun Patidar
Correct answer by
A PWA is almost always a SPA.
SPA, a Single Page Application, means that the web-page has not been developed in the traditional way. The browser is not sending a request to load the whole new page when user clicks a link, but instead uses JavaScript to manipulate current page and making it look like the user has navigated away. They are typically developed using a framework such as Angular or a library such as React.
PWA, a Progressive Web Application, is a term coined by Google recently, and it’s more of a mindset than a technique. It doesn’t have a specific definition and different people mean different things when they say PWA. The most commonly referred feature, though, is usage of service workers which makes it possible for the application to be available offline. However, it doesn’t stop there: you also need to use HTTP, make the user experience smooth on mobile, work cross-browser, enable SSR, etc. Check out Google’s PWA checklist for more. A Single Page Application (SPA) can be a Progressive Web App (PWA) but a PWA doesn't need to be a SPA. They are two different things. A PWA as defined by Google is:
Reliable - Load instantly and never show the downasaur, even in uncertain network conditions.
Fast - Respond quickly to user interactions with silky smooth animations and no janky scrolling.
Engaging - Feel like a natural app on the device, with an immersive user experience.
The Google PWA site is a good place to start learning about PWA and why and how you would build one.
https://developers.google.com/web/progressive-web-apps/
Properly combining the principles of PWA and SPA can result in a much improved user experience especially on mobile phones with unreliable internet connections.
Probably the best example today of a well implemented PWA is Twitter Lite. Check it out here:
https://mobile.twitter.com/home
...and read about it here:
https://blog.twitter.com/en_us/topics/product/2017/introducing-twitter-lite.html
Neither is “better”. PWA definitely offers more features, but it also requires much more time spent during development.
Arun Patidar
Related Conversations
