What is SPA? and When Should you not use SPA?

Abhinav Patel
3 min readJan 29, 2021

--

Did you ever wonder why do we even need react routing or Single Page Applications when we can simply link all the pages directly using link tag, right?

Well, let's try to understand a Lil deeper. Firstly we need to understand how web used to work previously.

Before SPA (Single Page Applications), We used to create HTML, CSS, and JavaScript files separately for each page even if we used to link multiple files to each other it wasn't much helpful either you know why? because by default the browser renders the index.html file then it goes line by line and as soon as it used to read CSS and JS and get it from servers till here we didn't have any issues.

The issue starts when there is a link tag to another page it requests to the server again to get the set of files for that page which results in slowing down the website.

Instead, what we can do is create different components for the whole website. and create routes to different pages and when we go on that route the component which needs to be changed or replaced gets replaced rest all stays on the page so we don't have to request the server repeatedly to load the whole page every single time we go to a new page.

Which results in increasing the speed and performance of the site.

But There Are few disadvantages of Using SPA too:-

1. SEO optimization

Some people are of the opinion that SPAs provide poor SEO optimization. This is because single-page apps operate on JavaScript and download data on request from the client-side. The URL doesn’t really change and different pages don’t have their unique URL addresses. It’s hard to optimize these websites for search engines since most pages can’t be scanned by search bots.

2. Browser history

An SPA doesn’t save visitors’ jumps between states. This means that when users click the back button, they won’t go back. A browser only takes users to the previous page, not to the previous state in an app.

3. Security issues

One security issue is the exposure of sensitive data. If developers aren’t careful about what data is contained in the initial page load, they can easily send data that shouldn’t be exposed to all users. The whole of an SPA isn’t generally visible in the browser, which can provide a false sense of security.

One more reason that SPAs can be insecure is missing access control at the functional level. Since developers move features and logic off the server and out to the client, it’s really easy to provide a client with access to functions that they shouldn’t be permitted to use.

When to use an SPA

Single-page web applications fit perfectly for building dynamic platforms with small data volumes. Furthermore, a single-page app is ideal as a base for future mobile app development. The main drawback of this development approach is poor SEO optimization. But this architecture is excellent for SaaS platforms, social networks, and closed communities where search engine optimization doesn’t matter. If a project requires effective SEO, on the other hand, then you should use a multi-page application.

--

--

Abhinav Patel

Building Products | React | MERN | JavaScript | neoGrad '21 🛡️ | Web Development, Tech, Philosophy, Books 🕊️🤍 :):