rust wasm入门
@[TOC] # demo ## 编译 Rust 为 WebAssembly📕作者简介： 过去日记，致力于Java、GoLang,Rust等多种编程语言，热爱技术，喜欢游戏的博主。
📘相关专栏Rust初阶教程、go语言基础系列、spring教程等，大家有兴趣的可以看一看
📙Java并发编程系列，设计模式系列、go web开发框架 系列正在发展中，喜欢Java，GoLang，Rust，的朋友们可以关注一下哦！
在本教程中，我们将使用 Rust 的 npm 包构建工具 wasm-pack 来构建一个 npm 包。这个包只包含 WebAssembly 和 JavaScript 代码，以便包的用户无需安装 Rust 就能使用。他们甚至不需要知道这里包含 WebAssembly！
安装 Rust 环境
安装 Rust
前往 Install Rust 页面并跟随指示安装 Rust。这里会安装一个名为“rustup”的工具，这个工具能让你管理多个不同版本的 Rust。默认情况下，它会安装用于惯常 Rust 开发的 stable 版本 Rust Release。Rustup 会安装 Rust 的编译器 rustc、Rust 的包管理工具 cargo、Rust 的标准库 rust-std 以及一些有用的文档 rust-docs。
wasm-pack
要构建我们的包，我们需要一个额外工具 wasm-pack。它会帮助我们把我们的代码编译成 WebAssembly 并制造出正确的 npm 包。使用下面的命令可以下载并安装它：
cargo install wasm-pack
安装 Node.js 并获取 npm 账户
在这个例子中我们将会构建一个 npm 包，因此你需要确保安装 Node.js 和 npm 已经安装。另外，我们将会把包发布到 npm 上，因此你还需要一个 npm 账号。它们是免费的.
在 npm signup page 注册 npm 账户，并填写表格。
接下来，在命令行中运行 npm adduser:
> npm adduser
Username: yournpmusername
Password:
Email: (this IS public) you@example.com
Logged in as yournpmusername on https://registry.npmjs.org/.
如果并未正常运行，请联系 npm 解决。
构建我们的 WebAssembly npm 包
万事俱备，来创建一个新的 Rust 包吧。打开你用来存放你私人项目的目录，做这些事：
$ cargo new --lib hello-wasm
Created library `hello-wasm` project
这里会在名为 hello-wasm 的子目录里创建一个新的库，里面有下一步之前你所需要的一切：
+-- Cargo.toml
+-- src
+-- lib.rs
首先，我们有一个 Cargo.toml 文件，这是我们配置构建的方式。
接下来，Cargo 在 src/lib.rs 生成了一些 Rust 代码：
#[cfg(test)]
mod tests {
#[test]
fn it_works() {
assert_eq!(2 + 2, 4);
}
}
我们完全不需要使用这些测试代码，所以继续吧，我们删掉它。
让我们在 src/lib.rs 写一些代码替换掉原来的：
extern crate wasm_bindgen;
use wasm_bindgen::prelude::*;
#[wasm_bindgen]
extern {
pub fn alert(s: &str);
}
#[wasm_bindgen]
pub fn greet(name: &str) {
alert(&format!("Hello, {}!", name));
}
使用 wasm-bindgen 在 Rust 与 JavaScript 之间通信
第一部分看起来像这样：
extern crate wasm_bindgen;
use wasm_bindgen::prelude:😗;
第一行就像在说“哇 Rust，我们在用一个叫做 wasm_bindgen 的库”。在 Rust 当中，库被称为“crates”，因为我们使用的是一个外部库，所以有 “extern”。
第三行包括了一个将库中的代码引入到你的代码中的使用命令。
wasm-pack 使用另一个工具 wasm-bindgen 来提供 JavaScript 和 Rust 类型之间的桥梁。它允许 JavaScript 使用字符串调用 Rust API，或调用 Rust 函数来捕获 JavaScript 异常。
在 Rust 中调用来自 JavaScript 的外部函数
接下来的部分看起来像这样：
#[wasm_bindgen]
extern {
pub fn alert(s: &str);
}
在 #[] 中的内容叫做 “属性”，并以某种方式改变下面的语句。在这种情况下，下面的语句是一个 extern，它将告诉 Rust that 我们想调用一些外部定义的函数。这个属性告诉我们 “wasm-bindgen 知道如何找到这些函数”。
第三行是用 Rust 写的函数签名。它告诉我们 “alert 函数接受一个叫做 s 的字符串作为参数。”
当你想调用新的 JavaScript 函数时，你可以在这里写他们，wasm-bindgen 将负责为你设置一切。
编写能够在 JavaScript 中调用的 Rust 函数
最后一部分是这样的：
#[wasm_bindgen]
pub fn greet(name: &str) {
alert(&format!("Hello, {}!", name));
}
我们又看到了 #[wasm_bindgen] 属性。在这里，它并非定义一个 extern 块，而是 fn，这代表我们希望能够在 JavaScript 中使用这个 Rust 函数。这和 extern 正相反：我们并非引入函数，而是要把函数给外部世界使用。
这个函数的名字是 greet，它需要一个参数，一个字符串（写作 &str）。它调用了我们前面在 extern 块中引入的 alert 函数。它传递了一个让我们串联字符串的 format! 宏的调用。
format! 在这里有两个参数，一个格式化字符串和一个要填入的变量。格式化字符串是 “Hello, {}!” 部分。它可以包含一个或多个 {}，变量将会被填入其中。传递的变量是 name，也就是这个函数的参数。所以当我们调用 greet(“Steve”)时我们就能看到 “Hello, Steve!”。
上述字符串被传递到了 alert()，所以当我们调用这个函数时，我们应该能看到一个消息框弹出，其中的内容为“Hello, Steve!”。
把我们的代码编译到 WebAssembly
为了能够正确的编译我们的代码，首先我们需要配置 Cargo.toml。打开这个文件，将内容改为如下所示：
Copy to Clipboard
[package]
name = "hello-wasm"
version = "0.1.0"
authors = ["Your Name <you@example.com>"]
description = "A sample project with wasm-pack"
license = "MIT/Apache-2.0"
repository = "https://github.com/yourgithubusername/hello-wasm"
[lib]
crate-type = ["cdylib"]
[dependencies]
wasm-bindgen = "0.2"
你需要改为自己的仓库，同时 Cargo 需要通过 git 来完善 authors 部分。
最重要的是添加底下的部分。第一个部分 — [lib] — 告诉 Rust 为我们的包建立一个 cdylib 版本；在本教程中我们不会讲解它的含义。
第二个部分是 [dependencies] 部分。在这里我们告诉 Cargo 我们需要依赖哪个版本的 wasm-bindgen ；在这个例子中，它是 0.2.z 版本的 (不是 0.3.0 或者其他版本)。
构建包
现在我们已经完成了所有配置项，开始构建吧！在命令行输入以下命令：
wasm-pack build --scope mynpmusername
这个命令将做一系列事情 (这会花一些时间，特别是当你第一次运行 wasm-pack)。
把我们的包发布到 npm
把我们的新包发布到 npm registry:
cd pkg
npm publish --access=public
我们现在有了一个 npm 包，使用 Rust 编写，但已经被编译为 WebAssembly 了。现在这个包已经可以被 JavaScript 使用了，而且使用它完全不需要用户安装 Rust；包中的代码是 WebAssembly 代码，而不是 Rust 源码！
在网站上使用我们的包
让我们建立一个使用我们包的网站！人们通过各种打包工具使用 npm 包，在本教程中，我们将使用 webpack。它比其他某些打包工具稍微复杂一点，但展示了更实际的用法。
让我们离开pkg目录，并创建一个新目录site，尝试以下操作：
cd ../..
mkdir site
cd site
创建一个新文件 package.json，然后输入如下代码：
{
"scripts": {
"serve": "webpack-dev-server"
},
"dependencies": {
"@mynpmusername/hello-wasm": "^0.1.0"
},
"devDependencies": {
"webpack": "^4.25.1",
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.10"
}
}
请注意，你需要在依赖项部分的 @ 之后填写自己的用户名。
接下来，我们需要配置 Webpack。创建 webpack.config.js 并输入：
const path = require("path");
module.exports = {
entry: "./index.js",
output: {
path: path.resolve(__dirname, "dist"),
filename: "index.js",
},
mode: "development",
};
现在我们需要一个 HTML 文件。创建一个index.html并写入如下内容：
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>hello-wasm example</title>
</head>
<body>
<script src="./index.js"></script>
</body>
</html>
最后，从 HTML 文件中引用index.js：
const js = import("./node_modules/@yournpmusername/hello-wasm/hello_wasm.js");
js.then((js) => {
js.greet("WebAssembly");
});
这将从node_modules文件夹导入我们的模块。这不是最佳做法，但这里只做一个演示，因此暂时就这样用。加载后，它将从该模块调用greet函数，并传入字符串“WebAssembly”参数。注意这里看上去没有什么特别的，但是我们正在调用 Rust 代码！就 JavaScript 代码所知，这只是一个普通模块。
我们已经完成了所有的文件！让我们试一下：
npm install
npm run serve
这将启动一个 Web 服务器。访问 http://localhost:8080，你应该会在屏幕上看到一个内容为 Hello, WebAssembly! 的警告框。我们已经成功地从 JavaScript 调用了 Rust，并从 Rust 调用了 JavaScript。
相关文章：
并发编程下的集合：数组寻址、LinkedList、HashMap、ConcurrentHashMap
如果发现hash取模后的数组索引位下无元素则直接新增，若不是空那就说明存在hash冲突，则判断数组索引位链表结构中的第一个元素的key以及hash值是否与新的key一致则直接覆盖，若不一致则判断当前的数组索引下的链表结构是否为红黑树，若为红黑树则走红黑树的新增方法，若不为红黑树则遍历当前链表结构，遍历中发现某个节点元素的next为null是则直接将新元素指针与next进行关联，若在遍历到next为空前判断到，某个节点的key以及key的hash值与新的key与新的keyhash值一致时则走覆盖。
【日常开发之Windows共享文件】Java实现Windows共享文件上传下载
下拉框选择你选择的用户点击添加，然后共享确定。创建一个文件夹然后点击属性界面，点击共享。maven版本存在于SMB协议的兼容问题。首先开启服务，打开控制面板点击程序。点击启用或关闭Windows功能。我这边是专门创建了一个用户。SMB1.0选中红框内的。
iced 入门一
本教程的目标是创建一个简单的购物清单应用程序。我们希望允许添加和删除购物清单中的项目。在编写代码之前，我们必须首先了解 Iced 构建的结构：Elm 架构。它是 GUI 库使用的架构，最初用于 Elm 编程语言。它的核心原则很简单。它围绕三个概念构建：模型、视图和更新。
注解annotation
Kubernetes的系统组件（例如，kube-scheduler、kube-controller-manager、kube-apiserver、kubectl 或其他第三方组件）向用户的Kubernetes对象添加注解时，必须指定一个前缀。注解（annotation）可以用来向 Kubernetes 对象的 metadata.annotations 字段添加任意的信息。除了使用注解，您也可以将这类信息存放在一个外部的数据库，然而，在使用、分享这些信息的时候，可能会变得难以管理。
Rust XTask 模式介绍与应用
XTask（扩展任务）是一种在Rust项目中定义和执行自定义构建任务的方式。它通过创建一个独立的Rust库或二进制项目来封装这些任务，利用Rust语言的强类型、安全性和跨平台能力，使得构建流程更加健壮、可读和可维护。
ModuleNotFoundError: No module named ‘qcloud_cos‘
是腾讯云提供的一个Python SDK，用于与腾讯云对象存储（COS）服务进行交互。使用pip安装qcloud_cos报以下错误。这个错误表示Python无法找到名为。
需要在method方法被调用之后，仅打印出a=100,b=200,请写出method方法的代码
通常，此流对应于显示器输出或者由主机环境或用户指定的另一个输出目标。通常，此流对应于键盘输入或者由主机环境或用户指定的另一个输入源。public static final PrintStream err“标准”错误输出流。PrintStream 是打印输出流，它继承于FilterOutputStream。第二个用的是用的是char类型，根本不是方法，当要输出方法体的时候，会给你遍历数组。通常，此流对应于显示器输出或者由主机环境或用户指定的另一个输出目标。诡异的是，如果错了，面试官对你说了一句：你回去看看，
一个合格的Java选手必须要掌握的并发锁知识
Java内置锁：基于Java语法层面(关键词)实现的锁，主要是根据Java语义来实现，最典型的应用就是synchronized。Java显式锁：基于JDK层面实现的锁，主要是根据基于Lock接口和ReadWriteLock接口，以及统一的AQS基础同步器等来实现，最典型的有ReentrantLock。使用方式：synchronized关键字互斥锁主要有作用于对象方法上面，作用于类静态方法上面，作用于对象方法里面，作用于类静态方法里面等4种方式。
Integer.toHexString(b & 0xff)理解以及& 0xff什么意思
首先toHexString传的参数应该是int类型32位，此处传的是byte类型8位，所以前面需要补24个0。然后& 0xff 就是把前面24个0去掉只要后8位。toHexString(b & 0xff)相当于做了一次位的与运算，将前24位字符省略，将后8位保留。是两个十六进制的数,每个f用二进制表示是1111,所以占四位（bit）,两个f（）占八位（bit），八位（bit）也就是一个字节（byte）.这个方法是把字节（转换成了int）以16进制的方式显示。我的理解是这样，如有不对欢迎指正！
使用JavaScript实现复杂功能：一个完整的电商网站搜索功能
随着互联网的发展，电子商务网站已经成为人们购物的重要平台。而在这些网站中，搜索功能无疑是核心功能之一。用户可以通过搜索快速找到他们需要的商品，从而提高购物体验。本文将详细介绍如何使用JavaScript实现一个完整的电商网站搜索功能。
C++并发编程：互斥锁std::mutex和lock_guard的使用
对象离开其作用域时，会自动调用析构函数，该析构函数会释放锁。这确保了在任何情况下（包括由于异常等原因导致的提前退出），锁都会被正确释放，从而避免了忘记手动释放锁而导致的死锁问题。mutex 用于控制多个线程访问共享资源，确保在任意时刻只有一个线程可以访问该资源，避免数据竞争。这确保了同一时刻只有一个线程可以访问被保护的资源，从而防止多线程并发访问导致的数据不一致性。是 C++ 标准库中提供的一个模板类，用于在其构造时自动获取锁，在析构时自动释放锁。是 C++ 标准库中提供的一种用于多线程同步的互斥锁实现。
上位机图像处理和嵌入式模块部署（qt插件的使用）
【 声明：版权所有，欢迎转载，请勿用于商业用途。 联系信箱：feixiaoxing @163.com】 一个软件一般有很多的功能，但是主流程只有一个。但在软件开发的过程当中，一般来说功能是需要不断添加的，但是主流程最好不要轻易修改。这里的插件就相当于各种各样的功能，而主流程就是如何怎么去调用这些插件的功能。所以，今天正好来学一下怎么添加qt插件，个人觉得这部分还是非常重要的。
C程序的内存空间布局（栈、堆、数据区、常量区、代码区）
较详细的介绍了栈、堆、数据区、常量区、代码区
Java中的四种访问权限（private,public,protected,无修饰）
/实体类属性和数据库字段名称不一致//实体类属性和数据库字段名称不一致return id;return age;emp.test();//直接调用public修饰的变量//private修饰的变量进行赋值//调用private修饰的变量1、public修饰符定义的属性和方法通过对象实例化进行调用，2、private修饰的属性通过set、get方法进行调用。
Java中的方法重载和方法重写有什么区别？
Java中的方法重载（Overloading）和方法重写（Overriding）都是面向对象编程中的重要概念，但它们之间有一些区别。方法重载是指在同一个类中，可以定义多个具有相同名称但参数列表不同的方法。这些方法具有不同的参数类型、参数个数或参数顺序。在调用重载方法时，Java编译器会根据传递给方法的参数类型和数量来选择要调用的正确方法。方法重载主要用于解决方法的命名冲突和提高代码的可读性和可维护性。
python基础使用之变量，表达式，语句
PYTHON基础知识系列之变量、表达式、语句
C语言常见面试题：什么是宏，宏的作用是什么？
宏在计算机科学中是一种批量处理程序命令，它是一种抽象的规则或模式，用于说明某一特定输入（通常是字符串）如何根据预定义的规则转换成对应的输出（通常也是字符串）。在编译时，预处理器会对宏进行展开，即将宏的内容替换到宏所在的位置。以上是宏的一些主要作用，但并不是全部。在实际编程中，根据需要选择是否使用宏以及如何使用宏，以实现更好的代码组织和可读性。，这样就可以计算出a和b的和。这个例子展示了宏的基本用法和作用。在这个例子中，我们定义了一个宏。，用于计算两个数的和。时，预处理器会将其展开为。
python基础小知识：引用和赋值的区别
通过引用，就可以在程序范围内任何地方传递大型对象而不必在途中进行开销巨大的赋值操作。不过需要注意的是，这种赋值仅能做到顶层赋值，如果出现嵌套的情况下仍不能进行深层赋值。赋值与引用不同，复制后会产生一个新的对象，原对象修改后不会影响到新的对象。如果在原位置修改这个可变对象时，可能会影响程序其他位置对这个对象的引用
Golang 搭建 WebSocket 应用（八） - 完整代码
本文应该是本系列文章最后一篇了，前面留下的一些坑可能后面会再补充一下，但不在本系列文章中了。
Python自动化实战之接口请求的实现
作为一位过来人也是希望大家少走一些弯路，如果你不想再体验一次学习时找不到资料，没人解答问题，坚持几天便放弃的感受的话，在这里我给大家分享一些自动化测试的学习资源，希望能给你前进的路上带来帮助。
C#winform上位机开发学习笔记3-串口助手的信息保存功能添加
上位机开发的系列学习笔记，避免遗忘多记录多补充多优化
前端JS代码中Object类型数据的相关知识
遍历JavaScript中的对象有几种方法，包括使用for…in循环、Object.keys()方法、Object.values()方法和Object.entries()方法。因此前端传入了日期类型数据之后，如果和后台数据库中的数据类型不一致，比如数据库中的日期数据类型格式是。前端传入的Object对象中其中某个字段值是日期类型的数据，则在前端的类型就是一个。，则数据传往后端之前需要做格式类型转换。，它的值是一个中国标准时间，比如。
Rust之旅 - Rust概念、Windows安装、环境配置
本章节介绍Rust概念、Windows安装、环境配置以及最初级的语法。至此，我们就成功的构建了一个Rust程序，并成功在Visual Studio Code里运行了这个程序，万事俱备，我们就可以开始Rust之旅了。资料获取，更多粉丝福利，关注下方公众号获取。
C语言中常用的字符串处理函数和内存操作函数
`memmove(void *destination, const void *source, size_t num)`：将`source`指向的内存块的前`num`个字节移动到`destination`所指向的内存块，即使内存块有重叠部分。返回指向`destination`的指针。- `memcpy(void *destination, const void *source, size_t num)`：将`source`指向的内存块的前`num`个字节复制到`destination`所指向的内存块。
一键式Excel分词统计工具：如何轻松打包Python脚本为EXE
最近，表姐遇到了一个挑战：需要从Excel文件中统计出经过分词处理的重复字段，但由于数据隐私问题，这些Excel文件不能外传。这种情况下，直接使用Excel内置功能好像是行不通的，需要借助Python脚本来实现。为了解决这个问题，我写了一个简单的数据分析和自动化办公脚本，以方便使用。想象一下，即使电脑上没有安装Python，也能通过一个简单的EXE文件轻松完成工作，这是多么方便！因此，我决定不仅要写出这个脚本，还要学会如何将其打包成一个独立的EXE文件。这样，无需Python环境的电脑也能直接运行它
深入解析JavaScript的原生原型
在JavaScript中,除了自定义对象,还存在很多由JavaScript语言本身提供的原生对象。这些原生对象同样基于原型继承机制,拥有自己的原型。理解原生对象的原型非常重要,可以让我们正确使用这些内置对象,也有助于进一步理解JavaScript的原型继承系统。本文将详细解析原生对象的原型结构,揭开一些常见原生对象原型的神秘面纱。学习原生对象的原型关系,有助于我们在日常开发中正确理解和使用这些JavaScript内置对象,避免一些常见陷阱。
深入三目运算符：JavaScript、C++ 和 Python 比较
三目运算符是编程中常用的条件表达式，它允许我们根据条件选择不同的值。我们将通过具体的例子分别介绍 JavaScript、C++ 和 Python 中的三目运算符，以便更好地理解它们的用法和特性。JavaScript 示例// 例子: 根据条件选择不同的值var x = 10;var y = 20;"x 大于 y" : "x 不大于 y";在这个例子中，如果x大于y，则result的值为 “x 大于 y”，否则为 “x 不大于 y”。C++ 示例// 例子: 根据条件选择不同的值。
Java中的4种引用类型，你知道几种？
Java作为一门面向对象的编程语言，内存管理一直是程序员需要关注的重要方面。在Java中，垃圾回收机制负责自动管理内存，而引用类型则是垃圾回收的重要参考。本文将深入讨论Java中的四种引用类型：强引用、弱引用、软引用和虚引用，以及它们在内存管理中的应用和区别。
python实现网络爬虫代码_python如何实现网络爬虫
2、【find()】和【find_all()】方法可以遍历这个html文件，提取指定信息。return soup.find_all(string=re.compile( '百度' )) #结合正则表达式，实现字符串片段匹配。print(res) #打印输出[root@localhost demo]# python3 demo1.py。[root@localhost demo]# vim demo.py#web爬虫学习 -- 分析。r.raise_for_status() #如果状态码不是200，产生异常。
深入浅出：Golang内存逃逸机制与性能优化技巧
内存逃逸发生在编译期间，当编译器判断一个变量的生命周期超出了其当前作用域，它会将该变量分配到堆上，而非栈上。这种情况虽然保证了程序的正确性，但会增加垃圾回收的负担，从而影响程序性能。通过本文的深入探讨，我们了解了Golang内存逃逸的基本原理，以及它是如何影响程序性能的。我们探讨了内存逃逸的常见场景，并通过具体的代码示例展示了这些问题的出现和解决方法。最重要的是，我们学习了一系列性能优化技巧，包括数据结构优化、减少不必要的指针使用、利用栈空间、使用内存池，以及定期进行性能分析。