Categories: Reactjs

Single Page Vs Multi Page Applications in React

When we talk about React or Angular and Vue as the side note, we can build two kinds of applications with all these libraries and frameworks, Single page applications and Multi-page applications.


If you prefer watching a video

Try CodeMix for fast and productive React Development.


Single page applications

  • In Single page applications, we only get back single HTML file by the server once.
  • The time when the user visits the page after everything is managed by Javascript.
  • With ReactJs the entire page consists of components which are rendered and handled by Javascript.

Multi-page applications

  • In Multi-page apps, we get back multiple HTML pages, where each page has content for given Router.
  • In Multi-page apps, we only use React to create widgets.
  • For example, individually created components which we dump to that page but not entire page is managed by React, you can see this in many apps.

ReactJs Control over entire Applications

In single page applications, our page is built with components and every component is a React Component and also the entire page is managed by root React component and it’s just under React control.

In the Multipage apps in second hand, we split up our components but a lot of pages are going to be normal HTML pages, and widgets we dump in like an Image gallery that is managed by React, so the entire page is not under React control.

The Better approach

But the popular approach now days is Single page applications approach because you manage the entire page with Javascript you never have to go back to the server and reload the page. that is the amazing use to experience because everything happens instantly.

Here you are not just showing spinners page where a user can’t do anything but a page which is still a reactive web app.

Deven Rathore

Deven is an Entrepreneur, and Full-stack developer, Constantly learning and experiencing new things. He currently runs and

Published by
Deven Rathore

Recent Posts

How to Create a Custom Online Learning Platform

In the last few years, e-learning has become really popular. Coursera has recently surveyed and…

4 weeks ago

6 Tips for Designing Your Unique Blog

If done correctly, a blog can be hugely successful; it can create a large following,…

2 months ago

How to Record and Transcribe a Google Hangouts Meet Video

As we all know, the current COVID-19 situation has brought the entire world to a…

2 months ago

5 Signs You Need To Hire A Website Designer

As the digital face of your business, how your website is perceived to the outside…

2 months ago

21 Chrome Extensions for Web Development

Since its introduction in 2008, Google Chrome has become the most used and the most…

2 months ago

15 cool React Admin Templates

As a react developer, building your Admin Template from scratch can be quite stressful and…

2 months ago