SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

連載記事

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

翔泳社では、「独習」「徹底入門」「スラスラわかる」「絵で見てわかる」「一年生」などの人気シリーズをはじめ、言語や開発手法、最新技術を解説した書籍を多数手がけています。プロジェクトマネジメントやチームビルティングといった管理職向けの書籍も豊富です。

ITエンジニアとしてのスキルアップ・リスキリングに、ぜひお役立てください。

書籍に関する記事を見る

'); googletag.cmd.push(function() { googletag.pubads().addEventListener('slotRenderEnded', function(e) { var ad_id = e.slot.getSlotElementId(); if (ad_id == 'div-gpt-ad-1659428980688-0') { var ad = $('#'+ad_id).find('iframe'); if ($(ad).width() == 728) { var ww = $(window).width(); ww = ww*0.90; var style = document.createElement("style"); document.head.appendChild( style ); var sheet = style.sheet; sheet.insertRule( "#div-gpt-ad-1659428980688-0 iframe {-moz-transform: scale("+ww/728+","+ww/728+");-moz-transform-origin: 0 0;-webkit-transform: scale("+ww/728+","+ww/728+");-webkit-transform-origin: 0 0;-o-transform: scale("+ww/728+","+ww/728+");-o-transform-origin: 0 0;-ms-transform: scale("+ww/728+","+ww/728+");-ms-transform-origin: 0 0;}", 0 ); sheet.insertRule( "#div-gpt-ad-1659428980688-0 div{ height:"+(90*ww/728)+"px;width:"+728+"px;}", 0 ); } else { if ($(window).width() < 340) { var ww = $(window).width(); ww = ww*0.875; var style = document.createElement("style"); document.head.appendChild( style ); var sheet = style.sheet; sheet.insertRule( "#div-gpt-ad-1659428980688-0 iframe {-moz-transform: scale("+ww/320+","+ww/320+");-moz-transform-origin: 0 0;-webkit-transform: scale("+ww/320+","+ww/320+");-webkit-transform-origin: 0 0;-o-transform: scale("+ww/320+","+ww/320+");-o-transform-origin: 0 0;-ms-transform: scale("+ww/320+","+ww/320+");-ms-transform-origin: 0 0;}", 0 ); sheet.insertRule( "#div-gpt-ad-1659428980688-0 div{ height:"+(180*ww/320)+"px;width:"+320+"px;}", 0 ); } } } }); }); } else { document.write('
'); document.write('
'); }
Rust言語で作るWebバイナリファイル「WebAssembly」入門

動かして学ぶ! Rustの言語仕様

Rust言語で作るWebバイナリファイル「WebAssembly」入門 第2回

  • X ポスト
  • このエントリーをはてなブックマークに追加

ダウンロード サンプルファイル (13.8 KB)

 本連載では、Webブラウザー上でJavaScriptとともに動作できるバイナリ形式のプログラムファイル「WebAssembly」を、Rustプログラミング言語で実装する方法について、順を追って説明していきます。前回はWebAssemblyの概要を説明するとともに、Rustを利用した単純なWebAssemblyのサンプルを作成しました。今回はWebAssemblyの実装で必要となるRust言語の基礎を説明します。

  • X ポスト
  • このエントリーをはてなブックマークに追加

はじめに

 本連載では、Webフロントエンド開発において注目されているバイナリ形式のプログラムファイルWebAssemblyを、Rustで実装して活用する方法を説明しています。前回記事では、WebAssemblyに至るまでのWebフロントエンド高速化の歴史を紹介するとともに、RustでWebAssemblyを実装する大まかな流れを説明しました。

 本記事では、WebAssemblyの実装で必要となるRust言語の基礎を説明していきます。

対象読者

  • 話題のRust言語について学びたい方
  • 動的なWebページにさらなる速度を求める方
  • WebAssemblyに興味があるが、Rustのハードルが高いと思っている方

必要な環境

 本記事のサンプルコードは、以下の環境で動作を確認しています。

  • Windows 10 64bit版
  • rustup 1.24.3
  • cargo 1.55.0

 サンプルコードを実行するには、サンプルのフォルダーで「cargo run」コマンドを実行します。

Rustプロジェクトの生成・実行手順

 本記事では、WebAssemblyではなく、ローカルPCで実行できるプログラムを生成するRustのプロジェクトを用いて、Rust言語を説明していきます。最初に、このプロジェクトを作成して実行する手順を説明します。Rustの開発環境をインストールしていない場合、前回記事を参考にインストールしてください。

 開発環境の一部としてインストールされる「cargo」コマンドは、Rustのプロジェクト作成やビルド、コードチェックなどを行える、Rust開発の必須ツールです。リスト1の「cargo init」コマンドを実行すると、Rustのプロジェクトを作成できます。

[リスト1]Rustプロジェクトを生成するコマンド
cargo init <プロジェクト名>

 生成されたプロジェクトは、図1のディレクトリ構造を持っています。処理を実装するソースコードはsrc/main.rsファイルです。

