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. POJ 3172 (认真读题的题)

    题目: 思路: 题目很有意思 首先 题里说:N<=1000 题里又说 诶呦 woc? 这不自相矛盾嘛 最坏情况也就是个 斐波那契数列 几十个数 暴搜+剪枝不就好了嘛 剪枝:从大往小搜,如果前缀和 ...

  2. Java学习笔记十

    网络编程: 一.osi和TCP协议对照: 二.通讯三要素: 三.InetAddress对象简述: import java.net.InetAddress; import java.net.Unknow ...

  3. C#开发 —— 高级应用

    迭代器 可以返回相同类型的值的有序序列的一段代码,可用作方法,运算符或get访问器的代码体 使用 yield return 语句依次返回每个元素,yield break 语句可将终止迭代 迭代器的返回 ...

  4. CSS 文本样式

    1. 文本样式 text <!--文本颜色color --> .text {color:red;} 2. 文本对齐方式    text-align <style> .text ...

  5. 【OC学习-8】存取器方法?getter和setter?事实上就是赋值和返回值的两种函数

    我们在声明类的时候,有实例变量+方法(函数),这些实例变量假设默认的话都是protected类型,一般无法直接訪问.更别提赋值和调用了,所以就产生了两种函数,getter函数就是可以返回实例变量的值, ...

  6. [Android] 图像各种处理系列文章合集

        这是我近期在做Android随手拍一个项目的各种网上关于图片处理的资料,曾经学过数字图像处理都是用C++写的,以下的资料个人觉得是很优秀的各种集合,还有一方面它是在线笔记,希望对大家有所帮助吧 ...

  7. TCP/IP图解学习总结(二)

    注意:这里的第n层是依照OSI协议来的 I   网桥--2层交换机.数据链路层面上链接两个网络的设备.它可以识别数据链路层中的数据帧. II  路由器-3层交换机.网络层面上连接两个网络,并对分组报文 ...

  8. HDU 1166 敌兵布阵 Segment Tree题解

    本题是最主要的分段树操作了.或者一般叫线段树,只是好像和线段没什么关系,仅仅是分段了. 不使用lazy标志,更新仅仅是更新单点. 假设不使用分段树,那么更新时间效率仅仅须要O(1),使用分段树更新效率 ...

  9. Python: scikit-image gamma and log 对比度调整

    这个函数,主要用来做对比度调整,利用 gamma 曲线 或者 log 函数曲线, gamma 函数的表达式: y=xγ, 其中, x 是输入的像素值,取值范围为 [0−1], y 是输出的像素值,通过 ...

  10. mysql 批量删除数据

    批量删除2000w数据 使用delete from table太慢 //DELIMITER DROP PROCEDURE if EXISTS deleteManyTable; create PROCE ...