I am currently researching the benefits and disadvantages of SPA (Single-Page Applications) vs MPA (Multi-Page Applications).
Having established that MPA is more suitable for my project, I proceeded to discuss Server-Side Rendering vs Client-Side Rendering.
But as I was doing that, I noticed that a lot of benefits, arguments, etc. overlap with arguments in SPA vs MPA.
My conclusion was that pure client-side rendering is not possible with an MPA and therefore I have to proceed with server-side rendering combined with client-side (to update small pieces of information). Is my conclusion right?
Because I feel like I'm repeating myself when I talk about rendering after talking about SPA vs MPA. Right now, the concepts of SPA vs MPA and Client-side vs Server-side are blurred into one for me.
Best Answer
SPAs and MPAs
The core difference between a SPA and a MPA is that with a single-page application, all the requests happen within the lifecycle of a single HTML page. You might be able to see different views, even see different "pages" of the application, but all the rendering takes place within a single HTML web page. This has the advantage of keeping the state of the "application" all in one scope. Think of an application like messenger.com, where there are still a lot of moving parts but you never have to actually leave a page.
An MPA, by contrast, will have the user visiting multiple distinct HTML pages. All scripts will be re-executed when the new HTML page loads and any state must be persisted in the session or in local storage. This is more like stackoverflow.com's model.
Client-Side and Server-Side
You can have pure client-side apps which do all rendering and logic with Javascript, and which only reach out to the backend for API operations. You can also have pure server-side apps (most common with PHP, I'd say) where all the HTML and content is pre-rendered on the server before being downloaded by the web browser.
Client-side rendering and server-side rendering are commonly mixed, though. For example, stackoverflow.com renders the web page with the questions and answers on it on the server-side and sends it to you. Client-side rendering is then used for the upvote/downvote AJAX, adding new comments, and for previewing answers to questions in the browser.
I hope this is helpful. You're correct that the concepts are similar and can even be mixed with each other.