Search code examples
sveltesapper

sapper or svelte for new project?


I have looked and played with svelte and sapper and I wondered why would one create a new project with the svelte template rather than the sapper template? I believe that sapper is to be replaced with sveltekit in due time but it is still the recommended approach.


Solution

  • Svelte and Sapper are related very much in the same way that, say, React and Next.js are. Sapper provides features like server-side rendering (SSR), routing (which can easily be dynamic, if needed), and single-page application (SPA) support. Creating a route is as simple as dropping a .svelte (for a page) or .js (for a server route) file in the routes folder. For nested routes, you just drop a folder with a .js file.

    I think the answer to your question lies mostly in your use-case. If you need to create routes, want SSR, or SPA, go with Sapper. If, however, you don't need those things (or don't know), start with Svelte, since migration to Sapper from Svelte on a smaller project can be as simple as copying a few files. It should be noted, as @Madacol points out below, that there are some differences (such as {#await}) that can't simply be ported over and will require heavier lifting. There are a few static sight generators out there (Routify, Elder.js, etc), as well, if that is more your flavor.

    Regarding SvelteKit, as @johannchopin stated:

    the transition to sveltekit won't be to hard according to the creator Rich Harris.

    Rich talks a bit about SvelteKit on this podcast.

    UPDATE (3/19/21): It looks like there are docs that include a migration guide, at this point. It should be noted, though, that SvelteKit 1.0 hasn't dropped yet, so it is possible some of this will change.