svelte 编译背后的概念是什么？答案

【问题标题】：What is the concept behind svelte compilation?svelte 编译背后的概念是什么？
【发布时间】：2019-05-20 06:28:35
【问题描述】：

我浏览了您的文章 https://svelte.dev/blog/virtual-dom-is-pure-overhead 和其他一些博客，但它们解释了与虚拟 dom 相比，svelte 是如何更好的。而我想了解的是它的工作原理与其他框架/概念没有比较。

我问的原因是，与 dom-diffing 相比，svelte 似乎展示了性能提升。那时，与 DOM 操作代码相比，DOM-diffing 框架展示了性能提升。

我在哪里可以记录/图片表示只是苗条的编译？

我尝试搜索细小问题/问题、中等文章，但没有找到我要查找的内容。

我还查看了https://github.com/sveltejs/svelte/issues/1011#issuecomment-351262252，但没有找到我要查找的内容，因为它解释了其中的细节，以及它是如何在技术上实现的。

【问题讨论】：

简单来说，在编译过程中，它们会识别模态的更新，并发出很少的代码语句来更新相关的 DOM 元素。它实际上听起来非常直观。如果您要问一个新手开发人员，他将如何在不了解现有框架的情况下实现这一点，他可能会回答——我会使用观察者。但是，如果您对他进行更多调查以提出一些高性能的东西，他很可能会建议使用 svelte 的方法。

标签： svelte

【解决方案1】：

了解它的最简单方法是查看它生成的代码。 Visit the REPL 并单击“JS 输出”选项卡。请注意，更新代码（从create_fragment 返回的p 方法）如下所示：

if (changed.count) {
  set_data(t1, ctx.count);
}

set_data 只是textNode.data = ... 的包装。换句话说，Svelte 生成的代码会根据状态变化直接更新 DOM，具体取决于哪些值发生了变化。与使用虚拟 DOM 的框架不同，它不需要检查或重新生成所有内容。

【讨论】：