図1 Rustプロジェクトの構造(p001-init)

図1 Rustプロジェクトの構造(p001-init)

 main.rsにはリスト2の内容が記述されています。(1)の「fn main()」はいわゆるmain関数で、ここから処理がスタートします。(2)のprintln!文で文字列をコンソールに出力します。行末にはセミコロン(;)を記述します。

[リスト2]生成されたRustのソースコード(p001-init/src/main.rs)
fn main() { // main関数(1)
    println!("Hello, world!"); // 「Hello, world!」とコンソールに出力 ...(2)
}

 プロジェクトを実行するには、プロジェクトのフォルダーで「cargo run」コマンドを実行します。すると、ソースコードが自動的にビルドされて、その後実行されます。

図2 「cargo run」コマンドでRustプロジェクトを実行した様子(p001-init)

図2 「cargo run」コマンドでRustプロジェクトを実行した様子(p001-init)

 なお、ビルドを行う「cargo build」、コードチェックを行う「cargo check」など、run以外のcargoコマンドについては、公式ドキュメントも参考にしてください。

会員登録無料すると、続きをお読みいただけます

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

次のページ
Rustで実装しながら言語仕様を学ぶ

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
Rust言語で作るWebバイナリファイル「WebAssembly」入門連載記事一覧

もっと読む

この記事の著者

WINGSプロジェクト  吉川 英一(ヨシカワ エイイチ)

<WINGSプロジェクトについて>有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きたい。著書、記事多数。 RSS X: @WingsPro_info(公式)、@WingsPro_info/wings(メンバーリスト) Facebook

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

山田 祥寛(ヤマダ ヨシヒロ)

