> Think of it as Next for Svelte. It's a framework for building apps with Svelte, complete with server-side rendering, routing, code-splitting for JS and CSS, adapters for different serverless platforms and so on.
> If you're familiar with Sapper, SvelteKit is Sapper's successor.
As @skybrian points out below, this doesn't help much if you don't know what Next and Sapper are, and especially if you don't know what Svelte is.
Here's my attempt.
1. Svelte is a JavaScript component framework, i.e. it offers a way to write reusable UI components in JavaScript. (Other popular frameworks include React, Angular, and Vue.)
Each major framework solves the problem of code reuse in a different way, and components written in one framework are generally hard to adapt to other frameworks, if only because each framework includes some JS that you have to run in order to make its components work, and it hurts performance to run three frameworks when you could have just run one, so developers fight a lot about which framework is best.
2. SvelteKit supports "server-side rendering" (SSR) for Svelte. JavaScript frameworks let you implement user interfaces in JS, but by default, that JS only runs ("renders" the UI) on the client side, in the user's browser.
Client-side rendering hurts performance if the user has a slow Android phone. But even on fast devices, client-side rendering adds round trips to the server, first requesting the page, then requesting the JS, then finally running the JS to render. It's usually faster to render HTML on the server, and then to progressively enhance it on the client side.
Server-side rendering requires you to buy into an even bigger framework, with JavaScript component code running on the server and on the client, but it can offer nifty features, like "code splitting," sending down just the right JS needed for the current page (or the current "route," which is a bunch of pages of the same type with similar URLs). SSR frameworks have to handle not just UI components, but entire pages, and deciding based on the URL which page to show, which is called "routing."
For React server-side rendering, you'll typically use Next.js. Vue offers its own server renderer. Angular offers "Angular Universal." Preact offers WMR.
Svelte had an older SSR framework called "Sapper." Sapper is now dead/deprecated code, and SvelteKit is the new thing.
That was outstanding. Decades ago, before they invented juice boxes, we kids enjoyed milk and cookies while listening to carefully worded, age-appropriate explanations. Heaven help me, sometimes that combination still hits the spot. Thank you.
> Think of it as Next for Svelte. It's a framework for building apps with Svelte, complete with server-side rendering, routing, code-splitting for JS and CSS, adapters for different serverless platforms and so on.
> If you're familiar with Sapper, SvelteKit is Sapper's successor.