能替代 Vue 和 React 的框架，長什么樣子？
本文轉(zhuǎn)載自微信公眾號「勾勾的前端世界」，作者西嶺。轉(zhuǎn)載本文請聯(lián)系勾勾的前端世界公眾號。
2021年，StackOverflow(https://stackoverflow.com/) Developer 調(diào)查中，Svelte 成為最受開發(fā)者歡迎的 Web 框架。
Svelte 是一個全新的構(gòu)建用戶界面的 Web 應(yīng)用程序。Svelte 讀法是[ / sf?lt /]，本意是苗條的，細(xì)長的，優(yōu)美的。從2019年開始，受到了非常多的關(guān)注，是開源社區(qū)目前最熱門的前端框架。
Svelte 與諸如 React 和 Vue 等 JavaScript 框架類似，都懷揣著一顆讓構(gòu)建交互式用戶界面變得更容易的心。
但是有一個關(guān)鍵的區(qū)別，Svelte 在構(gòu)建/編譯階段會將應(yīng)用程序轉(zhuǎn)換為直接應(yīng)用的 JavaScript 代碼，而不是在運行階段解釋應(yīng)用程序的代碼。這意味著你不需要為框架所消耗的性能付出成本，并且在應(yīng)用程序首次加載時沒有額外損失。
Svelte 可以被用來構(gòu)建整個應(yīng)用程序，也可以被逐步融合到現(xiàn)有的代碼中。你還可以將組件直接作為獨立的包(package)交付，并且不會有傳統(tǒng)框架所帶來的額外開銷。
在 StackOverflow 今年的調(diào)查中，Svelte 成為眾人聚焦的明星，而它目前的使用量也僅次于 Vue 位列第四，大有替代 Vue 、React 的趨勢。
傳統(tǒng)框架(如 React 和 Vue)在瀏覽器中需要做大量的工作。與使用虛擬(virtual)DOM 不同，Svelte 將這些工作放到構(gòu)建應(yīng)用程序的編譯階段來處理。有人甚至直接將 Svelte 看作前端的 “編譯器”而不是框架或者庫，由此可見 Svelte 和其他框架的核心差異。
Vue 作者尤雨溪，曾經(jīng)對 Svelte 有一段極為恰當(dāng)?shù)拿枋觯?/p>
Svelte 的核心思想在于『通過靜態(tài)編譯減少框架運行時的代碼量』。
舉例來說，當(dāng)前的框架無論是 React Angular 還是 Vue，不管你怎么編譯，使用的時候必然需要『引入』框架本身，也就是所謂的運行時 (runtime)。
但是用 Svelte 就不一樣，一個 Svelte 組件編譯了以后，所有需要的運行時代碼都包含在里面了，除了引入這個組件本身，你不需要再額外引入一個所謂的框架運行時！
果然，大佬講話就是這么恰到好處的不多不少 “剛剛好”。
而在我看來，Svelte 是否適合在大型項目中應(yīng)用，還有待觀察。雖然核心思想是不需要 “運行時”，但是項目組件越多，運行時的代碼量也就越多，且組件間的代碼重復(fù)率也就越高，除此之外，現(xiàn)階段的周邊生態(tài)確實處于基本荒蕪的狀態(tài)。
但是，如果你對偏原生前端開發(fā)有執(zhí)念，Svelte 絕對讓你渾身舒暢。
因為 Svelte 可以將組件作為獨立的包(package)交付，所有如果你是在微前端架構(gòu)下，做組件級開發(fā)，Svelte 就是神兵利器。
如果你對 Vue 比較熟悉，那么學(xué)習(xí) Svelte 會讓你感覺 so easy，因為 Vue 和 Svelte 都在 Template 陣營，學(xué)習(xí)成本很低。
