Slim Kit 1.0
Web Development Made Simple
After two years of development, SvelteKit has finally reached version 1.0. To this day, this is the recommended method for creating Svelte apps of all shapes and sizes.
We're excited to share this release with you. It's the culmination of thousands of hours of work, both by the Svelte core team and the wider community, and we believe it's the most enjoyable way to create production quality websites whether you are a solo developer working on a small project or part of a large team.
To get started, run npm create svelte@latest and check out the documentation and interactive tutorial (experimental!)
SvelteKit is a framework for building web applications on top of Svelte, a UI component framework that developers love for its performance and ease of use.
If you've used component frameworks like Svelte, you'll know that they make it easier to build user interfaces rather than working directly with the DOM. But they leave a lot of questions unanswered:
How do I structure my source code? How to add server-side rendering? How do I add routing that works on the server and in the browser? How do I make client-side routing accessible? How can I recover data? How do I mutate data? How to handle errors? How do I optimize my production build? How to handle environment variables in a sensible and secure way? How to add CSP headers and CSRF protection? How can I add a service agent who knows what to cache? How do I prepare my app for deployment?An application framework is designed to answer these questions. SvelteKit does this with a design informed by the real needs of an army of beta testers (many of whom have been using SvelteKit in production for some time - we salute your bravery and thank you for the valuable feedback) and the best ideas from others. application frameworks, including Next.js and Remix.
How is it different?Today's web developers are spoiled for choice. Besides the aforementioned frameworks, there are options like Astro, battle-tested server frameworks like Rails and Laravel, and a million static site generators. They're all wonderful tools, and you should feel good about picking them up.
SvelteKit does things a little differently, though:
Unlike traditional "multi-page application" or MPA frameworks, it defaults to client-side navigation after the initial server-rendered page loads. This allows for faster page transitions, state that persists between pages (like the scroll position of a sidebar), and lower data usage. It also avoids re-running third-party scripts such as scans on every page load.
Unlike traditional server frameworks, it lets you use a single language, instead of having two tightly coupled applications (one to generate HTML, one to handle client-side interaction). Since SvelteKit runs wherever JavaScript runs, you can deploy your app as a traditional Node server or using serverless functions, including at the edge.
Unlike static site builders, you can build apps with custom or dynamic data, without the adverse performance effects and layout changes of fetching them from the browser after the page loads.
With SvelteKit, you have flexibility. Many frameworks assume there is a correct way to build an application, but the reality is more nuanced. It's not true, for example, that pre-rendering static pages is just a poor man's cache check - it also lets you do build-time validation or render system data of files that your edge functions cannot access, and acts as a protection against flaky databases. It's not true that everything requires server-side rendering - it's the right default if you want robust, high-performance apps with good SEO, but there are countless exceptions.
In a SvelteKit application, you can make these choices with as much granularity as needed; for example, the page you are viewing is pre-rendered, but the
Web Development Made Simple
After two years of development, SvelteKit has finally reached version 1.0. To this day, this is the recommended method for creating Svelte apps of all shapes and sizes.
We're excited to share this release with you. It's the culmination of thousands of hours of work, both by the Svelte core team and the wider community, and we believe it's the most enjoyable way to create production quality websites whether you are a solo developer working on a small project or part of a large team.
To get started, run npm create svelte@latest and check out the documentation and interactive tutorial (experimental!)
SvelteKit is a framework for building web applications on top of Svelte, a UI component framework that developers love for its performance and ease of use.
If you've used component frameworks like Svelte, you'll know that they make it easier to build user interfaces rather than working directly with the DOM. But they leave a lot of questions unanswered:
How do I structure my source code? How to add server-side rendering? How do I add routing that works on the server and in the browser? How do I make client-side routing accessible? How can I recover data? How do I mutate data? How to handle errors? How do I optimize my production build? How to handle environment variables in a sensible and secure way? How to add CSP headers and CSRF protection? How can I add a service agent who knows what to cache? How do I prepare my app for deployment?An application framework is designed to answer these questions. SvelteKit does this with a design informed by the real needs of an army of beta testers (many of whom have been using SvelteKit in production for some time - we salute your bravery and thank you for the valuable feedback) and the best ideas from others. application frameworks, including Next.js and Remix.
How is it different?Today's web developers are spoiled for choice. Besides the aforementioned frameworks, there are options like Astro, battle-tested server frameworks like Rails and Laravel, and a million static site generators. They're all wonderful tools, and you should feel good about picking them up.
SvelteKit does things a little differently, though:
Unlike traditional "multi-page application" or MPA frameworks, it defaults to client-side navigation after the initial server-rendered page loads. This allows for faster page transitions, state that persists between pages (like the scroll position of a sidebar), and lower data usage. It also avoids re-running third-party scripts such as scans on every page load.
Unlike traditional server frameworks, it lets you use a single language, instead of having two tightly coupled applications (one to generate HTML, one to handle client-side interaction). Since SvelteKit runs wherever JavaScript runs, you can deploy your app as a traditional Node server or using serverless functions, including at the edge.
Unlike static site builders, you can build apps with custom or dynamic data, without the adverse performance effects and layout changes of fetching them from the browser after the page loads.
With SvelteKit, you have flexibility. Many frameworks assume there is a correct way to build an application, but the reality is more nuanced. It's not true, for example, that pre-rendering static pages is just a poor man's cache check - it also lets you do build-time validation or render system data of files that your edge functions cannot access, and acts as a protection against flaky databases. It's not true that everything requires server-side rendering - it's the right default if you want robust, high-performance apps with good SEO, but there are countless exceptions.
In a SvelteKit application, you can make these choices with as much granularity as needed; for example, the page you are viewing is pre-rendered, but the
What's Your Reaction?
![Three of ID's top PR executives quit ad firm Powerhouse [EXCLUSIVE]](https://variety.com/wp-content/uploads/2023/02/ID-PR-Logo.jpg?#){kind=logo}
