Home > OS >  Svelte(kit) with Flask Backend - Some Questions
Svelte(kit) with Flask Backend - Some Questions

Time:04-15

I am currently diving into the world of Svelte(kit) and I am at the point where I need some help with my decisions.

I will use Flask for the Backend so I tried to serve Svelte from Flask (like in this Git) and for the start, it looks fine.

But i prefer Sveltekit over Svelte, so i tried to serve Sveltekit in the same way as Flask, but I only got "%svelte.head% %svelte.body%" text on the page. What do i need to change?

Why serve Sveltekit from Flask instead of Svelte? For example, i do like the Routing in Sveltekit more than in Svelt. But I don't see the Point to use Endpoints while I could fetch the Flask API direct from the .svelte Page instead of fetching to the Endpoint to fetch then to the Flask API. Or what's wrong with my thinking?

CodePudding user response:

Svelte vs svelte-kit

What you seem to be missing is the difference in svelte and svelte-kit.
Svelte itself makes it easy to write reusable fast and small components. These are independend of any server components. Svelte-kit builds on top of that, to create a full web framework, with potential server components.
In practice that means it provides multiple adapters to deploy a web app built with it to different places, such as netlify, as a express app, or just as a set of static html files, for github/gitlab pages.
For all adapters that are not static solutions, using svelte kit also adds the option to have server side rendering, which can often result in a better user experience.

Svelte-kit Endpoints

Your question about endpoints ties into that. The reason why you would have something to gain from making these endpoints from within svelte kit is twofold:
In your specific case, javascript/nodejs are usually faster then python,
and more importantly, if the endpoints are made with svelte kit, they can be used as part of the server side rendering procedure.
Since everything is happening on the same machine, that can dramatically speed up the whole process.
There is also the aspect that having services with different languages interact can be a large cognitive overhead, and the dtos you are transferring can be difficult to manage.

Approaches

If your existing server component is small, or still in the middle of being built, its probably a good option to switch to svelte-kit entirely, for the resulting speedup, simplicity of only working in one language, and a lot of convenience features that svelte-kit affords you. For that option you would have to familiarize yourself with svelte and svelte-kit a lot more though.
Here is some documentation by svelte-kit on endpoints as well as hooks which are very handy for managing user state.
Endpoints are fairly simple, so as long as you have a good grasp on what you are achiving in them, and some javascript/nodejs knowledge, it shoudln't be too hard.

If your existing server component in python can not be rewritten for a svelte-kit app, because of some unavailable dependencies, or because it's simply too large, you do still have the option of deploying the svelte-kit app as a static page, and then making direct requests to your python based service.

There is also the option of using svelte-kit endpoints as a proxy to make requests to your python service. This strategy fit's more into a microservice architecture, or if you are only making a new frontend for a existing backend application. Still, under the right circumstances a good option.

  • Related