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
640
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Rust+WebAssemblyでWebアプリは作れるのか
Nobuhito Ibaraki
May 22, 2018
More Decks by Nobuhito Ibaraki
See All by Nobuhito Ibaraki
ノーコード編集と配信パフォーマンスを両立するコンテンツエディタの開発
niba1122
1
390
フロントエンドの動向 From Google I/O 2018
niba1122
0
3.2k
potatotips_48茨木.pdf
niba1122
0
910
Activityの背景をぼかす
niba1122
2
1.5k
Other Decks in Technology
See All in Technology
AI時代における最適なQA組織の作り方
ymty
3
460
テスト設計の本質を改めて考えてみる~生成AIを活用する時代だからこそ、作ったテストの説明性を高めよう~
yamasaki696
1
380
認証認可だけじゃない! ID管理の構成要素と ライフサイクルを意識しよう
ritou
1
520
Compose 新機能総まとめ / What's New in Jetpack Compose
yanzm
0
140
次世代ランサムウェア対策の考察 / 20260704 Mitsutoshi Matsuo
shift_evolve
PRO
5
1.7k
SRE歴2ヶ月でも開発6年の知見を活かして、チームで止まっていた環境改善を前に進めた話
a_ono
1
210
“ID沼入口” - 基本とセキュリティから始める、考え続けるためのID管理技術勉強会 告知&イントロ
ritou
0
440
地域 SRE コミュニティ最前線 / SRE NEXT 2026 Discussion Night Track C
muziyoshiz
0
130
NDIAS CTF 2026 問題解説会資料
bata_24
0
180
完全自律ロボットを作りたくて、先に開発を自律させた話(ROS Japan UG #63 LT)
rryz09
0
380
Why is RC4 still being used?
tamaiyutaro
0
300
4人目のSREはAgent
tanimuyk
0
400
Featured
See All Featured
Practical Orchestrator
shlominoach
191
11k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.2k
A Guide to Academic Writing Using Generative AI - A Workshop
ks91
PRO
1
340
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
1
2.1k
Keith and Marios Guide to Fast Websites
keithpitt
413
23k
Making the Leap to Tech Lead
cromwellryan
135
10k
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
helenjbeal
1
260
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
56k
Automating Front-end Workflow
addyosmani
1370
210k
A Tale of Four Properties
chriscoyier
163
24k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.5k
Product Roadmaps are Hard
iamctodd
55
12k
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を書きましょう!
ご清聴ありがとうございました