告别虚拟 DOM——Svelte 在编译期将组件转为纯 JS，零运行时开销，Runes 响应式革新前端开发
Svelte 由 Rich Harris（《纽约时报》图形编辑）于 2016 年创造。与 React、Vue 不同，Svelte 不是一个运行时框架——它是一个编译器。当你写 Svelte 组件时，构建步骤会将你的代码转换成精简的、纯命令式的 JavaScript，直接操作 DOM，无需在浏览器中携带框架运行时。
Svelte 5 带来了革命性的 Runes 系统——用 $state()、$derived()、$effect() 等函数式 API 替代了旧版的魔法式响应式声明，让响应式逻辑更加明确、可预测，也更容易在组件之间共享。
配合 SvelteKit——Svelte 官方的全栈框架，你可以构建支持 SSR、SSG、CSR 的完整 Web 应用，并一键部署到 Vercel、Cloudflare Pages 或自己的 Node.js 服务器。
Svelte 重新定义了前端框架的边界
编译期直接生成 DOM 操作代码，省去虚拟 DOM diffing 开销，运行时性能卓越。
Svelte 5 新引入 $state/$derived/$effect，响应式语义更清晰，可跨文件共享状态。
组件内的样式自动作用域化，编译后加哈希 class，彻底告别样式冲突。
基于文件系统的路由约定，+page.svelte、+layout.svelte、+error.svelte 直观清晰。
通过 load 函数轻松实现服务端渲染和静态生成，SEO 友好，加载速度极快。
表单 Actions + use:enhance，无 JS 也能工作，有 JS 则体验更好。
系统性掌握 Svelte 5 与 SvelteKit，从入门到全栈部署
编译时框架原理、与 React/Vue 对比、Runes 系统概览、安装 SvelteKit 项目、目录结构、.svelte 文件三部分。
变量插值、HTML 插值、作用域 CSS 原理、动态 class/style、过渡动画 transition:fade 等内置过渡。
$state() 替代 let、$derived() 替代 $: 派生、$effect() 替代生命周期、响应式对象与数组、与旧版 $: 语法对比。
onclick 事件处理、事件修饰符 prevent/stop、bind:value 双向绑定、bind:this 获取 DOM 引用、组件事件传递。
$props() 接收父组件传值、默认值设置、$$restProps、Svelte 5 snippets 替代 slot、{@render} 渲染片段。
条件渲染、列表渲染与 key、异步数据加载 {#await}、{#key} 强制重渲染、{@const} 局部常量。
src/routes/ 文件路由、+page/+layout/+error、动态路由 [slug]、路由组 (group)、goto() 编程式导航。
+page.server.ts 的 load 函数、+page.ts 通用 load、PageData 类型、invalidate() 缓存刷新、流式加载 defer。
actions 定义、use:enhance 渐进增强、表单验证、fail(400) 错误返回、redirect(303)、文件上传处理。
adapter-auto 自动选择、Vercel/Netlify 一键部署、adapter-cloudflare Edge、adapter-node 自托管、环境变量管理。