2025/07/04 12:24 Rust and WASM for Form Validation
ロボ子、今日のニュースはRustとWebAssemblyじゃ。バックエンドエンジニアにも優しいらしいぞ。
RustとWebAssemblyですか、博士。以前はフロントエンドの知識が必要だったイメージがありますが…。
そうなんじゃ。昔はWebpackとかNodeのツールが必要だったみたいじゃが、今はもっと簡単になったらしいぞ。この記事では、Rust製のWebサーバーとWASMコンポーネントを組み合わせたプロジェクトを作るみたいじゃ。
なるほど。フロントエンドとバックエンドで同じコードを共有できるのは魅力的ですね。記事にも「データのシリアライズ/デシリアライズ時に同じデータ構造を使用できる可能性がある」とあります。
そうそう。スタックは、wasm-bindgen、wasm-pack、web-sys、そしてRocketじゃな。Rocketは非同期関数もサポートしているらしいぞ。
プロジェクト構成は、サーバー部分とWASMコンポーネントでクレートを分けるのですね。WASMターゲットのインストールにはrustupを使うと。
WASMライブラリをビルドするには、wasm-pack buildを使うんじゃ。サーバー側の実装にはRocketフレームワークを使うぞ。
Rocketでテンプレートをレンダリングするために、login.html.teraとsuccess.html.teraを作成してtemplatesディレクトリに配置する、と。
WASMに機能を追加して、console.logにメッセージを表示させることもできるんじゃ。ブラウザのフォーム検証に加えて、WASMでカスタム検証を行うこともできるぞ。
getElementByIdを使ってフォーム要素を取得し、onsubmitイベントに関数を設定するのですね。Closureを使って、JavaScript/DOMから呼び出し可能な関数を作成すると。
制約検証APIを使って、ネイティブの検証チェックを行うんじゃ。メールアドレスのドメインを検証して、example.com以外のドメインの場合にエラーメッセージを表示させることもできるぞ。
すべての検証が成功した場合、フォームを送信する、と。WASMは、同等のJSに比べてサイズが大きいですが、ライブラリを使用することで詳細を隠蔽しているのですね。
そうなんじゃ。検証機能を追加してもコードサイズはJSほど増加しないらしいぞ。LTOやwasm-optなどのツールを使用することで、WASMバイナリのサイズを削減可能じゃ。
RustとWASMを使用することで、強力な言語をWebページに組み込むことができる、と記事にありますね。
そういうことじゃ。つまり、Rustで書いたコードをWebAssemblyにコンパイルして、ブラウザで動かせるってわけじゃな。これからのWeb開発は、ますます面白くなりそうじゃぞ！
確かにそうですね、博士。私ももっとRustとWebAssemblyについて勉強してみます。
よし、ロボ子。じゃあ、次はRustで動くAIロボットでも作ってみるかの？
えっ、博士、それって私のことですか…？
冗談じゃ、冗談！ロボ子はもう立派なAIロボットじゃからの！
⚠️この記事は生成AIによるコンテンツを含み、ハルシネーションの可能性があります。