当前位置： 首页 > news >正文

Rust开发WASM，浏览器运行WASM

news 2026/3/27 7:31:04

首先需要安装wasm-pack

cargo install wasm-pack

使用cargo创建工程

cargo new --lib mywasm

编辑Cargo.toml文件，修改lib的类型为cdylib，并且添加依赖wasm-bindgen

[package]
name = "mywasm"
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"

修改代码lib.rs

use wasm_bindgen::prelude::*;#[wasm_bindgen]
pub fn add(n1: usize, n2: usize) -> usize {n1 + n2
}

编译lib.rs生成wasm

wasm-pack build --target web

下载wasm-bindgen的过程大概需要10分钟，请耐心等待。

接下来创建文件index.html，使用wasm

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>wasm web demo</title></head><body><script type="module">import init, {add} from "./pkg/mywasm.js";init().then(() => {console.log("add(1,2) = " + add(1, 2))});</script></body>
</html>

启动测试用web server

python3 -m http.server 8000

打开chrome访问http://localhost:8000，并且打开调试控制台，可以看到运行结果。

相关文章：

Rust开发WASM，浏览器运行WASM

首先需要安装wasm-pack cargo install wasm-pack 使用cargo创建工程 cargo new --lib mywasm 编辑Cargo.toml文件&#xff0c;修改lib的类型为cdylib&#xff0c;并且添加依赖wasm-bindgen [package] name "mywasm" version "0.1.0" edition "…...

编程日记 2024/2/9 8:53:48

Vue3编写简单的App组件(二)

一、Vue3页面渲染基本流程 1、入口文件 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><link rel"icon" href"/favicon.ico"><meta name"viewport" content"widthde…...

编程日记 2024/2/9 8:52:46

java Servlet 云平台教学系统myeclipse定制开发SQLServer数据库网页模式java编程jdbc

一、源码特点 JSP 云平台教学系统是一套完善的web设计系统&#xff0c;对理解JSP java编程开发语言有帮助 系统采用serlvet dao bean&#xff0c;系统具有完整的源代码和数据库 &#xff0c;系统主要采用B/S模式开发。开发 环境为TOMCAT7.0,Myeclipse8.5开发&#xff0c;数据…...

编程日记 2024/2/9 8:51:45

QT初始程序

#include "widget.h"#include <QApplication>int main(int argc, char *argv[]){QApplication a(argc, argv);Widget w;w.show();return a.exec();} 解释&#xff1a; Qt系统提供的类头文件没有.h后缀Qt一个类对应一个头文件&#xff0c;类名和头文件名一致QA…...

编程日记 2024/2/9 8:48:40

ubuntu22.04@laptop OpenCV Get Started: 001_reading_displaying_write_image

ubuntu22.04laptop OpenCV Get Started: 001_reading_displaying_write_image 1. 源由2. Read/Display/Write应用Demo2.1 C应用Demo2.2 Python应用Demo 3. 过程分析3.1 导入OpenCV库3.2 读取图像文件3.3 显示图像3.4 保存图像文件 4. 总结5. 参考资料 1. 源由 读、写、显示图像…...

编程日记 2024/2/9 8:47:40

51单片机之LED灯模块篇

御风以翔 破浪以飏 &#x1f3a5;个人主页 &#x1f525;个人专栏 目录 点亮一盏LED灯 LED的组成原理 LED的硬件模型 点亮一盏LED灯的程序设计 LED灯闪烁 LED流水灯 独立按键控制LED灯亮灭 独立按键的组成原理 独立按键的硬件模型 独立按键控制LED灯状态 按键的抖动 独立按键…...

编程日记 2024/2/9 8:42:32

springboo冬奥会科普平台源码和论文

随着信息技术和网络技术的飞速发展&#xff0c;人类已进入全新信息化时代&#xff0c;传统管理技术已无法高效&#xff0c;便捷地管理信息。为了迎合时代需求&#xff0c;优化管理效率&#xff0c;各种各样的管理平台应运而生&#xff0c;各行各业相继进入信息管理时代&#xf…...

编程日记 2024/2/9 8:39:29

改进神经网络

Improve NN 文章目录 Improve NNtrain/dev/test setBias/Variancebasic recipeRegularizationLogistic RegressionNeural networkother ways optimization problemNormalizing inputsvanishing/exploding gradientsweight initializegradient checkNumerical approximationgrad…...

编程日记 2024/2/9 8:37:27

HarmonyOS 开发学习笔记

HarmonyOS 开发学习笔记 一、开发准备1.1、了解ArkTs语言1.2、TypeScript语法1.2.1、变量声明1.2.2、条件控制1.2.3、函数1.2.4、类和接口1.2.5、模块开发 1.3、快速入门 二、ArkUI组件2.1、Image组件2.2、Text文本显示组件2.3、TextInput文本输入框组件2.4、Button按钮组件2.5…...

编程日记 2024/2/9 8:36:26

maven java 如何打纯源码zip包

