Frameworks Research

[AlexanderKaran]

We need to review the documentation for each framework we are currently testing and compile two lists. One of the methods they support for building/rendering is SPA, MPA, SRR, etc. Then a second list of what they recommend.

[43081j]

off the top of my head:

Framework	SPA	MPA	SSG	Recommended
sveltekit	Y	Y	Y	?
nuxt	Y	Y	Y	MPA
next	Y	Y	Y	MPA

@paoloricciuti can probably confirm the sveltekit ones

[paoloricciuti]

Yeah, you can build all three and the recommended is "MPA"... I would argue that there are more columns tho: MPA generally is considered a pure Multi Page Application with no client-side routing, but in the case of SvelteKit both MPA and SSG have client-side routing after the initial load.

The default and so recommended way is to SSR on first load and do client-side routing for subsequent navigations.

[AlexanderKaran]

Thanks, @paoloricciuti. Will add you to any comparisons on this for feedback if that's ok.

I will also add default bundler plus a few other things to this list as well

[mb21]

I agree with @paoloricciuti that those three columns muddle things.

The default and so recommended way [in SvelteKit] is to SSR on first load and do client-side routing for subsequent navigations.

I wouldn't call that an MPA, but an SPA with pre-rendered HTML. Would you agree @paoloricciuti ?

I wrote some paragraphs on this in the Mastro Guide. Happy to receive corrections if people in other communities don't agree on the terminology.

Thus I'd argue there are two concerns with the following possible implementations:

1. MPA | SPA with pre-rendered HTML for initial page load | SPA without pre-rendered HTML
2. SGG (static site generation) | running a server

[paoloricciuti]

I wouldn't call that an MPA, but an SPA with pre-rendered HTML. Would you agree @paoloricciuti ?

I think the term is PMPA (Progressive Multi Page App). But the point is that there's just too much confusion around these terms to use them in this context imho

[mb21]

Cannot find anything googling "Progressive Multi Page App". Perhaps you're thinking of "Transitional apps"? the term Rich Harris coined in his talk of the same name?

Personally, I think the terms can be clearly defined and then can still be useful. But it's true that unfortunately a lot of people in the field don't use any consistent or proper terminology for this, so it's become very confusing.

[43081j]

just to note too - this may be one of the places we can improve things via this project. we can better define the types of app and types of rendering, then categorise the various framework-specific terms into those.

[Theiaz]

Hey there,

some time ago i published 3 articles (in german) about this topic. Not sure if its all correct but at time of writing I tried to classify these terms for myself. Also this site patterns.dev helped me alot! I think you need to distinguish between rendering and architectural pattern.

Rendering patterns have grown over time and blurred the line between classic MPA and SPA. Nowadays, its a spectrum. In my knowledge there you can roughly divide them into the following:

• SSR (Server Side Rendering, the classic MPA)
• SSR with Hydration (MPA which converts to an SPA)
  • Progressive Hydration
  • Partial Hydration / Island Architecture
• SSG (Static Site Generation)
  • Incremental Static Regeneration
• CSR (Client Side Rendering, the classic SPA)
• CSR with Prerendering / App Shell
• More "exotic" patterns such as RSC, Streaming, Resumability, Edge Rendering, HTMX

MPA and SPA are not a rendering pattern but an architectural pattern. Some of them are forced by the usage of a specifc rendering pattern (for example a SPA enforces CSR). It can be differentiated primarily based on those parameters:

• How navigation takes place
  • the traditional way where the browser fetches a new HTML document
  • the SPA way where the content of the HTML document is changed via JS
• How how the content is loaded (what gets fetched and who orchestrates the update)
  • does the server deliver HTML or data, and does the browser or JavaScript control the page update?
  • for example an SPA fetches its content with asynchronously whereas the content of an classic MPA is delivered via the initial HTML

---

but in the case of SvelteKit both MPA and SSG have client-side routing after the initial load.

The default and so recommended way is to SSR on first load and do client-side routing for subsequent navigations.

I wouldn't call that an MPA, but an SPA with pre-rendered HTML. Would you agree @paoloricciuti ?

I would call this SSR with Hydration or just Hydration.

---

This topic is very complex and there is not the only one definition. However, I hope I was able to help. I also had a look on #134 and I could imagine participating in that.

[43081j]

you are correct! and this is the same conclusion i reached in my quoted comment in #134

you definitely have helped 🙏 this list you've written is very much the kind of thing that'd fit well in the glossary i think, and we should be categorising by some of those imo

[AlexanderKaran]

@Theiaz, this is amazing!! Thank you!! If you can raise a PR for #134 and add this in that would be very appreciated.

[Theiaz]

@Theiaz, this is amazing!! Thank you!! If you can raise a PR for #134 and add this in that would be very appreciated.

I'll have a look at it. I hope i can do it till friday.