What is SPA?
SPAs are web apps that provide the user experience like an offline mobile or desktop application by using only one web page that dynamically changes, updates its data via API without reloading. SPAs uses AJAX, where transmission of data takes place asynchronously.
Advantages of SPAs
SPAs are fast, as complete HTML, CSS, JavaScript loads into browser only once in the 1st client request and re-renders parts of the DOM in the loaded page.
SPAs provide seamless user experience, as web page update or change parts of it without reloading.
SPAs use less bandwidth, so it can work over slow internet connections also, as transmission of data is done in small fragments (JSON format).
Decoupled frontend, frontend and backend code are separate. SPA is cross-platform. The backend code of web apps can be used to create mobile or desktop applications.
Disadvantages of SPAs
SEO is difficult to achieve because Googlebot takes a longer time to index JavaScript pages compared to static HTML pages.
Synchronous content = crawled
Asynchronous content = not crawled
JS is strictly required for SPAs. JavaScript should always be enabled in the browser.
SPAs are less secure. They are vulnerable to cross-site scripting attacks, where hackers are able to insert their own client-side scripts into web apps.
SPAs don’t store browser history. you can’t move back and forth in the SPA. If you press the back button, you end up on a previously loaded web page, not the previous state. However, this drawback can be neutralized by using the HTML5 History API.
Applications of SPAs
Single page applications are suitable for websites with small data volumes, Software-as-a-Service (SaaS) solutions, social media platforms, and websites that offer live analysis, live updates.
Some popular Single page Application examples Facebook, Google maps, Gmail, Twitter.