Is Svelte limited only to single-page applications (SPAs)?

5k views Asked by At

The Svelte documentation states that:

Svelte converts your app into ideal JavaScript at build time, rather than interpreting your application code at run time.

...

It is similar to JavaScript frameworks such as React and Vue...

In the context of the above my question is:

Is Svelte limited to building single-page applications (SPA) and can it be used for creating multi-page applications (MPA)?

3

There are 3 answers

0
cascading-jox On BEST ANSWER

Is Svelte Limited to Building Single-Page Applications?

No. Svelte is a way of building components. Svelte compiles to vanilla JS classes so you can easily include it as a small component doing something specific on a page or as a component that acts as a full page in a MPA structure (both initiated at runtime).

Can It Be Used for Creating Multi-Page Applications (MPA)?

Not with Svelte directly (since it just produces components) but it is possible with SvelteKit. I honestly thought that SvelteKit was a SPA framework (because it behaves like one) but apparently it does create real html entry points for all your routes. After the initial page load it just swaps out the parts of the web page that needs to be updated and no more full page loads are done hence the quick navigation speed and you get the benefits of server-rendered MPAs as well!

0
Kachow095 On

As you've already noted, Svelte is wonderful because it compiles into vanilla JS. Therefore, you can use compiled Svelte to replace even existing vanilla pages. Although I haven't tried it, I would imagine it works with Express if you want to use that. As pointed out by cascading-jox, SvelteKit is a neat integrated method to route your pages. Documentation for it seems to make it look quite similar to Next.js routing.

0
Kokizzu On

Just for sake of completeness, I use this one Svelte-MPA

So any server-side language (for example using ZTemplate) will inject the json for generated html from Svelte if need initial data, if not, you can just create a .svelte file (page) and it would generate html on build/watch, for any other .svelte file that started with underscore or in folder that starts with underscore it would became a svelte component that can be imported by other svelte page.