前言
swc 與 babel 都是 JavaScript 編譯器,它們的主要功能是將 ES2015+ 以及 TypeScript, Flow, JSX 等語法轉換為瀏覽器或環境中的向后兼容的 JavaScript 代碼。
哪里快了?
1. 開發語言的優勢
swc 是用 Rust 語言開發的,而 babel 是用 JavaScript 語言開發的。這意味著 swc 可以利用 Rust 的性能優勢,如無 GC(垃圾回收機制)、系統級語言、多核 CPU 支持等,而 babel 則受限于 JavaScript 的性能問題,如 GC、單線程等。
2. AST 樹透傳
swc 在編譯代碼時并不需要將 AST 樹透傳下去,而是直接在內存中進行轉換。這樣可以避免多次遍歷 AST 樹,提高編譯效率。而 babel 則需要將 AST 樹傳遞給每一個插件,這樣會增加編譯時間和內存消耗
3. 編譯后的代碼更快
swc 可以將 JavaScript 代碼編譯為 WebAssembly,這樣可以提高代碼的執行速度。而 babel 則只能編譯為 JavaScript 代碼,無法利用 WebAssembly 的優勢。
總結
- swc 相比于 babel 的優勢主要是編譯速度和執行速度方面,根據官方測試,swc 有至少 10 倍以上的性能優勢。但是 babel 的優勢主要是插件系統和生態方面,babel 有更多的插件和框架支持,可以處理更復雜的 JavaScript 項目。
- 目前,swc 已經被 Next.js 等前端框架采用,未來有望在前端工程化領域發揮更大的作用。而 babel 仍然是目前最流行的 JavaScript 編譯器,被 Vue, React, Angular 等框架廣泛使用。
/-------------------------------------------------- 擴展知識 ------------------------------------------------------/
Rust 無 GC 的原因?
它使用了一種叫做所有權的機制來管理內存
- 所有權的基本思想:每個值都有一個唯一的所有者,當所有者離開作用域時,值就會被自動釋放。這樣就避免了內存泄漏和懸垂指針的問題,也不需要運行時的垃圾回收器來跟蹤和清理內存。
Rust 還引入了借用和生命周期的概念,來控制對值的訪問和修改。借用就是臨時使用一個值的引用,而不是擁有它。生命周期就是一個值或者一個引用在程序中存在的時間段。Rust 編譯器會檢查借用和生命周期是否符合一些規則,來保證內存安全和數據一致性。
Rust 的這種內存管理方式,既可以保證程序的正確性,又可以提高程序的性能,因為它不需要額外的內存開銷和垃圾回收的暫停。這也是 Rust 被稱為“零成本抽象”的原因之一。
系統級語言
系統級語言是指那些可以直接操作硬件和底層系統的編程語言
它們通常具有以下特點:
- 語法簡潔,指令集小,編譯速度快,運行效率高
- 支持指針和內存管理,可以訪問和修改內存地址和寄存器
- 支持匯編語言的嵌入和調用,可以實現與硬件的交互
- 支持多種數據類型和結構,可以表示和處理復雜的數據
- 支持靜態編譯和鏈接,可以生成可執行的二進制文件,不需要運行時環境
系統級語言的代表有 C, C++, Rust, Go 等,它們被廣泛用于開發操作系統,驅動程序,嵌入式系統,游戲引擎等領域。系統級語言的優勢是性能高,控制力強,可移植性好,但是也有一些缺點,如語法復雜,調試困難,內存安全難以保證等。
WebAssembly
WebAssembly 是一種開放的網絡標準,由 W3C WebAssembly Community Group 開發,并得到了主要瀏覽器廠商的支持。目前,WebAssembly 已經被一些前端框架和工具采用,如 Next.js, Astro, SvelteKit, Blazor, Emscripten 等。
-
一種低級的類匯編語言 可以在現代網絡瀏覽器中運行,具有緊湊的二進制格式,可以接近原生的性能運行,并為諸如 C, C++ 和 Rust 等語言提供一個編譯目標,以便它們可以在 Web 上運行。它也被設計為可以與 JavaScript 共存,允許兩者一起工作。
-
快速、高效、可移植和安全 它可以解決一些 JavaScript 在性能方面的問題,特別是對于 3D 游戲、虛擬現實、增強現實、計算機視覺、圖像/視頻編輯等領域的應用。WebAssembly 的模塊可以被導入到一個網絡應用中,并且暴露出供 JavaScript 使用的函數,JavaScript 也可以把函數導入到 WebAssembly 模塊中,實現雙向的互操作。