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
630
0
Share
Rust+WebAssemblyでWebアプリは作れるのか
Nobuhito Ibaraki
May 22, 2018
More Decks by Nobuhito Ibaraki
See All by Nobuhito Ibaraki
ノーコード編集と配信パフォーマンスを両立するコンテンツエディタの開発
niba1122
1
370
フロントエンドの動向 From Google I/O 2018
niba1122
0
3.2k
potatotips_48茨木.pdf
niba1122
0
890
Activityの背景をぼかす
niba1122
2
1.5k
Other Decks in Technology
See All in Technology
要件定義の精度を高めるための型と生成AIの活用 / Using Types and Generative AI to Improve the Accuracy of Requirements Definition
haru860
0
290
Microsoft 365 / Microsoft 365 Copilot : 自分の状態を確認する「ラベル」について
taichinakamura
0
440
雑談は、センサーだった
bitkey
PRO
2
190
AI時代に越境し、 組織を変えるQAスキルの正体 / QA Skills for Transforming an Organization
mii3king
5
3.4k
独断と偏見で試してみる、 シングル or マルチエージェント どっちがいいの?
shichijoyuhi
1
240
ファインディの事業拡大を支える 拡張可能なデータ基盤へのリアーキテクチャ
hiracky16
0
800
大学職員のための生成AI最前線 :最前線を、AIガバナンスとして読み直すためのTips
gmoriki
2
3.3k
Percolatorを廃止し、マルチ検索サービスへ刷新した話 / Search Engineering Tech Talk 2026 Spring
visional_engineering_and_design
0
240
Building a Study Buddy AI Agent from Scratch: From Passive Chatbots to Autonomous Systems
itchimonji
0
120
試作とデモンストレーション / Prototyping and Demonstrations
ks91
PRO
0
170
サービスの信頼性を高めるため、形骸化した「プロダクションミーティング」を立て直すまでの取り組み
stefafafan
1
220
「QA=テスト」「シフトレフト=スクラムイベントの参加者の一員」の呪縛を解く。アジャイルな開発を止めないために、10Xで挑んだ「右側のしわ寄せ」解消記 #scrumniigata
nihonbuson
PRO
3
630
Featured
See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
The Language of Interfaces
destraynor
162
26k
Building an army of robots
kneath
306
46k
Building a Modern Day E-commerce SEO Strategy
aleyda
45
9k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
2
1.4k
Paper Plane (Part 1)
katiecoart
PRO
0
7k
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
340
Optimising Largest Contentful Paint
csswizardry
37
3.7k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
820
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
110
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
54k
Design in an AI World
tapps
1
210
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を書きましょう!
ご清聴ありがとうございました