Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Rust+WebAssemblyでWebアプリは作れるのか
Search
Nobuhito Ibaraki
May 22, 2018
Technology
0
590
Rust+WebAssemblyでWebアプリは作れるのか
Nobuhito Ibaraki
May 22, 2018
Tweet
Share
More Decks by Nobuhito Ibaraki
See All by Nobuhito Ibaraki
ノーコード編集と配信パフォーマンスを両立するコンテンツエディタの開発
niba1122
1
350
フロントエンドの動向 From Google I/O 2018
niba1122
0
3k
potatotips_48茨木.pdf
niba1122
0
840
Activityの背景をぼかす
niba1122
2
1.4k
Other Decks in Technology
See All in Technology
asken AI勉強会(Android)
tadashi_sato
0
160
Flutter向けPDFビューア、pdfrxのpdfium WASM対応について
espresso3389
0
110
さくらのIaaS基盤のモニタリングとOpenTelemetry/OSC Hokkaido 2025
fujiwara3
2
300
Geminiとv0による高速プロトタイピング
shinya337
0
220
React開発にStorybookとCopilotを導入して、爆速でUIを編集・確認する方法
yu_kod
1
120
【5分でわかる】セーフィー エンジニア向け会社紹介
safie_recruit
0
26k
AWS Organizations 新機能!マルチパーティ承認の紹介
yhana
1
240
Core Audio tapを使ったリアルタイム音声処理のお話
yuta0306
0
170
2025-06-26_Lightning_Talk_for_Lightning_Talks
_hashimo2
2
120
無意味な開発生産性の議論から抜け出すための予兆検知とお金とAI
i35_267
2
9k
なぜ私はいま、ここにいるのか? #もがく中堅デザイナー #プロダクトデザイナー
bengo4com
0
1.3k
事業成長の裏側:エンジニア組織と開発生産性の進化 / 20250703 Rinto Ikenoue
shift_evolve
PRO
2
15k
Featured
See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
The Cult of Friendly URLs
andyhume
79
6.5k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Designing for humans not robots
tammielis
253
25k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
Site-Speed That Sticks
csswizardry
10
680
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
810
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Transcript
Rust+WebAssemblyで Webアプリは作れるのか Meguro.es #15 Nobuhito Ibaraki @niba1122
Rustとは • Mozilla が開発 • 高速 • 安全 • 2016
年、 2017 年の Stack Overflow Developer Survey で「最も愛されて いるプログラミング言語」 で一位 (Wikipedia)
Rustとは • WebAssembly と連携 ◦ WebAssembly への コンパイルをサポート → emscripten
不要 ◦ cargo web で 簡単にビルドできる (https://github.com/kout e/cargo-web)
これだけじゃないんです
強力なマクロ • パターンマッチングを使いながら 自在に構文を拡張可能 • マクロでテンプレートエンジン を作れたりする! (maud とか )
maud (https://maud.lambda.xyz/) マクロ 言語の機能で JSX のような構文拡張が可能
Client Sideを扱う強力な ライブラリ:stdweb • Rust の中に JavaScript 風のマクロを 記述できる •
JavaScript の API を扱う インターフェース (alert とか query selector とか ) 簡単に DOM やイベントを扱える
JSXのような 構文拡張 DOMの 操作 +
Rust+WebAssemblyの フレームワークを作れるのでは?
世界初かもしれない・・・
そう甘くはなかった • 変数のライフタイムとの戦い ( コールバック実行時に変数の 生存を保証させるのが難しい ) • DOM のレンダリングと状態更新は
なんとか出来た • Component や Virtual DOM までは 実装できなかった rju(龍) (https://github.com/niba1122/rju)
自作フレームワークの実装で 四苦八苦している中・・・
yew https://github.com/DenisKolodin/yew/
yewとは • Elm や ReactJS の影響を受けた Rust フレームワーク ( 名前は
Vue.js に似てる? ) • Virtual DOM による差分更新 • Component • HTML ライクな記法 ( ちょっと癖はある )
Model 状態を持つ構造体 これに Renderable や Component トレイトを実装することで コンポーネントとしてレンダリング できる。
Template
Handle Event API Request Update State
Componentの 呼び出し
サンプルアプリ https://github.com/niba1122/rust_app
まとめ • yew を使えば Rust+WebAssembly でインタラクティブなアプリを作れる! • パフォーマンスもいいらしい https://github.com/DenisKolodin/yew/issues/5#issuecomment-354777076 •
JSer が Rust のライブラリをいきなり作るのはハード
Rust+WebAssemblyは • 型安全 • ビルドツール不要 • ハイパフォーマンス の素敵な世界です。 どなたか一緒にRustを書きましょう!
ご清聴ありがとうございました