一、背景 打纯源码包给第三方进行安全漏洞扫描 二、maven插件 项目中加入下面的maven 插件 <!-- 要将源码放上去&#xff0c;需要加入这个插件 --><plugin><artifactId>maven-source-plugin</artifactId><version>2.4</version><con…...

编程日记 2024/2/9 8:34:24

Altium Designer（AD）原理图库添加阵列管脚图文教程及视频演示

🏡《专栏目录》 目录 视频演示1，概述2，添加方法3，总结视频演示 Altium Designer（AD24）原理图库添加阵列管脚 欢迎点击浏览更多高清视频演示 1，概述...

编程日记 2024/2/9 8:33:23

P3647 题解

文章目录 P3647 题解OverviewDescriptionSolutionLemmaProof Main Code P3647 题解 Overview 很好的题&#xff0c;但是难度较大。 模拟小数据&#xff01;——【数据删除】 Description 给定一颗树&#xff0c;有边权&#xff0c;已知这棵树是由这两个操作得到的&#xff1…...

编程日记 2024/2/9 8:31:21

Vivado Tri-MAC IP的例化配置（三速以太网IP）

目录 1 Tri-MAC IP使用RGMII接口的例化配置1.1 Data Rate1.2 interface配置1.3 Shared Logic配置1.4 Features 2 配置完成IP例化视图 1 Tri-MAC IP使用RGMII接口的例化配置 在网络设计中&#xff0c;使用的IP核一般为三速以太网IP核&#xff0c;使用时在大多数场景下为配置为三…...

编程日记 2024/2/9 8:28:18

交友系统---让陌生人变成熟悉人的过程。APP小程序H5三端源码交付，支持二开。

随着社交网络的发展和普及&#xff0c;人们之间的社交模式正在发生着深刻的变革。传统的线下交友方式已经逐渐被线上交友取而代之。而同城交友正是这一趋势的产物&#xff0c;它利用移动互联网的便利性&#xff0c;将同城内的人们连接在一起&#xff0c;打破了时空的限制&#…...

编程日记 2024/2/9 8:20:12

uni-app 经验分享，从入门到离职（三）——关于 uni-app 生命周期快速了解上手

文章目录 &#x1f4cb;前言⏬关于专栏 &#x1f3af;什么是生命周期&#x1f9e9;应用生命周期&#x1f4cc; 关于 App.vue/App.uvue &#x1f9e9;页面生命周期&#x1f4cc;关于 onShow 与 onLoad 的区别 &#x1f9e9;组件生命周期 &#x1f4dd;最后 &#x1f4cb;前言 这…...

编程日记 2024/2/9 8:19:09

PostgreSQL 与 MySQL 相比，优势何在？

我们将通过一张对比表格详细列出 PostgreSQL 与 MySQL 在不同方面的对比&#xff1a; 对比表格 特性/数据库PostgreSQLMySQL数据类型支持支持JSON/JSONB、数组、区间等高级数据类型基本数据类型支持&#xff0c;JSON支持较普通遵循SQL标准更严格遵循&#xff0c;支持复杂查询…...

编程日记 2024/2/9 8:17:08

Linux（三）--文件系统

Linux命令简介 [rootlocalhost ~]# 表示 Linux 系统的命令提示符。 []&#xff1a;这是提示符的分隔符号&#xff0c;没有特殊含义。 root&#xff1a;显示的是当前的登录用户&#xff0c;笔者现在使用的是 root 用户登录。 &#xff1a;分隔符号&#xff0c;没有特殊含义。 l…...

编程日记 2024/2/9 8:16:07

DC-8靶机渗透详细流程

信息收集&#xff1a; 1.存活扫描&#xff1a; arp-scan -I eth0 -l └─# arp-scan -I eth0 -l Interface: eth0, type: EN10MB, MAC: 00:0c:29:dd:ee:6a, IPv4: 192.168.10.129 Starting arp-scan 1.10.0 with 256 hosts (https://github.com/royhills/arp-scan) 192.168.10…...

编程日记 2024/2/9 8:13:04

SolidWorks学习笔记——入门知识2

目录 建出第一个模型 1、建立草图 2、选取中心线 3、草图绘制 4、拉伸 特征的显示与隐藏 改变特征名称 5、外观 6、渲染 建出第一个模型 1、建立草图 图1 建立草图 按需要选择基准面。 2、选取中心线 图2 选取中心线 3、草图绘制 以对称图形举例&#xff0c;先画出…...

编程日记 2024/2/9 8:11:02

Elasticsearch：通过 ingest pipeline 对大型文档进行分块

在我之前的文章 “Elasticsearch&#xff1a;使用 LangChain 文档拆分器进行文档分块” 中&#xff0c;我详述了如何通过 LangChain 对大的文档进行分块。那个分块的动作是通过 LangChain 在 Python 中进行实现的。对于使用版权的开发者来说&#xff0c;我们实际上是可以通过 i…...

