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
port-monolith-to-wasm-for-chrome-extension
Search
Linda_pp
January 27, 2020
Programming
0
420
port-monolith-to-wasm-for-chrome-extension
Presented at Rust LT #8
https://rust.connpass.com/event/160225/
Linda_pp
January 27, 2020
Tweet
Share
More Decks by Linda_pp
See All by Linda_pp
actionlint の Linter 設計
rhysd
5
1.1k
ripgrep をライブラリとして使う
rhysd
0
320
Fuzzing Rust Text Editor
rhysd
1
2.9k
Vim compiled to WebAssembly
rhysd
5
2k
about-neovim-0.4.0-floating-window
rhysd
3
2k
reply.vim
rhysd
0
1.1k
Vim ported to WebAssembly (VimConf 2018)
rhysd
4
3.2k
go-selfupdate-github で ツールを自己アップデートする
rhysd
5
4.2k
小さく始めて育てるコンパイラ
rhysd
13
4.8k
Other Decks in Programming
See All in Programming
Mastering Developer Experience: A Roadmap for Success 【開発生産性Conference 2024】
findyinc
0
190
アプリケーションをリプレイスしたら チームとサービス運用に向き合えた
kazatohiei
1
340
5分でわかるExplicitly Built Modules
giginet
PRO
0
190
ドラ🔵もんでDIを学ぶ
tomo1227
0
4.9k
自分好みの TS バンドラを Rust で作れる!Deno の内部ライブラリの活用 – Denoで変わるランタイムの景色 実践事例 Lunch LT
pizzacat83
4
560
2024年版 Kotlin サーバーサイドプログラミング実践開発
n_takehata
3
1.1k
初心者がおさえておきたいAWS CDKのベストプラクティス 2024
konokenj
3
190
Micro Frontends for Java Microservices - KCDC 2024
mraible
PRO
1
270
プログラミングスクールのつながりがキャリアにつながるのかもしれない話 / Connections at programming schools may lead to a career
aiandrox
0
290
ゼロから始める型安全なGraphQL開発
shachi_daikon55
1
190
Fluent UI Blazor 最新Update
tomokusaba
1
160
Using Next.js as a full-stack framework / Next.jsをフルスタックフレームワークとして使ってみた
mongolyy
PRO
1
170
Featured
See All Featured
A Philosophy of Restraint
colly
199
16k
[RailsConf 2023] Rails as a piece of cake
palkan
31
4.3k
4 Signs Your Business is Dying
shpigford
177
21k
The Illustrated Children's Guide to Kubernetes
chrisshort
36
47k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
10
3.7k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
14
1.2k
10 Git Anti Patterns You Should be Aware of
lemiorhan
651
58k
Speed Design
sergeychernyshev
7
190
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.3k
The Mythical Team-Month
searls
217
42k
Stop Working from a Prison Cell
hatefulcrawdad
266
20k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
34
6.2k
Transcript
Monolith Λ Wasm ʹҠ২͠ ͯ Chrome ֦ுͭͬͨ͘ at Rust LT
#8 (2020/1/27) @Linda_pp @rhysd
monolith https://github.com/Y2Z/monolith
monolith • ࢦఆͨ͠ URL ͷϖʔδΛ1ͭͷ HTML ϖʔδͱ ͯ͠อଘ͢Δ CLI πʔϧ
• ϨεϙϯγϒͳϖʔδͳͲී௨ͷΣϒϖʔδ ͱͯͦ͠ͷ··ϩʔΧϧʹอଘͰ͖Δ • HTML ϖʔδΛύʔε͠ɼϦιʔεΛऔ͖ͬͯͯ Data URL ͱͯ͠ຒΊࠐΉ͜ͱͰ࣮͞Ε͍ͯΔ
monolith-of-web https://github.com/rhysd/monolith-of-web
monolith-of-web • monolith Λ wasm ʹҠ২͠ɼChrome ֦ுͱ ͯ͠ϒϥβ͔Β͑ΔΑ͏ʹͨ͠ͷ • ϒϥζ͍ͯ͠Δϖʔδͷ
HTML Λͦͷ·· ୯Ұͷ HTML ϖʔδʹͯ͠อଘͰ͖Δ
σϞ
:; NPOPMJUI SIZTE NPOPMJUI NPOPMJUIOQN QBDLBHF NPOPMJUIPGXFC CBDLHSPVOEQBHF GPSL XBTNQBDL
JOTUBOUJBUF
େ·͔ͳ wasm ͷҠ২ͷखॱ • wasm-pack buid ͕௨ΔΑ͏ʹ͢Δɽwasm ະରԠͷϞδϡʔ ϧ͕͋Δ߹#[cfg(target_arch =
"wasm32")] ͰॲཧΛ͚ Δ • wasm-bindgen Λ͍ɼ#[wasm_bindgen] Ͱ JS ଆʹݟͤΔ API Λఆٛ͢Δ #[cfg(not(target_arch = "wasm32"))] use reqwest::blocking::Client; #[wasm_bindgen(js_name = monolithOfUrl)] pub async fn monolith_of_url( url_target: String, options: MonolithOptions, ) -> Result<String, JsValue> { // ... }
network ϦΫΤετ • monolith Ϧιʔεͷ fetch ͷͨΊʹ reqwest ͷϒϩοΩ ϯά
API Λ͍ͬͯΔ • JavaScript ͷ fetch() ͱ async-await Λͬͯॻ͖͑ • js_sys::Promise std::future::Future ͷม؆୯ʹͰ͖Δ use wasm_bindgen_futures::JsFuture; let window = web_sys::window().unwrap(); let resp_value = JsFuture::from( window.fetch_with_request(&request) ).await?; let resp: Response = resp_value.dyn_into().unwrap();
࠶ؼؔͷ async-await Խ • ࠶ؼؔ await ࣌ʹอଘ͓ͯ͘͠ঢ়ଶͷαΠζ͕੩తʹ ܾ·Βͳ͍ͷͰɼasync ؔʹͰ͖ͳ͍ɽ •
monolith Ͱ DOM Λ࠶ؼతʹࠪ͠ͳ͕ΒϦιʔεΛ fetch ͍ͯͨ͠ͷͰɼ͜ͷΛ౿ΜͰ͍ͨ // ίϯύΠϧΤϥʔ async fn recursive() { recursive().await; recursive().await; }
࠶ؼؔͷ async-await Խ • ঢ়ଶʢFutureʣΛ Box ʹೖΕͯಈతʹཧ͢Δ͜ͱͰճ ආͰ͖Δ use std::pin::Pin;
use std::future::Future; fn recursive<'a>() -> Pin<Box<dyn Future<Output = ()> + 'a>> { Box::pin(async move { recursive().await; recursive().await; }) }
·ͱΊ • Rust ͷ CLI πʔϧ monolith Λ wasm ʹҠ
২ͯ͠ Chrome ֦ுʹͯ͠Έͨ • https://github.com/rhysd/monolith-of-web • async-await wasm Ͱ wasm_bindgen_futures Ͱ؆୯ʹ͑Δ @Linda_pp @rhysd presented by