静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for Visual Studio and Development Technologies。執筆コミュニティ「WINGSプロジェクト」代表。主な著書に「独習シリーズ(Java・C#・Python・PHP・Ruby・JSP&サーブレットなど)」「速習シリーズ(ASP.NET Core・Vue.js・React・TypeScript・ECMAScript、Laravelなど)」「改訂3版JavaScript本格入門」「これからはじめるReact実践入門」「はじめてのAndroidアプリ開発 Kotlin編 」他、著書多数。

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/15083 2021/11/08 11:00
" ); }

おすすめ

アクセスランキング

  1. 1
    Google、同社史上もっともインテリジェントなAIモデル「Gemini 2.5」を発表 NEW
  2. 2
    「アップサート」 ~マンガでプログラミング用語解説
  3. 3
    「Developers Summit 2025 アワード」ベストスピーカー1位は安野貴博氏&漆原茂氏と、「ちいさなDX」セッションがW受賞 NEW
  4. 4
    なりたくなかったマネージャーが天職に? 知らない景色に飛び込むエンジニアは「何にだってなれる」
  5. 5
    【Webブラウザでストリーミング動画配信:前編】MP4プログレッシブダウンロードによるストリーミング再生を実現しよう NEW
  1. 6
    ウェルスナビCTOが語る「事業成長に貢献できるエンジニアになるために必要なこと」 NEW
  2. 7
    企業の約7割、AIによってエンジニアの採用要件が変化すると予想。ファインディが調査 NEW
  3. 8
    日本発グローバル企業 ファーストリテイリングが実践する、世界で活躍するエンジニアの育て方 NEW
  4. 9
    大阪大学発! 量子コンピュータのためのクラウドシステム構築とDevOps最前線 NEW
  5. 10
    プロジェクトマネージャーなら知っておきたい、心理的安全性を生み出すチーム盛り上げプロデュース術 NEW

アクセスランキング

  1. 1
    Google、同社史上もっともインテリジェントなAIモデル「Gemini 2.5」を発表 NEW
  2. 2
    「アップサート」 ~マンガでプログラミング用語解説
  3. 3
    「Developers Summit 2025 アワード」ベストスピーカー1位は安野貴博氏&漆原茂氏と、「ちいさなDX」セッションがW受賞 NEW
  4. 4
    なりたくなかったマネージャーが天職に? 知らない景色に飛び込むエンジニアは「何にだってなれる」
  5. 5
    【Webブラウザでストリーミング動画配信:前編】MP4プログレッシブダウンロードによるストリーミング再生を実現しよう NEW
  6. 6
    ウェルスナビCTOが語る「事業成長に貢献できるエンジニアになるために必要なこと」 NEW
  7. 7
    企業の約7割、AIによってエンジニアの採用要件が変化すると予想。ファインディが調査 NEW
  8. 8
    日本発グローバル企業 ファーストリテイリングが実践する、世界で活躍するエンジニアの育て方 NEW
  9. 9
    大阪大学発! 量子コンピュータのためのクラウドシステム構築とDevOps最前線 NEW
  10. 10
    プロジェクトマネージャーなら知っておきたい、心理的安全性を生み出すチーム盛り上げプロデュース術 NEW
  1. 1
    世界6000万ユーザーの「TimeTree」、サービスの未来を見据えて挑んだデータベース移行の舞台裏
  2. 2
    「オブザーバー・パターン」 ~マンガでプログラミング用語解説
  3. 3
    3/5まで書籍全文が無料公開 『Pythonで動かして学ぶ!Kaggleデータ分析入門』
  4. 4
    データサイエンス基礎を高校数学から復習しよう! D3.jsでデータを表現する
  5. 5
    macOS上のアプリケーションからChatGPTが呼び出せるように。各種IDEやターミナル、メモなどが対応
  6. 6
    マイクロソフト、VSCodeの新機能「Copilot Next Edit Suggestions」のプレビュー版公開
  7. 7
    GitHub、あらゆるエディタやIDEとGitHub Copilotとの統合を可能にする「Copilot Language Server SDK」を一般公開
  8. 8
    フロントエンドの定番ライブラリ「React 19」の新機能を紹介──React Server Componentsとその他の改善点
  9. 9
    「Tailwind CSS」の公式UIライブラリ「Tailwind UI」、サービス拡大を視野に「Tailwind Plus」へ名称変更
  10. 10
    オープンソーステキストエディタ「Emacs 30.1」リリース

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

メールバックナンバー

アクセスランキング

  1. 1
    Google、同社史上もっともインテリジェントなAIモデル「Gemini 2.5」を発表 NEW
  2. 2
    「アップサート」 ~マンガでプログラミング用語解説
  3. 3
    「Developers Summit 2025 アワード」ベストスピーカー1位は安野貴博氏&漆原茂氏と、「ちいさなDX」セッションがW受賞 NEW
  4. 4
    なりたくなかったマネージャーが天職に? 知らない景色に飛び込むエンジニアは「何にだってなれる」
  5. 5
    【Webブラウザでストリーミング動画配信:前編】MP4プログレッシブダウンロードによるストリーミング再生を実現しよう NEW
  1. 6
    ウェルスナビCTOが語る「事業成長に貢献できるエンジニアになるために必要なこと」 NEW
  2. 7
    企業の約7割、AIによってエンジニアの採用要件が変化すると予想。ファインディが調査 NEW
  3. 8
    日本発グローバル企業 ファーストリテイリングが実践する、世界で活躍するエンジニアの育て方 NEW
  4. 9
    大阪大学発! 量子コンピュータのためのクラウドシステム構築とDevOps最前線 NEW
  5. 10
    プロジェクトマネージャーなら知っておきたい、心理的安全性を生み出すチーム盛り上げプロデュース術 NEW

アクセスランキング

  1. 1
    Google、同社史上もっともインテリジェントなAIモデル「Gemini 2.5」を発表 NEW
  2. 2
    「アップサート」 ~マンガでプログラミング用語解説
  3. 3
    「Developers Summit 2025 アワード」ベストスピーカー1位は安野貴博氏&漆原茂氏と、「ちいさなDX」セッションがW受賞 NEW
  4. 4
    なりたくなかったマネージャーが天職に? 知らない景色に飛び込むエンジニアは「何にだってなれる」
  5. 5
    【Webブラウザでストリーミング動画配信:前編】MP4プログレッシブダウンロードによるストリーミング再生を実現しよう NEW
  6. 6
    ウェルスナビCTOが語る「事業成長に貢献できるエンジニアになるために必要なこと」 NEW
  7. 7
    企業の約7割、AIによってエンジニアの採用要件が変化すると予想。ファインディが調査 NEW
  8. 8
    日本発グローバル企業 ファーストリテイリングが実践する、世界で活躍するエンジニアの育て方 NEW
  9. 9
    大阪大学発! 量子コンピュータのためのクラウドシステム構築とDevOps最前線 NEW
  10. 10
    プロジェクトマネージャーなら知っておきたい、心理的安全性を生み出すチーム盛り上げプロデュース術 NEW
  1. 1
    世界6000万ユーザーの「TimeTree」、サービスの未来を見据えて挑んだデータベース移行の舞台裏
  2. 2
    「オブザーバー・パターン」 ~マンガでプログラミング用語解説
  3. 3
    3/5まで書籍全文が無料公開 『Pythonで動かして学ぶ!Kaggleデータ分析入門』
  4. 4
    データサイエンス基礎を高校数学から復習しよう! D3.jsでデータを表現する
  5. 5
    macOS上のアプリケーションからChatGPTが呼び出せるように。各種IDEやターミナル、メモなどが対応
  6. 6
    マイクロソフト、VSCodeの新機能「Copilot Next Edit Suggestions」のプレビュー版公開
  7. 7
    GitHub、あらゆるエディタやIDEとGitHub Copilotとの統合を可能にする「Copilot Language Server SDK」を一般公開
  8. 8
    フロントエンドの定番ライブラリ「React 19」の新機能を紹介──React Server Componentsとその他の改善点
  9. 9
    「Tailwind CSS」の公式UIライブラリ「Tailwind UI」、サービス拡大を視野に「Tailwind Plus」へ名称変更
  10. 10
    オープンソーステキストエディタ「Emacs 30.1」リリース