## 
在我们开始之前

> \[!注意\] 如果你是 Svelte 或 SvelteKit 的新手，我们建议查看[交互式教程](/tutorial/kit)。
> 
> 如果您遇到困难，请在[Discord 聊天室](/chat)寻求帮助。

## 
什么是 SvelteKit？

SvelteKit 是一个使用 [Svelte](../svelte) 快速开发强大、高性能 Web 应用的框架。如果你来自 React，SvelteKit 与 Next 类似。如果你来自 Vue，SvelteKit 与 Nuxt 类似。

要了解更多关于您可以使用 SvelteKit 构建的应用类型，请参阅有关项目类型的[文档](project-types)。

## 
什么是 Svelte？

简而言之，Svelte 是一种编写用户界面组件的方式——如导航栏、评论区域或联系表单——用户在浏览器中看到并与之交互。Svelte 编译器将您的组件转换为 JavaScript，可以运行以渲染页面的 HTML 和 CSS 以美化页面。您不需要了解 Svelte 就能理解本指南的其余部分，但它会有所帮助。如果您想了解更多信息，请查看[“Svelte 教程”](/tutorial)。

## 
SvelteKit 对比 Svelte

Svelte 渲染 UI 组件。您可以使用这些组件组合并使用 Svelte 渲染整个页面，但编写整个应用程序需要 Svelte 以外的更多内容。

SvelteKit 帮助您在遵循现代最佳实践的同时构建 Web 应用，并提供解决常见开发挑战的解决方案。它提供从基本功能——如当点击链接时更新 UI 的[路由器](glossary#Routing)——到更高级功能的一切。其丰富的功能列表包括[构建优化](https://vitejs.dev/guide/features.html#build-optimizations)以仅加载所需的最小代码；[离线支持](service-workers)；在用户导航之前[预加载](link-options#data-sveltekit-preload-data)页面；[可配置渲染](page-options)，通过[SSR](glossary#SSR)在服务器上处理您的应用程序的不同部分，通过[客户端渲染](glossary#CSR)在浏览器中，或在构建时通过[预渲染](glossary#Prerendering)；[图像优化](images)；等等。构建一个遵循所有现代最佳实践的应用程序非常复杂，但 SvelteKit 为您处理所有无聊的事情，让您可以专注于创意部分。

它通过利用[Vite](https://vitejs.dev/)和[Svelte 插件](https://github.com/sveltejs/vite-plugin-svelte)进行[热模块替换（HMR）](https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/config.md#hot)，即时反映您在浏览器中对代码的更改，以提供快速且功能丰富的开发体验。