编程日记 2024/2/9 8:09:00

WordPress主题开发实战：从零开始搭建你的第一个自定义主题（2024最新版）

WordPress主题开发实战&#xff1a;从零开始搭建你的第一个自定义主题&#xff08;2024最新版&#xff09; 如果你正准备踏入WordPress主题开发的世界&#xff0c;这篇文章将带你从零开始构建一个完整的自定义主题。不同于简单的仿制或修改现有主题&#xff0c;我们将深入探讨如…...

编程新知 2026/3/27 6:57:25

深入FFmpeg解码器：从avcodec_send_packet看硬解与软解的实现差异

深入FFmpeg解码器&#xff1a;从avcodec_send_packet看硬解与软解的实现差异 在多媒体处理领域&#xff0c;FFmpeg无疑是开发者最常接触的开源框架之一。其强大的编解码能力支撑着从视频播放器到直播系统的各类应用&#xff0c;而解码器作为其中的核心组件&#xff0c;其性能直…...

编程新知 2026/3/27 6:19:03

HP-Socket创新项目原型迭代记录：变更、原因与效果

HP-Socket创新项目原型迭代记录&#xff1a;变更、原因与效果 【免费下载链接】HP-Socket High Performance TCP/UDP/HTTP Communication Component 项目地址: https://gitcode.com/gh_mirrors/hp/HP-Socket HP-Socket作为一款高性能TCP/UDP/HTTP通信组件&#xff0c;其…...

编程新知 2026/3/27 5:42:55

A860-2155-T611发那科分离式增量型主轴编码器

型号&#xff1a;A860-2155-T611全称&#xff1a;αiBZ SENSOR ASSY 512 (THIN TYPE) 薄型传感器总成品牌&#xff1a;FANUC&#xff08;发那科&#xff09;类型&#xff1a;分离式增量型主轴编码器&#xff08;薄型&#xff09;一、产品特性薄型分离式设计&#xff1a;传感器头…...

编程新知 2026/3/27 5:10:43

第12课：从 SPI 环路、CAN 通信到 SD 与 eMMC 存储实战

本节路线图 先把三条主线分开：控制总 → SPI环路测试：先把时序 → CAN：换一条总线，世界 小猫提醒 这节有分区、烧录或删除类操作，先确认盘符和路径，再按回车。 如果说上一课的关键词是“事件、时间和系统能力”，那这一课的关键词就是“总线、协议和数据落地”。 我们要…...

编程新知 2026/3/27 4:54:16

测试用例设计-XMind

&#x1f680; 一、XMind 用例设计核心思路&#x1f449; 和传统Excel不同&#xff0c;XMind强调&#xff1a;以“功能模块”为主干 以“用户场景”为分支 以“测试点”为叶子节点&#x1f449; 本质结构&#xff1a;模块 → 场景 → 用例点 → 具体测试数据/预期&#x1f4cc;…...

编程新知 2026/3/27 4:38:01

RMBG-1.4动态演示：AI净界处理长发人物的流畅抠图过程

RMBG-1.4动态演示&#xff1a;AI净界处理长发人物的流畅抠图过程 1. 引言&#xff1a;当抠图遇上飘逸长发 你有没有遇到过这样的烦恼&#xff1f;想给一张长发飘飘的人像照片换个背景&#xff0c;结果发现发丝边缘怎么都处理不干净&#xff0c;要么像被狗啃过一样参差不齐&am…...

编程新知 2026/3/26 22:44:21

OpenClaw成本优化方案：nanobot轻量镜像替代高价API实测

OpenClaw成本优化方案&#xff1a;nanobot轻量镜像替代高价API实测 1. 为什么需要关注OpenClaw的成本问题 去年冬天&#xff0c;当我第一次用OpenClaw完成邮件自动回复的完整流程时&#xff0c;既兴奋又心疼。兴奋的是它真的能像人类一样读取邮件、分析内容、生成回复&#x…...

编程新知 2026/3/26 21:23:58

IOMMU性能调优全攻略：从基础原理到实战技巧

IOMMU性能调优全攻略&#xff1a;从基础原理到实战技巧 在数据中心和云计算环境中&#xff0c;IOMMU&#xff08;输入输出内存管理单元&#xff09;作为硬件辅助虚拟化的关键技术组件&#xff0c;其性能表现直接影响着整个系统的吞吐量和延迟。对于需要处理高并发I/O负载的场景…...

编程新知 2026/3/26 21:05:50

脉冲神经网络也能玩转频域？FSTA-SNN时空注意力模块的5个实战应用场景

脉冲神经网络频域建模实战&#xff1a;FSTA-SNN模块的五大创新应用 脉冲神经网络&#xff08;SNN&#xff09;作为第三代神经网络&#xff0c;近年来在计算机视觉领域展现出独特优势。传统SNN模型在时空特征提取上存在明显短板&#xff0c;而FSTA-SNN模块的提出为这一困境提供了…...

编程新知 2026/3/26 20:49:49