傩遮谂饺一、运行效果??演示使用C#写的LiveCharts点击按钮动态生成一些数据。1. Android真机运行2. 模拟器运行二、实现原理??原理比较简单如下图所示将C#写的PixUI应用及C写的Skia引擎编译为WebAssembly然后通过微信小程序的WXWebAssembly加载并在canvas(WebGL)通过skia绘制出用户界面监听微信小程序的事件传给C#处理后重新绘制界面。三、开发步骤1. 创建wasmconsole项目创建项目前请确认已经通过dotnet workload install安装wasm-experimental及wasm-toolsdotnet new wasmconsole2. 参考PixUI.Demo.Wasm.proj修改工程文件3. 使用PixUI开发用户界面4. 编译并分包因微信小程序包大小限制问题使用PixUI.WxmpPkgs工具自动拆分生成pkgs目录5. 将如图所示的目录及文件复制进PixUI.Demo.Wxmp/miniprogram/dotnet目录内6. 修改dotnet.native.js因微信小程序的兼容问题以及改动了dotnet的引导代码暂需要手动修改emcc编译生成的js。替换所有import.meta.url为globalThis.bootUrl;搜索receiveInstace将function receiveInstance(instance,module){wasmExportsinstance.exports;替换为function receiveInstance(instance,module){wasmExportsinstance.instance.exports;7. 用Wechat Devtools打开PixUI.Demo.Wxmp工程即可运行四、优势与劣势优势代码复用前后端可以统一开发语言动态加载可以远程加载C#写的PixUI组件劣势包太大 因打包了dotnet的mono运行时及skia引擎目前不包含中文字体总的包大小差不多8.8MB小程序首次加载根据网络情况会稍慢。五、IOS真机问题目前IOS真机上运行还有些问题先在此记录。1. WebAssembly不支持Exception HandlingWXWebAssembly加载时会报invalid wasm file错误, 暂编译不支持的版本绕过此问题。2. JSC引擎的Function.length始终返回0可以通过修改dotnet.runtime.js来绕过此问题, 搜索argument count mismatch for cwrap将if(ono.length!n.length(Pe(argument count mismatch for cwrap ${e}),ovoid 0),function!typeof o(oXe.cwrap(e,t,n,r))替换为if(function!typeof o(oXe.cwrap(e,t,n,r))3. Jiterpreter造成微信闪退暂通过修改dotnet.runtime.js来绕过此问题搜索.tableSize将function(){if(ds)return;ds!0;const eps(),te.tableSize,not.emscriptenBuildOptions.runAOTCompilation?e.tableSize:1,替换为function(){return;if(ds)return;ds!0;const eps(),te.tableSize,not.emscriptenBuildOptions.runAOTCompilation?e.tableSize:1,4. 报compiling function underran the stack错误暂无解。请哪位熟悉WebAssembly的大神指点一下。