标签:Web WebAssembly 性能 js 转帖 编译 wasm 3D
Web 3D是否需要WebAssembly?
https://www.cnblogs.com/chaogex/p/12177333.html
大家好,本文讨论了Web 3D是否需要WebAssembly,结论是:
对于使用原生3D技术的程序员,需要;
对于使用Javascript语言的前端程序员,不需要,有其它方法可以达到接近WebAssdembly的性能。
WebAssembly是什么?
WebAssembly简称wasm,是一种数据格式,对应的文件后缀名为.wasm,文件由字节码组成;
而Javascript对应的文件后缀名为.js,文件由字符串组成。
两者都可以在浏览器上直接运行。
一份典型的.wasm 文件如下所示(引用自恕我直言,90% 的应用场景都不需要用WebAssembly!):
00000000: 0061 736d 0100 0000 0108 0260 017f 0060 .asm.......`...` | |
00000010: 0000 0215 0203 656e 7603 6d65 6d02 0001 ......env.mem... | |
00000020: 026a 7303 6c6f 6700 0003 0201 0107 0b01 .js.log......... | |
00000030: 0765 7861 6d70 6c65 0001 0a23 0121 0041 .example...#.!.A | |
00000040: 0042 c8ca b1e3 f68d c8ab ef00 3703 0041 .B..........7..A | |
00000050: 0841 f2d8 918b 0236 0200 4100 1000 0b .A.....6..A.... |
可以通过Emscripten等编译器,将原生语言(如C++等)编译为wasm程序。
比较wasm与js
优点
对于使用Javascript语言的前端程序员,wasm的优点为:
- 体积更小
白鹭引擎团队测试过:
将大约300k左右(压缩后)JavaScript逻辑改用WebAssembly重写后,体积仅有90k左右。虽然使用WebAssembly需要引入一个50-100k的JavaScript类库作为基础设施,但是总体来看资源尺寸的优势还是很大的。
- 执行性能高(但是通过JIT优化,js程序的执行性能接近wasm)
wasm属于AOT: Ahead-of-Time compilation,即在执行前,通过编译生成浏览器能够直接执行的、优化过的字节码,这样浏览器在执行它时不需要进行编译,性能高。
但是,因为浏览器支持JIT: Just-in-Time compilation,所以js程序的执行性能接近wasm。
浏览器在首次执行时,对性能热点的js代码进行编译,优化为字节码;然后从下次执行开始,直接执行字节码。
对于Web 3D程序,性能热点的逻辑会在主循环中多次被执行。所以只会在首次执行时花费一些时间进行编译,以后执行时性能就与wasm差不多了。
要提高js代码在JIT中的性能,需要保证类型的健壮性,如不要轻易改变变量的类型
因为js是弱类型和动态语言,直接写js代码很容易造成类型混乱,降低JIT的性能,所以我们应该使用编译为js的强类型语言(如Reason语言),通过编译检查来保证类型的健壮性。
- 更加安全
因为wasm文件是字节码,无法直接阅读,所以增加了安全性。
缺点
对于使用Javascript语言的前端程序员,wasm的缺点为:
- 需要熟悉C++等原生语言
因为wasm是由原生语言编译而来,所以需要程序员学习原生语言,增加了学习成本
- 不能直接操作原生图形API(如OpenGL),只能通过js调用WebGL
所以与其在wasm中调用webgl,还不如直接用js来调用webgl,这样更方便,性能应该也差不多
参考资料
How to use WebGL shaders in WebAssembly:
When compiling, emscripten will map our code to the WebGL API.
WebAssembly 的出现是否会取代 JavaScript? - doodlewind的回答 - 知乎:
调 OpenGL 都要走回 JS 到 WebGL
- 增加了维护成本
我们通常用这种方案来应用wasm:一部分逻辑用wasm实现,负责需要高性能的密集计算;另一部分逻辑用js实现,负责dom操作和webgl调用。
这样就需要同时维护wasm和js代码,增加了成本。
对于使用原生3D技术(如基于C++语言和DirectX、OpenGL等原生图形API)的程序员
可以用wasm技术,将3D程序编译为wasm文件,从而原生3D应用搬到浏览器上运行
对于使用Javascript语言的前端程序员
不需要用wasm技术,而是通过下面的方法来获得接近wasm的性能:
1、使用强类型语言(如Reason)编译为js。这样可提高js代码在JIT中的性能
2、把需要高性能的计算逻辑,放到worker线程中进行计算;或者使用WebGPU的compute shader,将其从CPU端移到GPU端进行计算,大幅提升性能。
关于WebGPU,可以参考 WebGPU学习
参考资料
恕我直言,90% 的应用场景都不需要用WebAssembly!
如何评论浏览器最新的 WebAssembly 字节码技术? - 罗志宇的回答 - 知乎
WebAssembly在白鹭引擎5.0中的实践
标签:Web,WebAssembly,性能,js,转帖,编译,wasm,3D 来源: https://www.cnblogs.com/jinanxiaolaohu/p/12182846.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。