WebAssembly入门:WebAssembly入门

WebAssembly承诺提供一种全新的网络-为用户提供更佳的性能,并为开发人员提供更大的灵活性。 开发人员可以使用多种语言(C,TypeScript,Rust,Ruby,Python)进行选择,而不必局限于使用JavaScript作为客户端网络交互的唯一语言,而是可以使用最舒适的一种语言进行开发。用。

最初,创建WebAssembly(或简称WASM)的唯一方法是使用Emscripten工具链将C / C ++代码编译为WebAssembly。 如今,开发人员不仅拥有更多的语言选择,而且以更少的介入步骤将这些其他语言直接编译为WebAssembly变得更加容易。

[ WebAssembly的下一步 。 • 8个使WebAssembly发挥作用的项目 。 | 通过InfoWorld的App Dev Report新闻通讯了解编程方面的热门话题。 ]

在本篇文章中,我们将研究在Web应用程序中实现WebAssembly组件所需的步骤。 由于WebAssembly尚在开发中,因此步骤高度依赖于您使用的语言,并且工具链可能会保持一段时间的变化。 但是现在,可以使用多种语言编写和部署有用的WebAssembly应用程序(如果需要的话)。

选择WebAssembly支持的语言

部署WebAssembly应用程序的第一步是选择一种可以编译为WebAssembly的语言作为目标。 您很有可能将您在生产中使用的至少一种主要语言转换为WebAssembly,或者拥有可以发出WebAssembly的编译器。

以下是领跑者:

  • C.显然。 将C代码转换为WebAssembly的典型方法是通过Emscripten ,因为C到Emscripten到WebAssembly是第一个出现的WebAssembly工具链。 但是其他工具正在出现。 整个编译器Cheerp专门用于从C / C ++代码生成WebAssembly应用程序。 Cheerp还可以定位JavaScript,asm.js或上述任意组合。 也可以使用Clang工具链来构建WebAssembly有效负载,尽管该过程仍然需要大量的手动提升。 ( 这是一个示例 。)
  • 锈。 Mozilla的系统编程语言设计得既安全又快速,是原生 WebAssembly支持的主要候选者之一。 Rust工具链的扩展使您可以直接从Rust代码编译为WebAssembly 。 您需要使用Rust的nightly工具链来执行WebAssembly编译,因此此功能现在应该被认为是实验性的。
  • TypeScript 。 默认情况下,TypeScript编译为JavaScript,这意味着可以依次将其编译为WebAssembly。 AssemblyScript项目减少了涉及的步骤数,从而允许将严格类型的TypeScript编译为WebAssembly。

其他几种语言也开始以WebAssembly为目标,但它们处于起步阶段。 可以使用以下语言来构建WebAssembly组件,但只能使用比C,Rust和TypeScript更为有限的方式:

  • D. D语言最近增加了对直接编译和链接到WebAssembly的支持。
  • Java 。 可以通过TeaVM项目将Java字节码提前编译为WebAssembly。 这意味着任何发出Java字节码的语言都可以编译为WebAssembly,例如Kotlin,Scala或Clojure。 但是,许多无法在WebAssembly中有效实现的Java API受到限制,例如反射和资源API,因此TeaVM(以及WebAssembly)仅用于基于JVM的应用程序的子集。
  • a 与JavaScript一样,Lua脚本语言作为嵌入式语言的使用历史悠久。 但是,将Lua转换为WebAssembly的唯一项目涉及使用浏览器内执行引擎: wasm_lua在浏览器中嵌入Lua运行时,而Luwa JIT将Lua编译为WebAssembly。
  • Kotlin /本机 。 Kotlin语言的爱好者(一种Java衍生产品)一直在热切等待Kotlin / Native的完整发布,Kotlin / Native是Kotlin编译器的LLVM后端,可以生成独立的二进制文件。 Kotlin / Native 0.4引入了对WebAssembly的支持,将其作为编译目标,但仅作为概念证明。
  • .NET 。 .Net语言尚不具备完整的WebAssembly支持,但是一些实验已经开始。 请参阅Blazor ,它可用于通过C#和Microsoft的“ Razor”语法在.Net中构建单页Web应用程序。
  • 尼姆 这种新兴的语言可以编译为C,因此理论上可以将生成的C编译为WebAssembly。 但是,正在开发Nim的实验后端,称为nwasm 。
  • 其他LLVM支持的语言 。 从理论上讲,任何利用LLVM编译器框架的语言都可以编译为WebAssembly,因为LLVM支持WebAssembly作为许多目标之一。 但是,这并不一定意味着任何LLVM编译语言都可以在WebAssembly中按原样运行。 这仅意味着LLVM使定位WebAssembly更加容易。

