Svelte 入门第一课

Svelte 是什么？

Svelte 跟 vue 和 react一样，是一个数据驱动组件框架。但是也有很大的不同，它是一个运行时框架，无需引入框架本身，同时也没用到虚拟 DOM（运行时框架特性决定了这个框架跟虚拟 DOM 无缘）。
Svelte 的核心思想在于『通过静态编译减少框架运行时的代码量』
当前的框架无论是 React Angular 还是 Vue，不管你怎么编译，使用的时候必然需要『引入』框架本身，也就是所谓的运行时 (runtime)。但是用 Svelte 就不一样，一个 Svelte 组件编译了以后，所有需要的运行时代码都包含在里面了，除了引入这个组件本身，你不需要再额外引入一个所谓的框架运行时！
Svelte 的特性
Svelte 的编译风格是将模板编译为命令式 (imperative) 的原生 DOM 操作
跟基于 Virtual DOM 的框架相比，这样的输出不需要 Virtual DOM 的 diff/patch 操作，自然可以省去大量代码，同时，性能上也和 vanilla JS 相差无几（仅就这个简单示例而言），内存占用更是极佳。这个思路其实并不是它首创，之前有一个性能爆表的模板引擎 Monkberry.js 也是这样实现的，ng2 的模板编译其实也跟这个很类似（但是中间加了一层渲染抽象层）。
就是用来编译可独立分发的 Web Components

npx degit sveltejs/template my-svelte-demo
cd my-svelte-demo
npm install
npm run dev