最初是由Mozilla研究院的Graydon Hoare設計創(chuàng)造，然后在Dave Herman, Brendan Eich以及很多其他人的貢獻下逐步完善的。Rust的設計者們通過在研發(fā)Servo網(wǎng)站瀏覽器布局引擎過程中積累的經(jīng)驗優(yōu)化了Rust語言和Rust編譯器。

我最大的感受

開始我是抵觸它的，原因很簡單，它太難學了！?。『煤ε抡Z法上影響我會的其他語言。不知道各位小伙伴是否有這樣的感受。

它的優(yōu)點也很直觀:

1、采用所有權機制，因此沒有垃圾回收器。

2、非空方案，保證其安全運行。

3、敢和C++對標性能的語言。

總的來說我用了2個月的時間研究它，能寫一些小東西，讓我感覺很舒服的是因它的機制生產(chǎn)的產(chǎn)物并沒有出現(xiàn)什么奇奇怪怪的問題。

Rust在web上的應用

WebAssembly或wasm是用于瀏覽器內(nèi)客戶端腳本的低級、可移植的字節(jié)碼格式，是一種運行在現(xiàn)代網(wǎng)絡瀏覽器中的新型代碼、并且提供新的性能特性和效果，對于瀏覽器下載和加載是有效的。

而且因為它是字節(jié)碼的原因所以并不想js開源，從速度和安全性來講都是碾壓js的。當然它的存在就像rust官網(wǎng)說的一樣，它不是來替代js，而是強化js！

本文主題

在咱們的站中，相關完整的示例太少了！最主要是vue手腳架中的應用幾乎沒有！所以本文將帶領大家在普通html上和vue手腳架上都來運行wasm的流程！

應用工具：HBuilder、CLion

1、創(chuàng)建一個wasm

配置Cargo

[package]
name = "mylib"
version = "0.1.0"
edition = "2021"
 
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
[lib]
crate-type = ["cdylib"]
 
[dependencies]
wasm-bindgen = "0.2.78"
base64 = "0.12.1"
 
[package.metadata.wasm-pack.profile.release]
wasm-opt = false

寫兩個函數(shù)

use wasm_bindgen::prelude::*;
use base64::*;
 
//解析base64
#[wasm_bindgen]
pub fn my_str(s:String) -> String{
    let s = base64::decode(s).unwrap();
    return String::from_utf8(s.clone()).unwrap();
}
//計算兩個數(shù)相加
#[wasm_bindgen]
pub fn add(a:i32, b:i32) -> i32{
    return a+b;
}

編譯wasm

build --target web

等待吧！這是一個漫長的時刻！

再次點擊運行，生產(chǎn)成品。

內(nèi)涵了wasm文件與js膠水文件【js與wasm數(shù)據(jù)交互作用】

2、在Html中的應用

將pkg直接放入根目錄

	<script type="module">
	import init, {add, my_str} from "./pkg/mylib.js";
	init().then(() => {
		console.log(add(1,2))
		console.log(my_str("5LiA56CB6LaF5Lq6"))
	});
	</script>

執(zhí)行wasm函數(shù)

3、vue3中的應用

將pkg扔進根目錄

執(zhí)行wasm函數(shù)

<script setup>
import { ref, onMounted } from 'vue'
import init, {add, my_str} from "../../pkg/mylib.js";
defineProps({
  msg: String
})
onMounted(async () => {
  await init()
  console.log(add(1,2))
  console.log(my_str("5LiA56CB6LaF5Lq6"))
})
const count = ref(0)
</script>

npm run dev運行

完美執(zhí)行！

4、最近遇到的問題

目前用vue2的還是比較多的，我引入后一直無法正常運行。

比如報錯：當前未啟用對實驗語法“importMeta”的支持

比如報錯：

WebAssembly module is included in initial chunk.
This is not allowed, because WebAssembly download and compilation must happen asynchronous.
Add an async splitpoint (i. e. import()) somewhere between your entrypoint and the WebAssembly module:

到此這篇關于Rust開發(fā)WebAssembly在Html和Vue中的應用小結的文章就介紹到這了,更多相關Rust開發(fā)WebAssembly內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

最新評論