Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Cybozu Google I/O 2023 LT会 - WebAssembly

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for SiLeader SiLeader
June 09, 2023
Programming
0
1.1k

Cybozu Google I/O 2023 LT会 - WebAssembly

元の動画
WebAssembly: A new development paradigm for the web
https://youtu.be/RcHER-3gFXI

Avatar for SiLeader

SiLeader

June 09, 2023
Tweet

More Decks by SiLeader

See All by SiLeader
Cybozu Android Dev Summit 2022 LT会 - Something about storage on Android
Avatar for SiLeader sileader
0
1.1k

Other Decks in Programming

See All in Programming
CSC307 Lecture 14
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
450
maplibre-gl-layers - 地図に移動体たくさん表示したい
Avatar for Kouji Matsui kekyo
PRO
0
180
AI主導でFastAPIのWebサービスを作るときに 人間が構造化すべき境界線
Avatar for Jun okazaki okajun35
0
550
猫の手も借りたい！ので AIエージェント猫を作って社内に放した話 Claude Code × Container Lambda の Slack Bot "DevNeko"
Avatar for naramomi7 naramomi7
0
240
Ruby x Terminal
Avatar for Akira Matsuda a_matsuda
7
580
Takumiから考えるSecurity_Maturity_Model.pdf
Avatar for gessy0129 gessy0129
1
120
文字コードの話
Avatar for Masaki Hara qnighy
43
17k
Go1.26 go fixをプロダクトに適用して困ったこと
Avatar for Hiroki Kurasawa kurakura0916
0
330
クライアントワークでSREをするということ。あるいは事業会社におけるSREと同じこと・違うこと
Avatar for nnaka2992 nnaka2992
1
310
AWS×クラウドネイティブソフトウェア設計 / AWS x Cloud-Native Software Design
Avatar for nrs nrslib
2
160
AIに任せる範囲を安全に広げるためにやっていること
Avatar for Masashi Fukuzawa fukucheee
0
110
TROCCOで実現するkintone+BigQueryによるオペレーション改善
Avatar for shota sato ssxota
0
140

Featured

See All Featured
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
1.6k
How to build a perfect <img>
Avatar for Jono Alderson jonoalderson
1
5.2k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
Avatar for Sara Fernández Carmona sarafernandez
1
1.3k
Dealing with People You Can't Stand - Big Design 2015
Avatar for Cassini Nazir cassininazir
367
27k
My Coaching Mixtape
Avatar for mlcsv mlcsv
0
64
30 Presentation Tips
Avatar for Ian Lurie portentint
PRO
1
250
Amusing Abliteration
Avatar for ianozsvald ianozsvald
0
120
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
85
9.4k
The B2B funnel & how to create a winning content strategy
Avatar for Katarina Dahlin katarinadahlin
PRO
1
290
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
2.3k
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
21
1.4k
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k

Transcript

  1. WebAssembly Webの新しい開発パラダイム Google I/O 2023 LT会 みやもと

  2. Why use WebAssembly ? • ⾼いパフォーマンス • ⾼いポータビリティ • 安全

    • ⼈が読める • デバッグできる

  3. WebAssemblyの利⽤ Emscripten SwiftWasm Kotlin/Wasm ...

  4. JavaScriptとWebAssembly トランスパイル + 最適化 コンパイル + 最適化 JS Engine 内部表現

    Wasm Engine 内部表現 解釈 解釈 + 最適化 トランスパイルと ⼈の⼿⼊⼒の 可能性がある 実⾏前に 最適化が必要 最適化済みが ほぼ保証される 最適化を スキップできる

  5. WebAssemblyの利⽤ • FigmaはC++でWebAssemblyを使⽤ • ロード時間が3倍以上改善

  6. Kotlin MultiplatformとWebAssembly Web Kotlin Multiplatform Kotlin/Native Kotlin/JVM Kotlin/JS ビジネスロジック を共有!

  7. Kotlin MultiplatformとWebAssembly Web Kotlin Multiplatform Kotlin/Native Kotlin/JVM Kotlin/Wasm 2倍⾼速化！ ビジネスロジック

    を共有！

  8. FlutterとWebAssembly Web Dart AOT Dart AOT Dart JS UIとビジネスロジックを 共有！

  9. FlutterとWebAssembly Web Dart AOT Dart AOT Dart Wasm UIとビジネスロジックを 共有！

    2倍⾼速化！

  10. まとめ • WebAssemblyの利点 • ⾼速な動作 • 複数の⾔語が対応 • 多くのブラウザで利⽤可能 •

    Kotlin/Wasmにより⾼速なWebアプリがKotlinで記述可能 • Dart WasmによりFlutterアプリの⾼速化が可能

  11. 出典 • YouTube • WebAssembly: A new development paradigm for

    the web • https://youtu.be/RcHER-3gFXI • Figma • https://www.figma.com/ja/blog/webassembly-cut-figmas-load- time-by-3x/