We use an offset exporting function to get the address of a string in WebAssembly memory. We then create a typed array on top of the WebAssembly memory representing the raw string data, and decode that into a JavaScript string.

WASM Fiddle: https://wasdk.github.io/WasmFiddle/?6wzgh

Demo Repo: https://github.com/guybedford/wasm-intro

C code:

char str[] = "Hello World";

char* getStrOffset () {
return &str[];
}

Here we created a pointer, point to the first chat of the string array.

When we compile the C code to the WASM:

(module
(table anyfunc)
(memory $ )
(data (i32.const ) "Hello World\00")
(export "memory" (memory $)) # export memory to JS
(export "getStrOffset" (func $getStrOffset))
(func $getStrOffset (result i32)
(i32.const ) # getStrOffset function return the address in memory as i32.const 16
)
)

Now inside JS, we can get the "memory":

var wasmModule = new WebAssembly.Module(wasmCode);
var wasmInstance = new WebAssembly.Instance(wasmModule, wasmImports); const memory = wasmInstance.exports.memory;

And remember that it points to the first chat's address in memory.

So we can use Unit8Array to read buffer:

const strBuf = new Uint8Array(memory.buffer, wasmInstance.exports.getStrOffset(), 11); // read biffer from the memory, getStrOffset return the first chat address, and since string (Hello World) is 11 lenght
const str = new TextDecoder().decode(strBuf);
log(str); // Hello World

[WASM] Read WebAssembly Memory from JavaScript的更多相关文章

  1. [WASM] Write to WebAssembly Memory from JavaScript

    We write a function that converts a string to lowercase in WebAssembly, demonstrating how to set the ...

  2. [WASM] Access WebAssembly Memory Directly from JavaScript

    While JavaScript has a garbage-collected heap, WebAssembly has a linear memory space. Nevertheless u ...

  3. WebAssembly是解决JavaScript 痼疾的银弹?

    写在前面 <没有银弹>是 Fred Brooks 在 1987 年所发表的一篇关于软件工程的经典论文.该论文的主要论点是,没有任何一项技术或方法可以能让软件工程的生产力在十年内提高十倍. ...

  4. (翻译) How variables are allocated memory in Javascript? | scope chain | lexicial scope

    总结: 阅读下面文章需要15分钟 提问者的问题是JavaScript中内存是怎么分配的,在介绍的过程作者涉及计到了JS中 Scope Chain和调用函数call生成lexicial environm ...

  5. [WASM] Run WebAssembly in Node.js using the node-loader

    WebAssembly is great for targeting performance bottlenecks in the browser. Now with node-loader, we ...

  6. ASP.NET Core Blazor WebAssembly 之 .NET JavaScript互调

    Blazor WebAssembly可以在浏览器上跑C#代码,但是很多时候显然还是需要跟JavaScript打交道.比如操作dom,当然跟angular.vue一样不提倡直接操作dom:比如浏览器的后 ...

  7. WebAssembly让你的Javascript计算性能提升70%

    现在的JavaScript代码要进行性能优化,通常使用一些常规手段,如:延迟执行.预处理.setTimeout等异步方式避免处理主线程,高大上一点的会使用WebWorker.即使对于WebWorker ...

  8. WebAssembly完全入门——了解wasm的前世今身

    前言 接触WebAssembly之后,在google上看了很多资料.感觉对WebAssembly的使用.介绍.意义都说的比较模糊和笼统.感觉看了之后收获没有达到预期,要么是文章中的例子自己去实操不能成 ...

  9. [WASM] Set up wasm-bindgen for easy Rust/JavaScript Interoperability

    Interoperability between JavaScript and Rust is limited to numerics and accessing memory directly. S ...

随机推荐

  1. #学习笔记#——JavaScript 数组部分编程(一)

    来自牛客网的js编程题 1.移除数组 arr 中的所有值与 item 相等的元素.不要直接修改数组 arr,结果返回新的数组 function remove(arr, item) { if(!Arra ...

  2. java(数组及常用简单算法 )

    数组 数组:数组是存储同一种数据类型数据的集合容器. 数组的定义格式: 数据类型[]  变量名  =  new  数据类型[长度]; 数组的好处:对分配到数组对象中每一个数据都分配一个编号(索引值.角 ...

  3. Codeforces Round #196 (Div. 2) 少部分题解

    A:sort以后求差值最小 ]; int main() { int n,m; cin>>n>>m; ; i < m ; i++) cin>>a[i]; sor ...

  4. 「HAOI2018」字串覆盖

    「HAOI2018」字串覆盖 题意: ​ 给你两个字符串,长度都为\(N\),以及一个参数\(K\),有\(M\)个询问,每次给你一个\(B\)串的一个子串,问用这个字串去覆盖\(A\)串一段区间的最 ...

  5. 初识Django框架——环境搭建前你需要了解的几点

    Django是一个开放源代码的Web应用框架,由Python写成. 采用了MVC的框架模式,即模型M,视图V和控制器C. 它最初是被开发来用于管理劳伦斯出版集团旗下的一些以新闻内容为主的网站的,即是C ...

  6. Uniform Server

    Uniform Server http://www.uniformserver.com/ https://sourceforge.net/projects/miniserver/files/ Unif ...

  7. @JSONField 注解说明

    转自:https://blog.csdn.net/suyimin2010/article/details/80617538 导入@JSONField 注解: import com.alibaba.fa ...

  8. carousel轮播器

    <div id="myCarousel" class="carousel slide" data-ride="carousel" st ...

  9. bzoj3307雨天的尾巴(权值线段树合并/DSU on tree)

    题目大意: 一颗树,想要在树链上添加同一物品,问最后每个点上哪个物品最多. 解题思路: 1.线段树合并 假如说物品数量少到可以暴力添加,且树点极少,我们怎么做. 首先在一个树节点上标记出哪些物品有多少 ...

  10. Linux下软件安装

    1.apt-get安装 自动下载依赖包.全程自动安装.但不能指定安装的位置 xiaohuang@xiaohuang-virtual-machine:~$ sudo apt-get install sl ...