WebAssembly MDN简单使用
MDN 就是通过编译器编译完成c后生成的胶水代码 引入js 就能直接调用定义在c或者c++中的函数了
c代码如下:
- #include <stdio.h>
- #include <stdlib.h>
- #include <time.h>
- //emscripten 的头文件
- #include <emscripten/emscripten.h>
- // 一旦WASM模块被加载，main()中的代码就会执行
- int main() {
- printf("WebAssembly module Hello world!!\n");
- }
- // 返回1-10之间的一随机数
- //EMSCRIPTEN_KEEPALIVE 宏定义防止删除除main之外的函数
- int EMSCRIPTEN_KEEPALIVE abc() {
- srand ( time(NULL) );
- return rand() % + ;
- }
html与js代码:
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
- <title>Document</title>
- </head>
- <body>
- <h1>WebAssembly module Hello world!!</h1>
- <p class="aa"></p>
- <p class="a"></p>
- <button class="btn">点击出现随机数</button>
- <script src="index.js"></script>
- <script>
- //Module为全局对象可以直接Module._abc();调用c函数也可以_abc()直接函数名调用
- //注意页面初始化时候调用需要先调用 Module.onRuntimeInitialized
- document.querySelector(".btn").onclick = function(){
- let a = Module._abc();
- document.querySelector(".aa").innerText = a;
- document.querySelector(".a").innerText = _abc();
- }
- </script>
- </body>
- </html>
编译器使用emscripten编译指令为： emcc hello.c -s WASM=1 -O3 -o index.js
具体编译命令的含义请看emscripten官方文档！！
WebAssembly MDN简单使用的更多相关文章
- 【译】使用 Rust 和 WebAssembly 构建离线画图页面
原文地址:https://dev.to/sendilkumarn/create-dev-s-offline-page-with-rust-and-webassembly-21gn 原文仓库:https ...
- 愚蠢的遗留BUG
二次开发本来就是很恶心的事,我竟然是三次开发. 今天遇到一个BUG,上传图片的时候报错了,操作过程很简答,点击上传按钮,选择图片,确定上传,如图: 报错信息很直白,也很奇怪: (为了写博客,把代码回滚 ...
- 我的web聊天之---序章
有时候自我感觉良好,人啊就开始膨胀,细细想来,自己还是那么苍白.---- 致傻傻的我 大家都知道,平时上班总是拿着手机看看微信,看看新闻,这个不太好,这不是重点,重点是我们公司web版本的微信,QQ都 ...
- 浏览器上的Qt Quick
你想不想在浏览器上运行你的Qt Quick程序呢?在Qt 5.12之前,唯一的方法是使用Qt WebGL Streaming技术把界面镜像到浏览器上.但该方法有不少缺陷,下文会说.前不久随着Qt 5. ...
- 【重温基础】instanceof运算符
最近开始在整理ES6/ES7/ES8/ES9的知识点(已经上传到 我的博客 上),碰到一些知识点是自己已经忘记(用得少的知识点),于是也重新复习了一遍. 这篇文章要复习的 instanceof 是我在 ...
- WebAssembly简单指导---译
开发者指导 本页面提供一步一步的操作将一个简单的程序编译成webassembly 前提要求 为了编译成webAssembly,需要提前安装一些工具: Git.在Linux和OSX下已自带了Git,在W ...
- ASP.NET Core Blazor WebAssembly实现一个简单的TODO List
基于blazor实现的一个简单的TODO List 最近看到一些大佬都开始关注blazor,我也想学习一下.做了一个小的demo,todolist,仅是一个小示例,参考此vue项目的实现http:// ...
- WebAssembly让你的Javascript计算性能提升70%
现在的JavaScript代码要进行性能优化,通常使用一些常规手段,如:延迟执行.预处理.setTimeout等异步方式避免处理主线程,高大上一点的会使用WebWorker.即使对于WebWorker ...
- WebAssembly是什么？
现在的JavaScript代码要进行性能优化,通常使用一些常规手段,如:延迟执行.预处理.setTimeout等异步方式避免处理主线程,高大上一点的会使用WebWorker.即使对于WebWorker ...
随机推荐
- IT兄弟连 JavaWeb教程 Servlet会话跟踪 创建Cookie
Tomcat作为Web服务器,对Cookie提供了良好的支持.那么,运行在Tomcat的Servlet该如何访问Cookie呢?幸运的是,Servlet无需直接和HTTP请求或响应中的原始Cookie ...
- 11-1模拟赛 By cellur925
期望得分:70+100+60 实际得分:70+20+60 \(qwq\). T1:有一个 \(n\) × \(n\) 的 \(01\) 方格, 图图要从中选出一个面积最大的矩形区域, 要求这个矩形区域 ...
- Unable to load script from assets 'index.android.bundle'.Make sure your bundle is packaged correctly or you're running a packager server
curl -k 'http://localhost:8081/index.android.bundle?platform=android' > android/app/src/main/asse ...
- E. Cyclic Components (DFS)（Codeforces Round #479 (Div. 3)）
#include <bits/stdc++.h> using namespace std; *1e5+; vector<int>p[maxn]; vector<int&g ...
- 字符串匹配，KMP算法
KMP的详解见:https://segmentfault.com/a/1190000008575379 主要难点在于Next数组的理解,KMP是不需要回溯的匹配算法. #include<iost ...
- Dubbo端口占用错误信息
SEVERE: Exception sending context initialized event to listener instance of class com.common.SysCont ...
- vue.js 中如何解除绑定事件
我们项目中有一个点赞需求,只允许点击一次赞,再次点击则取消赞, 为了防止用户多次连续点击,在点赞后需要解绑事件,成功调取API后,才可再次点击取消赞. 目前用的方法是加入一个flag控制点击事件可否点 ...
- web基础笔记
浏览器渲染页面的过程 浏览器渲染页面前需要先构建 DOM 和 CSSOM 树.因此,我们需要确保尽快将 HTML 和 CSS 都提供给浏览器. 参考:https://developers.google ...
- html 手机端click 事件去掉黑色阴影效果
添加css样式 html{-webkit-text-size-adjust: 100%;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);} 1. -web ...
- 简单的鼠标经过特效-mouse事件
<!doctype html> <html lang="zh-cn"> <head> <meta charset="UTF-8& ...