0 Einführung

Videoadresse: https://www.bilibili.com/video/BV1eg411g7c8
Zugehöriger Quellcode: https://github.com/anonymousGiga/Rust-and-Web-Assembly

1 Warum Rust und WebAssembly?

Low-Level-Steuerung versus High-Level-Ergonomie
Bei JavaScript-Webanwendungen kann es schwierig sein, eine zuverlässige Leistung zu erreichen und aufrechtzuerhalten.
Rust bietet Programmierern eine einfache Kontrolle und zuverlässige Leistung.
Eine kleinere .wasm-
Codegröße ist wichtig, da .wasm über das Netzwerk heruntergeladen werden muss. Rust hat keine Laufzeit und unterstützt daher eine kleinere .Wasm.
Es ist nicht nötig, alles neu zu schreiben
. Rust zu verwenden bedeutet nicht, vorhandenen Code wegzuwerfen, wir können einige js-Funktionen in Rust-Code konvertieren.
Verstehen Sie sich gut mit anderen,
Rust und WebAssembly lassen sich in vorhandene JavaScript-Tools integrieren, unterstützen ECMAScript-Module und Sie können frühere Tools wie npm und Webpack weiterhin verwenden.
Praktische Infrastruktur
Rust verfügt über praktische Tools, die Entwickler erwarten, wie zum Beispiel:
Fracht, kostenlose Abstraktion und eine offene und enthusiastische Community.

2 Was ist WebAssembly?

WebAssembly (wasm) ist ein einfaches Maschinenmodell und ausführbares Format mit einer umfangreichen Spezifikation. Es ist so konzipiert, dass es tragbar und kompakt ist und mit oder nahezu nativer Geschwindigkeit ausgeführt werden kann.

WebAssembly verfügt über zwei Formate zur Darstellung derselben Struktur:

Das .wat-Textformat (WebAssembly Text) verwendet S-Ausdrücke, die den Sprachen der Lisp-Familie etwas ähneln;
Das .wasm-Binärformat ist ein Low-Level-Format und wird direkt von der virtuellen Wasm-Maschine verwendet. Es ähnelt konzeptionell ELF und Mach-O.

2.1 Linearer Speicher

WebAssembly verfügt über ein sehr einfaches Speichermodell. Das WASM-Modul kann auf einen einzelnen linearen Speicher (im Wesentlichen ein Array) zugreifen, der um ein Vielfaches der Seitengröße (64 KB) wachsen, aber nicht verkleinern kann.

2.2 Ist WebAssembly nur für das Web?

wasm macht keine Annahmen über seine Host-Umgebung, aber bisher hängt es hauptsächlich mit js zusammen.

3 erste Erfahrung

Rust installieren

curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

Wasm-Pack installieren

cargo install wasm-pack

Projekt erstellen

cargo new --lib mywasm

Code schreiben

Fügen Sie den folgenden Code in src/lib.rs hinzu:

use wasm_bindgen::prelude::*;

#[wasm_bindgen]
extern {
    pub fn alert(s: &str);
}

#[wasm_bindgen]
pub fn greet(name: &str) {
    alert(&format!("Hello, {}!", name));
}

Ändern Sie die Konfigurationsdatei Cargo.toml und fügen Sie Folgendes hinzu:

[lib]
crate-type = ["cdylib"]

[dependencies]
wasm-bindgen = "0.2"

Kompilierungspaket

wasm-pack build --target web

Paket verwenden

Erstellen Sie index.html im Stammverzeichnis von mywasm. Der Code lautet wie folgt:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>hello-wasm example</title>
  </head>
  <body>
    <script type="module">
      import init, {greet} from "./pkg/hello_wasm.js";
      init()
        .then(() => {
          greet("WebAssembly")
        });
      </script>
  </body>
</html>

Server ausführen

python3 -m http.server

prüfen

Geben Sie im Browser ein: http://localhost:8000

001 Erste Erfahrungen mit Rust und WebAssembly