前言
WebAssembly 是一种可在现代 Web 浏览器中运行的编码方式。它是一种低级的类汇编语言,具有紧凑的二进制格式,可接近原生性能运行,并为 C/C++、C# 和 Rust 等语言提供编译目标,使其能在 Web 上运行。它被设计为与 JavaScript 共存,允许两者协同工作。
简而言之,对于网页上对性能有特殊需求的场景(如数学矩阵计算、FFT 等),可以尝试 WebAssembly。与调用服务器相比,WebAssembly 在本地计算,减少了网络传输损耗和服务器资源消耗,在响应速度和体验上可能有显著提升。
本文基于 Qt 5.15.2 和 6.8.3 版本验证通过。
一、WebAssembly 是什么?
WebAssembly 为 Web 平台提供了多种语言编写的代码以接近原生速度运行的途径,使得以前无法在 Web 上运行的客户端应用程序得以在 Web 上运行。
通过使用 WebAssembly 的 JavaScript API,可以将 WebAssembly 模块加载到 JavaScript 应用中,并在两者之间共享功能。这允许在同一个应用中利用 WebAssembly 的性能和能力以及 JavaScript 的表达力和灵活性。
二、下载并配置 emsdk
1. 下载源代码
git clone https://github.com/emscripten-core/emsdk.git
# 国内用户建议使用 Gitee 镜像
git clone https://gitee.com/anold/emsdk.git
2. 配置环境
cd emsdk
./emsdk install latest
./emsdk activate latest
执行 ./emsdk activate latest 后会提示设置环境变量。emsdk 需要编译工具链,以及 Java、Python、Node 等环境协同工作,这些环境已包含在 emsdk 中。
环境变量配置示例
用户变量


PATH 路径

请根据实际路径修改。
三、配置 Qt 环境
Qt Creator 支持 WebAssembly 构建,暂不支持 Clion 等其他 IDE。
注意:先配置环境变量再打开 Creator,会自动读取环境变量。
1. 设置 SDKs
编辑 -> 设置 -> SDKs -> WebAssembly





