001 first experience of rust and webassembly

Time:2021-7-28

0 Introduction

Video address:www.bilibili.com/video/BV1eg411g7c…
Relevant source code:github.com/anonymousGiga/Rust-and-…

1 why rust and web assembly?

  • Low level control and high level Ergonomics
    Javascript web applications are difficult to achieve and maintain reliable performance.
    Rust provides programmers with a low level of control and reliable performance.

  • Smaller. Wasm
    Code size is important because. Wasm must be downloaded over the network. Rust has no runtime, so it supports smaller. Wasm.

  • You don’t have to rewrite it all
    Using rust is not to throw away the existing code. We can convert some JS functions into rust code.

  • Get along well with others
    Rust and webassembly are integrated with existing JavaScript tools and support ECMAScript module. You can continue to use previous tools, such as NPM and webpack.

  • Convenient infrastructure
    Rust has convenient tools expected by developers, such as:
    Cargo, zero cost, abstract, open and enthusiastic community.

2 what is a web assembly?

Web assembly (wasm) is a simple machine model and an executable format with a wide range of specifications. It is designed to be portable, compact, and executed at or near native speed.

Webassembly has two formats that represent the same structure:

  • . wat text format (webassembly text) uses s expression, which is somewhat similar to the language of LISP family;
  • . wasm binary format, with a lower level, is directly used by wasm virtual machines. It is conceptually similar to ELF and mach-o.

2.1 linear memory

Web assembly has a very simple memory model. The wasm module can access a single linear memory (essentially an array), which can be increased by multiple of the page size (64K), but cannot be reduced.

2.2 is web assembly only used for the web

Wasm does not make any assumptions about its host environment, but so far, it is mainly related to JS.

3 initial experience

  • Install rust
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
  • Install wasm pack
cargo install wasm-pack
  • Create project

    cargo new --lib mywasm
  • Write code

Add the following code to Src / lib.rs:

use wasm_bindgen::prelude::*;

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

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

Modify the cargo.toml configuration file and add the following:

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

[dependencies]
wasm-bindgen = "0.2"
  • Compile package
wasm-pack build --target web
  • Using package

Create index.html in the mywasm root directory. The code is as follows:

<!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>
  • Run server
python3 -m http.server
  • test

Enter in the browser:localhost:8000

This work adoptsCC agreement, reprint must indicate the author and the link to this article

Linghu rushed

Recommended Today

VBS obtains the operating system and its version number

VBS obtains the operating system and its version number ? 1 2 3 4 5 6 7 8 9 10 11 12 ‘************************************** ‘*by r05e ‘* operating system and its version number ‘************************************** strComputer = “.” Set objWMIService = GetObject(“winmgmts:” _  & “{impersonationLevel=impersonate}!\\” & strComputer & “\root\cimv2”) Set colOperatingSystems = objWMIService.ExecQuery _  (“Select * from […]