Svelte是一个由Rich Harris创建的开放原始码前端编译器[4],由志愿者维护。[5]与传统框架(如ReactVue)在浏览器中进行大量处理的方式不同,Svelte将这些工作提前到编译阶段处理。[6]构建一个Svelte应用程式会生成操作文档对象模型(DOM)的代码,Svelte借此可以减少传输的文件的大小,并提供更好的启动和运行时性能。Svelte有由TypeScript编写的编译器[4],用于在构建时将应用代码转换为客户端的JavaScript

Svelte
原作者Rich Harris
首次发布2016年11月26日,​8年前​(2016-11-26[1]
当前版本5.0.0[2]在维基数据编辑
原始码库github.com/sveltejs/svelte
编程语言TypeScript
文件大小4.1 KB[3]
类型Web应用框架
许可协议MIT License
网站svelte.dev

Svelte的原始码采用MIT许可证,托管在GitHub上。[7]

2023年6月,Svelte 4发布,软件包大小减小了75%,生成更小、更快的脱水代码,并为Svelte 5的更新打下了基础。[8]

示例

编辑

Svelte应用和组件由 .svelte 文件定义。这是一种添加了类似于JSX的模板语法的HTML文件。Svelte使用 $: 语法来标记响应式的组件。顶层的变量是组件的状态,导出的变量成为组件接收的属性。

<script>
    let count = 1;
    $: doubled = count * 2;
</script>

<p>{count} * 2 = {doubled}</p>

<button on:click={() => count = count + 1}>Count</button>

参考资料

编辑
  1. ^ Frameworks without the framework: why didn't we think of this sooner?. Svelte. [2023-03-18]. (原始内容存档于2023-03-27). 
  2. ^ https://github.com/sveltejs/svelte/releases/tag/svelte%405.0.0; 检索日期: 2024年10月23日.
  3. ^ Svelte@3.31.2. BundlePhobia. January 8, 2021 [2023-03-18]. (原始内容存档于2021-05-14). 
  4. ^ 4.0 4.1 Svelte入門 - 學習該如何開發 Web | MDN. developer.mozilla.org. [2021-08-21]. (原始内容存档于2022-03-26) (中文(台湾)). 
  5. ^ Svelte • Cybernetically enhanced web apps. svelte.dev. [2021-08-21]. (原始内容存档于2022-05-09) (英语). 
  6. ^ Apr 22 2019, Rich Harris Mon. Svelte 3: Rethinking reactivity. svelte.dev. [2021-08-21]. (原始内容存档于2022-04-26) (英语). 
  7. ^ GitHub - sveltejs/svelte: Cybernetically enhanced web apps. GitHub. [2021-08-21]. (原始内容存档于2022-05-03) (英语). 
  8. ^ Krill, Paul. Svelte 4 shrinks code footprint, compiled output. InfoWorld. 2023-06-26 [2023-06-27]. (原始内容存档于2023-06-29) (英语).