以上所有项目都将原始程序或生成的字节码转换为WebAssembly。 但是对于诸如Ruby或Python这样的解释型语言,还有另一种方法:将应用程序的运行时间转换为WebAssembly,而不是转换应用程序本身。 然后,程序在转换后的运行时按原样运行。 由于许多语言运行时(包括Ruby和Python)都是用C / C ++编写的,因此转换过程从根本上讲与任何其他C / C ++应用程序相同。

当然,这意味着转换后的运行时必须先下载到浏览器,然后才能运行任何应用程序,这会减慢加载和解析时间。 应用程序的“纯” WebAssembly版本更加轻巧。 因此,在更多语言支持WebAssembly作为导出或编译目标之前,运行时转换充其量只能是权宜之计。

将WebAssembly与JavaScript集成

下一步是以您选择的语言编写代码,并注意该代码如何与WebAssembly环境交互,然后将其编译为WebAssembly模块(WASM二进制文件),最后将该模块与现有的模块集成。 JavaScript应用程序。

根据工具链的不同,如何将代码导出到WebAssembly的确切步骤将大不相同。 它们还将与为该语言构建常规本机二进制文件的方式有所不同。 例如,在Rust中,您需要执行几个步骤:

  1. 使用wasm32-unknown-unknown工具链为Rust进行nightly构建。
  2. 使用声明为#[no-mangle]外部函数编写Rust代码。
  3. 使用上面的工具链构建代码。

(有关上述步骤的详细说明,请参见GitHub上的The Rust and WebAssembly Book 。)

值得注意的是,无论您使用哪种语言,为了将代码与HTML前端集成在一起,您都需要至少具有最低JavaScript水平。 如果本示例中的Rust和WebAssembly Book中的页面内JavaScript片段对您来说似乎是希腊文,请预留一些时间来学习至少足够JavaScript以了解那里发生的事情。

WebAssembly和JavaScript的集成是通过在JavaScript中使用WebAssembly对象创建到WebAssembly代码的桥梁来完成的。 Mozilla提供了有关如何执行此操作的文档 。 这是Rust的一个单独的WebAssembly示例 ,这是Node.js的一个WebAssembly示例 。

目前,WebAssembly后端和JavaScript / HTML前端之间的集成仍然是整个过程中最繁琐且手动的部分。 例如,对于Rust, 仍然必须通过原始数据指针手动创建到JavaScript的桥。

但是,更多的工具链开始解决这个问题。 Cheerp框架允许C ++程序员通过专用命名空间与浏览器的API进行通信 。 Rust提供了wasm-bindgen ,它充当JavaScript和Rust之间以及JavaScript和WebAssembly之间的双向桥梁。

另外,正在考虑有关如何处理与主机的绑定的高层建议 。 一旦完成,它将为编译为WebAssembly的语言与主机交互提供一种标准方法。 该提议的长期策略还包括对不是浏览器的主机的绑定,但是浏览器绑定是短期的立即使用案例。

调试和分析WebAssembly应用程序

WebAssembly工具仍处于最早阶段的领域之一是对调试和性能分析的支持。

在JavaScript源映射出现之前,编译成JavaScript的语言通常很难调试,因为原始代码和编译后的代码无法轻松关联。 WebAssembly也有一些相同的问题:如果用C编写代码并将其编译为WASM,则很难在源代码和编译后的代码之间建立关联。

JavaScript源映射指示源代码中的哪些行对应于已编译代码的哪些区域。 一些WebAssembly工具,例如Emscripten,也可以发出已编译代码JavaScript源映射。 WebAssembly的一项长期计划是一个源地图系统,它不仅可以使用JavaScript中提供的功能,而且还仅处于建议阶段。

目前,在野外调试WASM代码的最直接方法是使用Web浏览器的调试控制台。 WebAssemblyCode上的本文展示了如何使用源映射生成WASM代码,如何将其提供给浏览器的调试工具以及逐步执行代码。 请注意,所描述的步骤取决于使用emcc工具发出WASM。 您可能需要修改步骤,具体取决于您的特定工具链。

From: https://www.infoworld.com/article/3258547/webassembly-tutorial-get-started-with-webassembly.html

你可能感兴趣的:(rust,移动开发,java)