本文將從 Rust 的歷史,前端的使用場景和業界使用案例一步步帶你走進 Rust的世界。并且通過一些簡單的例子,了解 Rust 如何應用到前端,提高前端的生產效率。
2006年,軟件開發者Graydon Hoare在Mozilla工作期間,開始了Rust作為一個個人項目。根據他在麻省理工技術評論的一次采訪,Rust的靈感來自于Hoare公寓樓里一個壞掉的電梯。電梯操作系統的軟件崩潰了,Hoare意識到這類問題通常源于程序如何使用內存的問題。
通常,這些類型設備的軟件是用C或C++編寫的,但這些語言需要大量的內存管理,可能導致系統崩潰的錯誤。因此,Hoare著手研究如何創建一種既緊湊又無內存錯誤的編程語言。
Mozilla 于2009年開始贊助這個項目,并且在2010年首次公開。也在同一年,其編譯器源代碼開始由原本的 OCaml 語言轉移到用 Rust 語言,進行自我編譯工作,稱作“rustc”,并于2011年實際完成。這個可自我編譯的編譯器在架構上采用了 LLVM 作為它的后端。
第一個有版本號的Rust編譯器于2012年1月發布。Rust 1.0是第一個穩定版本,于2015年5月15日發布。
2021年2月8日,AWS、華為、Google、微軟以及 Mozilla 宣布成立Rust基金會,并承諾在兩年時間里每年投入不少于 100 萬美元的預算,以用于 Rust 項目的開發、維護和推廣
根據Rust 最新官方新聞,谷歌日前宣布向 Rust 基金會捐款 100 萬美元,這筆資金將用于改善 C++ 與 Rust 互操作性。谷歌當前正在使用 Rust 語言重寫在 Linux 核心之外的 Android 關鍵安全組件,從而進一步減少安全漏洞。而在 Android 13 中,就已經有約 21%的新原生代碼使用 Rust 語言開發。
同時大量頭部公司比如華為,微軟,字節的應用和推廣,使得rust快速占領著前端基礎設施領域。Webpack、Babel、Prettier 這些熱門工具都已有了 Rust 替代方案,且性能有著 10~100 倍的提升。任何能夠用 Rust 實現的應用系統,最終都必將用 Rust 實現。
Rust語言在IM客戶端的實踐 (https://juejin.cn/post/7336022842856177690)
結合了 Rust 語言的優點,成功地解決高并發接待 & 多開。
給 Web 前端工程師看的用 Rust 開發 wasm 組件實戰(https://juejin.cn/post/7308434321764794378)
利用 Rust 生成的wasm,處理大量計算的場景,取得很好的收益。(https://juejin.cn/post/7303347466219569203)
Bundler 的設計取舍:為什么要開發 Rspack?
文章作者通過使用了 Webpack、Vite、Esbuild、Rollup 等構建工具,對各個工具的優劣處和設計取舍后決定采用rust提升構建工具的性能。
通過上面幾個案例我們可以看到,對于前端我們前端來說,利用 Rust 可以做一些計算量比較大wasm和一些構建工具相關的基礎設施收益還是比較大的。當然也可以做跨端應用,可以參考用 Rust 實現跨平臺開發(iOS/Android/Web)經驗分享(https://zhuanlan.zhihu.com/p/677550790)
WebAssembly 是一門不同于 JavaScript 的語言,WebAssembly 是一門低級的類匯編語言。它有一種緊湊的二進制格式,使其能夠以接近原生性能的速度運行,并且為諸如 C++ 和 Rust 等擁有低級的內存模型語言提供了一個編譯目標以便它們能夠在網絡上運行。
wasm二進制內容如下圖
圖片
由于 Rust 生態天然支持 WebAssembly,并且有專門的生態去跟蹤和優化WebAssembly,我們可以利用 Wasm-Pack 腳手架生成 Wasm 項目。
首先安裝 Rust 相關的環境,和 wasm-pack 腳手架。
這是一個可以直接將你的 Rust 代碼打包成 Npm 包的工具,用法十分簡單,只有 4 個命令:
圖片
Pkg hello_wasm.js 就是最終wasm 入口文件,
html中異步引入
const { default: init } = await import("./pkg/hello_wasm.js");const res = await init();
異步引入 hello_wasm.js 后,會自動加載 hello_wasm_bg.wasm 二進制文件,res 可以獲取從二進制得到的變量。間接從獲得了從 Rust 語言到 Js 傳遞,當然 Rust 也可以調用 Js 的方法,可以通過
#[wasm_bindgen(js_namespace = console)]
通過在 Rust 函數或結構體上使用 #[wasm_bindgen] 屬性和相應的配置,我們可以將 Rust 代碼暴露給 JavaScript 使用,以實現跨語言的交互和調用。在這種情況下,#[wasm_bindgen(js_namespace = console)] 指定了 JavaScript 中的 console 對象的命名空間,使得我們可以使用類似于
console.log() 的方式在 Rust 中輸出到 JavaScript 的控制臺。
社區已經有成熟的 Napi-rs 來封裝 Native Addon。
首先通過安裝 Napi-rs 腳手架生成項目
圖片
生成的項目大概長這種模樣。通過執行 npm run build 我們可以生成 index.js和 napi-demo.darwin-arm64.node 二進制文件。
const demo = require("./index.js");
引入 index.js 就可以獲取到 Rust lib.rs 中暴露的變量和方法了。其實像 Swc,Rspack 這些重計算的工具底層也是通過此庫進行 Rust 語言和 Nodejs 進行交互的。Rust 提供一些核心底層能力,Node 可以結合現有的生態調用經過 Rust生成二進制文件創造更多性能卓越的應用。
隨著前端開發越來越卷,前端基建的效率也將是下一個值得投入的地方。并且隨著 Rust 和 WebAssembly 發展,網頁應用也有很大的發展空間。最后希望在深入學習 Rust 后,做出一些有意思的應用。
https://zhuanlan.zhihu.com/p/101118828
https://developer.mozilla.org/zh-CN/docs/WebAssembly/Rust_to_wasm
https://zhuanlan.zhihu.com/p/234914336
https://www.zhihu.com/question/603518666/answer/3256663127
https://juejin.cn/post/7336022842856177690
https://juejin.cn/post/7317854227748847616
https://zhuanlan.zhihu.com/p/677550790
https://zh.wikipedia.org/zh-cn/Rust
https://juejin.cn/post/7076354498691596325
本文鏈接:http://www.www897cc.com/showinfo-26-75319-0.html前端視角對Rust的淺析
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。郵件:2376512515@qq.com
上一篇: 我們一起聊聊 Maven 依賴沖突問題
下一篇: Java的函數式接口編程示例