By Bob Reselman
この記事はもともとで公開されました TheNewStack
WebAssemblyを使用すると、Rustなどの低水準プログラミング言語でコードを記述して、トランスポータブルバイナリにコンパイルできます。そのバイナリは、WebAssembly仮想マシンのクライアント側で実行できます。 今日のWebブラウザの標準。または、バイナリは、Node.jsやNode.jsなどの別のプログラミングフレームワークによって消費されるコンポーネントとして、サーバー側で使用できます。 デノ.
WebAssemblyは、低レベルのコードプログラミングに固有の効率と、Linuxコンテナーに通常見られるコンポーネントの移植性の容易さを兼ね備えています。その結果、人工知能や複雑な機械学習タスクなど、計算量の多い大規模な作業を行うことを特に目的とした開発パラダイムが生まれます。
Dockerの作成者であるSolomonHykesとして、 ツイート 2019年3月27日：「2008年にWASM + WASIが存在した場合、Dockerを作成する必要はありませんでした。それがどれほど重要かです。サーバー上のWebAssemblyは、コンピューティングの未来です。」
WebAssemblyは、ソフトウェア開発への説得力のあるアプローチです。ただし、テクノロジーを真に理解するには、実際の動作を確認する必要があります。
この記事では、RustでWebAssemblyバイナリをプログラムし、Denoで実行されているTypeScriptを利用したWebサーバーで使用する方法を紹介します。 Rustをインストールしてランタイム環境を準備する方法を紹介します。ソースコードをRustバイナリにコンパイルします。次に、バイナリが作成されたら、サーバー側でバイナリを実行する方法を示します。 デノ。 Denoは、Node.jsの作成者であるRyanDahlによって開始されたTypeScriptベースのプログラミングフレームワークです。
デモンストレーションプロジェクトを理解する
この記事に付随するデモンストレーションプロジェクトは、WiseSayingsと呼ばれます。プロジェクトは、「賢明なことわざ」のコレクションをwisesayings.txtという名前のテキストファイルに保存します。テキストファイルの各行は、たとえば「困った時の友が、真の友。」
Rustコードは、単一の関数get_wise_saying（）を公開します。この関数は、テキストファイルwisesayings.txtからランダムな行を取得し、そのランダムな行を呼び出し元に返します。 （下の図1を参照）
図1：デモプロジェクトは、テキストファイルのデータをWebAssemblyバイナリに直接コンパイルします
コードとテキストファイルの両方が、wisesayings.wasmという名前の単一のWebAssemblyバイナリファイルにコンパイルされます。次に、処理の別のレイヤーが実行され、WebAssemblyバイナリがDenoWebサーバーコードによって消費可能になります。 Denoコードは、WebAssemblyバイナリの関数get_wise_sayings（）を呼び出して、ランダムなことわざを生成します。 （図2を参照してください。）
図2：WebAssemblyバイナリは、Denoなどのサーバー側プログラミングフレームワークで使用できます。
この記事で使用されているWiseSayingsデモンストレーションプロジェクトのソースコードを入手します GitHubで。この記事で説明されているすべての手順は、リポジトリのメインにリストされています Readme 資料。
開発環境の準備
コードを起動して実行するために最初に行う必要があるのは、Rustが開発環境にインストールされていることを確認することです。次の手順では、プロセスについて説明します。
ステップ1： 次のように入力して、Rustがマシンにインストールされていることを確認します。
次のような出力が得られます。
rustc –versionの呼び出しが失敗した場合は、Rustがインストールされていません。以下の手順に従って、 指定されたインストール方法で提示されたすべてのタスクを実行するようにしてください.
Rustをインストールするには、ここに移動してLinux / MACにインストールします。…
…またはここでWindowsにインストールします。
https://static.rust-lang.org/rustup/dist/i686-pc-windows-gnu/rustup-init.exeにあるrustup-init.exeをダウンロードして実行します。
ステップ2： システムのPATHを変更します
ステップ3： Linux環境で作業している場合は、次の手順を実行して、必要な追加のLinuxコンポーネントをインストールします。
開発者注： このコードを実行するのに最適な開発環境は、Linuxオペレーティングシステムを使用する環境です。
ステップ4： TypeScript / JavaScriptアダプタファイルの生成に使用するCLIツールを入手してください。これらのアダプターファイル（別名shims）は、WebAssemblyバイナリーの関数get_wise_saying（）を、バイナリーをホストするDenoWebサーバーに公開する作業を行います。コマンドラインで次のコマンドを実行して、ツールをインストールします。 wasm-bindgen-cli.
開発環境には、必要な補助ライブラリとともにRustがインストールされています。次に、WiseSayingのソースコードを取得する必要があります。
プロジェクトファイルの操作
Wise Sayingのソースコードは、GitHubリポジトリでホストされています。次の手順を実行して、GitHubからローカル開発環境にソースコードのクローンを作成します。
ステップ1： 次のコマンドを実行して、GitHubからWiseSayingsソースコードのクローンを作成します
ステップ2： 作業ディレクトリに移動します
以下のリスト1は、GitHubリポジトリから複製されたソースコードを構成するファイルを示しています。
リスト1：GitHubリポジトリでホストされているWiseSayingsデモプロジェクトのソースコードのファイル
上記のリスト1にリストされているソースコードファイルについて説明します。WebAssemblyバイナリの作成に関して関心のある特定のファイルは、11行目のsrcという名前のディレクトリ内のファイルと、2行目のCargo.tomlという名前のファイルです。 。
最初にCargo.tomlについて説明しましょう。 Cargo.tomlの内容を以下のリスト2に示します。
リスト2：デモンストレーションプロジェクトWiseSayingsのCargo.tomlのコンテンツ
Cargo.tomlは マニフェストファイル 開発中のRustプロジェクトのさまざまな側面について説明しています。 Wise SayingプロジェクトのCargo.tomlファイルは、パッケージ、依存関係、およびlibの3つのセクションで構成されています。セクション名は、あなたが読んだ貨物マニフェスト仕様で定義されています (こちら).
Cargo.tomlのパッケージセクションを理解する
パッケージセクションには、パッケージの名前（wise-sayings-wasm）、開発者が割り当てたバージョン（0.1.0）、作成者（Bob Reselman <bob@CogArtTech.com>）およびバイナリのプログラミングに使用されるRust（2018）のエディション。
Cargo.tomlの依存関係セクションを理解する
依存関係セクションには、WebAssemblyプロジェクトが作業を行うために必要な依存関係が一覧表示されます。上記のリスト2の8行目にあるように、Cargo.tomlはrandライブラリを依存関係としてリストしています。 randライブラリは、ファイルwisesayings.txtから賢明なことわざのテキストのランダムな行を取得するために使用される乱数を生成する機能を提供します。
上記のリスト2の9行目でgetrandomを参照すると、WebAssemblyバイナリの getrandom Javascriptで実行されており、 JavaScriptインターフェースを使用する必要があります。この条件は、JavaScriptでWebAssemblyバイナリを実行する場合に非常に特有です。その長所と短所は、行getrandom = {version =“ 0.2”、features = [“ js”]}がCargo.tomlに含まれていない場合、WebAssemblyバイナリは乱数を作成できないということです。
10行目のエントリは、 wasm-bindgen 依存関係としてのライブラリ。 wasm-bindgenライブラリは、wasmモジュールがJavaScriptと通信し、JavaScriptがwasmモジュールと通信する機能を提供します。
Cargo.tomlのLibセクションを理解する
エントリ crate-type = [“ cdylib”、“ lib”] Cargo.tomlファイルのlibセクションの14行目で、Rustコンパイラにstart関数なしでwasmバイナリを作成するように指示しています。通常、cdylibが示されている場合、コンパイラーは ダイナミックライブラリ 拡張子は、Windowsでは.dll、Linuxでは.so、MacOSでは.dylibです。この場合、デプロイメントユニットはWebAssemblyバイナリであるため、コンパイラは拡張子.wasmのファイルを作成します。上記のリスト2の13行目に示されているように、wasmファイルの名前はwisesayings.wasmになります。
Cargo.tomlについて理解しておくべき重要なことは、Rustコードを起動して実行するために必要な設計情報と実行時情報の両方を提供することです。 Cargo.tomlファイルが存在しない場合、Rustコンパイラは何をすべきかわからず、ビルドは失敗します。
コア関数を理解する、get_wise_saying（）
テキストファイルwisesayings.txtからWiseSayingを含むランダムな行を取得する実際の作業は、関数get_wise_saying（）によって実行されます。 get_wise_sayings（）のコードは、Rustライブラリファイル./src/lib.rsにあります。 Rustコードを以下のリスト3に示します。
リスト3：関数ファイルlib.rsには、関数get_wise_saying（）が含まれています。
ソースについて知っておくべき重要なことは、4行目で属性# [wasm_bindgen]でタグ付けされていることです。これにより、RustコンパイラはソースコードがWebAssemblyバイナリとしてターゲットにされていることを認識できます。このコードは、5行目にget_wise_saying（）という1つの関数を公開しています。賢明なことわざのテキストファイルをメモリにロードする方法は、 さびマクロ, include_str！。このマクロは、ディスクからファイルを取得し、データをメモリにロードする作業を行います。マクロはファイルを文字列としてロードし、関数str.lines（）は文字列内の行を配列に分割します。 （7行目）
10行目のrand :: thread_rng（）呼び出しは、10行目の.choose（）関数によってインデックスとして使用される数値を返します。その結果はすべて、賢明な言い方を反映した文字の配列（文字列）になります。関数によって返されます。
WebAssemblyバイナリの作成
Wasmターゲットの作成と、コードをWebAssemblyバイナリにコンパイルすることに移りましょう。
ステップ1： バイナリターゲットを追加します。
ステップ2： ソースコードをWebAssemblyにコンパイルします。以下に示します。
どこ
- カーゴビルド コンパイラを呼び出すコマンドです
- –lib ライブラリを構築することを示します
- -目標 ターゲット情報を示すオプションです
- wasm-unknown-unknown ターゲットの名前と、ターゲットのアセット用に作成されるディレクトリの名前です。
RustTargetのトリプル命名規則を理解する
Rustには、ターゲットの命名規則があります。大会で使用される用語は ターゲットトリプル。ターゲットトリプルは、ARCH-VENDOR-SYS-ABIの形式を使用します。
どこ
アーチ 目的のターゲットアーキテクチャについて説明します。たとえば、WebAssemblyの場合はwasm32、現世代のIntelチップの場合はi686です。
ベンダー ターゲットを公開しているベンダーについて説明します。たとえば、AppleやNvidia。
SYS オペレーティングシステムについて説明します。たとえば、WindowsまたはLinux。
ABI eabiはベアメタルに使用され、gnuはglibcに使用されるため、プロセスの開始方法について説明します。
したがって、i686-unknown-linux-gnuという名前は、Rustバイナリがi686アーキテクチャを対象とし、ベンダーが不明として定義され、対象のオペレーティングシステムがLinuxであり、ABIがgnuであることを意味します。
wasm32-unknown-unknownの場合、ターゲットはWebAssemblyであり、オペレーティングシステムは不明であり、ABIは不明です。名前の非公式な推論は「WebAssemblyバイナリです」です。
Rustによって定義された組み込みターゲットの標準セットがあります。 (こちら).
オプションのフィールドがあり、名前に4つのセクションがある場合もあれば、3つのセクションがある場合もあるため、命名規則がわかりにくい場合は、あなただけではありません。
Denoを使用したバイナリサーバーサイドのデプロイ
ベースのWeAssemblyバイナリをビルドした後、アダプタ（別名shim）ファイルとWebAssemblyバイナリの特別なバージョンを作成する必要があります。これらはすべてJavaScript内から実行できます。これらのアーティファクトは、 wasm-bindgen ツール。
ステップ1： 以下に示すコマンドを使用して、これらの新しいアーティファクトを作成します。
どこ
wasm-bindgen は、アダプタファイルと特別なWebAssemblyバイナリを作成するためのコマンドです。
–target deno ./target/wasm32-unknown-unknown/debug/wisesayings.wasm アダプターファイルがDenoのターゲットになることを示すオプションです。また、このオプションは、アーティファクト生成プロセスの基礎となる元のWebAssemblywasmバイナリの場所を示します。
–out-dir ./server 作成されたアダプタファイルがディスクに保存される場所を宣言するオプションです。この場合、 。/サーバ.
wasm-bindgenを実行した結果は、以下のリスト4に示すサーバーディレクトリです。
リスト4：サーバーディレクトリには、wasm-bindgenを実行した結果が含まれています
上記のリスト4に示されているサーバー・ディレクトリーの内容に、JavaScript（js）ファイルとTypeScript（ts）ファイルがいくつか追加されていることに注意してください。また、サーバーディレクトリには、wisesayings_bg.wasmという名前の特別なバージョンのWebAssemblyバイナリがあります。このバージョンのWebAssemblyバイナリは、最初のコンパイルによって最初に作成されたwasmファイルの簡略版であり、以前にカーゴビルドを呼び出したときに実行されます。この新しいwasmファイルは、元のWebAssemblyバイナリのJavaScript対応バージョンと考えることができます。接尾辞_bgは、bindgenの略語です。
Denoサーバーの実行
WebAssemblyを実行するためのすべてのアーティファクトがサーバーディレクトリに生成されたら、DenoWebサーバーを呼び出す準備ができています。以下のリスト5は、DenoWebサーバーのソースコードであるmain.tsのコンテンツを示しています。
リスト5：main.tsは、WebAssemblyバイナリーを使用するDenoWebサーバーコードです。
WebAssemblywasmバイナリが直接インポートされていないことに気付くでしょう。これは、WebAssemblyバイナリを表す作業が、以前に生成されたJavaScriptおよびTypeScriptアダプター（別名shim）ファイルによって行われるためです。 WebAssembly / Rust関数get_wise_sayings（）は、自動生成されたJavaScriptファイルwisesayings.jsで公開されています。
関数get_wise_sayingは、上記の2行目のWebサーバーコードにインポートされます。この関数は16行目で使用され、WebサーバーによってHTTP応答として返されるという賢明な言葉を取得します。
Deno Webサーバーを起動して実行するには、ターミナルウィンドウで次のコマンドを実行します。
ステップ1：
どこ
deno runは、Webサーバーを呼び出すためのコマンドセットです。
–allow-readは、DenoWebサーバーコードがディスクからファイルを読み取る権限を持つことを許可するオプションです。
–allow-netは、DenoWebサーバーコードがネットワークにアクセスできるようにするオプションです。
–allow-envは、DenoWebサーバーコードが環境変数を読み取ることを許可するオプションです。
./main.tsは、Denoが実行するTypeScriptファイルです。この場合、それはWebサーバーコードです。
ウェブサーバーが稼働しているときは、次のような出力が表示されます。
2021年3月11日木曜日17：57：32GMT + 0000（協定世界時）で実行されているHTTPWebサーバー。 http：// localhost：4040 /でアクセスします。
ステップ2：
コンピューターのターミナルで次のコマンドを実行して、Deno / WebAssemblyコードを実行します
たとえば、次のような賢明なことわざがあります。
真の美しさはその中にあります。
おめでとう！ サーバー側のWebAssemblyバイナリを作成して実行しました。
すべてを一緒に入れて
この記事では、DenoWebサーバーでWebAssemblyバイナリを作成して使用するために知っておく必要のあるすべてのことを説明しました。しかし、この記事に示されている情報と同じくらい詳細ですが、何が隠されているかについて学ぶことはまだたくさんあります。 Rustは低水準プログラミング言語であることを忘れないでください。これは、プロセッサとメモリに直接対抗することを目的としています。それがその力です。 WebAssemblyの本当の利点は、このテクノロジーを使用して、ブラウザー内から計算量の多い作業を実行できることです。 WebAssemblyに適したアプリケーションは、視覚的に集中的なゲームやアクティビティであり、リアルタイムの音声認識や言語翻訳など、複雑な機械学習機能が必要です。 WebAssemblyを使用すると、以前はサーバー側でしか実行できなかった計算をクライアント側で実行できます。ソロモンハイクスが言ったように、WebAssemblyはコンピューティングの未来です。彼は非常に正しいかもしれません。
理解しておくべき重要なことは、WebAssemblyは、最新の分散コンピューティングへの最先端のアプローチを探求したい人々に大きな機会を提供するということです。うまくいけば、この作品で提示された情報があなたにそれらの機会を探求する動機を与えるでしょう。
