[WASM] Compile C Code into WebAssembly

We use the C language instead of pure WAST to create a square root function using WASM Fiddle (https://wasdk.github.io/WasmFiddle//). We show how to run the WebAssembly in WASM Fiddle, then download and run it in the browser using a helper function to load the WebAssembly.

WASM Fiddle: https://wasdk.github.io/WasmFiddle/?t96rp

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

 

// C

#include <math.h>

float getSqrt (float num) {
  return sqrt(num);
}

 

Compile to WASM:

复制代码
(module
  (type $FUNCSIG$ff (func (param f32) (result f32)))
  (table 0 anyfunc)
  (memory $0 1)
  (export "memory" (memory $0))
  (export "getSqrt" (func $getSqrt))
  (func $getSqrt (param $0 f32) (result f32)
    (f32.sqrt
      (get_local $0)
    )
  )
)
复制代码

 

index.html:

复制代码
<!doctype>
<html>
<header>
    <title>
        WASM
    </title>
    <script>

        function fetchAndInstantiateWasm(url, imports) {
            return fetch(url)
                .then((res) => {
                    if (res.ok) {
                        return res.arrayBuffer();
                    }
                    throw new Error('Unable to fetch WASM')
                })
                .then((bytes) => {
                    return WebAssembly.compile(bytes);
                })
                .then(module => {
                    return WebAssembly.instantiate(module, imports || {});
                })
                .then(instance => instance.exports);
        }

        fetchAndInstantiateWasm('./program.wasm')
            .then(m => {
                window.getSqrt = m.getSqrt;
            });
    </script>
</header>
</html>
复制代码

 

posted @   Zhentiw  阅读(473)  评论(0编辑  收藏  举报
编辑推荐:
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具
历史上的今天:
2016-06-28 [Webpack 2] Use Karma for Unit Testing with Webpack
2016-06-28 [Webpack 2] Expose modules to dependencies with Webpack
点击右上角即可分享
微信分享提示